MediaElement.js setSrc() Laden Der Datei Aber Nicht Ändern pluginType

Ich arbeite an einer Seite mit mediaelement.js zu spielen mp3/mp4/wmv (ja, wir haben eine Menge von wmv). Ich habe eine Liste von links und die links ändern sollten, Spieler. Mein Bestreben ist es, änderungen vornehmen, um die Spieler über javascript, damit die Seite nicht aktualisieren.

Dieser code funktioniert, aber er aktualisiert jedes mal. (link entfernt)

<?php
$file = null;
$file = $_GET["file"];
$format = null;
if (preg_match("/mp4/i", $file)) $format = "mp4";
if (preg_match("/webm/i", $file)) $format = "webm";
if (preg_match("/wmv/i", $file)) $format = "wmv";
if (preg_match("/mp3/i", $file)) $format = "mp3";
if (preg_match("/ogg/i", $file)) $format = "ogg";
$mime = null;
if ($format == "mp4") $mime = "video/mp4";
if ($format == "webm") $mime = "video/webm";
if ($format == "wmv") $mime = "video/wmv";
if ($format == "mp3") $mime = "audio/mp3";
if ($format == "ogg") $mime = "audio/ogg";
$element = "video";
if ($format == "mp3" || $format == "ogg") $element = "audio";
//you have to escape  (\) the escape (\) character (hehehe...)
$poster = "media\\120701Video.jpg";
$height = "360";
if ($format == "mp3") $height = "30";
?>
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Embed</title>
<link rel="stylesheet" href="include/johndyer-mediaelement-b090320/build/mediaelementplayer.min.css">
<style>
audio {width:640px; height:30px;}
video {width:640px; height:360px;}
</style>
<script src="include/johndyer-mediaelement-b090320/build/jquery.js"></script>
<script src="include/johndyer-mediaelement-b090320/build/mediaelement-and-player.js"></script>
</head>
<body>
<ul>
    <li><a href="embed.php">Reset</a></li>
    <li><a href="?file=media/120701Video-AnyVideoConverter.mp4">Alternative (mp4)</a></li>
    <li><a href="?file=media/120701Video-Ffmpeg-Defaults.webm">Alternative (webm)</a></li>
    <li><a href="?file=media/AreYouHurting-Death.wmv">Alternative (wmv)</a><li>
    <li><a href="?file=media/AreYouHurting-Death.mp3">Alternative (mp3)</a></li>
</ul>
<?php if ($file) { ?>
<video src="<?php echo $file; ?>" controls poster="<?php echo $poster; ?>" width="640" height="360"></video>
<div id="type"></div>
<script>
var video = document.getElementsByTagName("video")[0];
var player = new MediaElementPlayer(video, {
    success: function(player) {
        $('#type').html(player.pluginType);
    }
});
<?php } ?>
</script>
</body>
</html>

Dieser code erfordert <video> geladen werden, zunächst mit einer Datei, so dass die Spieler-Modus (pluginType) festgelegt ist. Es wird dann nur gespielt werden, dass die vorab festgelegten Modus unterstützt (firefox im native-Modus nicht spielen mp4). Sehen live-demo der ajax-version.

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Embed</title>
<link rel="stylesheet" href="http://www.mediaelementjs.com/js/mejs-2.9.2/mediaelementplayer.min.css">
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script src="http://www.mediaelementjs.com/js/mejs-2.9.2/mediaelement-and-player.js"></script>
</head>
<body>
<ul>
    <li><a href="javascript:player.pause(); player.setSrc('media/120701Video-AnyVideoConverter.mp4'); player.load(); player.play();">Alternative (mp4)</a></li>
    <li><a href="javascript:player.pause(); player.setSrc('media/120701Video-Ffmpeg-Defaults.webm'); player.load(); player.play();">Alternative (webm)</a></li>
    <li><a href="javascript:player.pause(); player.setSrc('media/AreYouHurting-Death.wmv'); player.load(); player.play();">Alternative (wmv)</a></li>
    <li><a href="javascript:player.pause(); player.setSrc('media/AreYouHurting-Death.mp3'); player.load(); player.play();">Alternative (mp3)</a></li>
</ul>
<video controls src="media/WordProductionCenter.mp4"></video>
<div id="type"></div>
<script>
var video = document.getElementsByTagName("video")[0];
var player = new MediaElementPlayer(video, {
    success: function(player) {
        $('#type').html(player.pluginType);
    }
});
</script>
</body>
</html>

Wie es scheint, ich brauche so etwas wie setType(), aber ich sehe keine solche option. Ich habe gelesen, ein paar Seiten, die referenziert aktualisieren der DOM -, nachdem javascript ausgeführt wird, aber ich habe nicht in der Lage, erfolgreich zu tun (ich weiß genug über die javascript-hack um Sachen und Sachen arbeiten, aber nicht genug, um ganz neue Dinge).

Es ist erwähnenswert, dass Silverlight funktioniert nicht mit Internet Explorer 8 oder Safari (nicht sicher, ob es meinem code mejs, oder den Browser). Auch werden weder Silverlight noch Flash-spielen, mp3-oder webm (wieder nicht sicher, wo das problem liegt).

Ist es ein Weg, um dynamisch geladen, verschiedene Arten von Dateien in mediaelement?

  • Gut, ich habe, bis auf diese. Ich kann einfach nicht scheinen, um es zu arbeiten, wie ich erwarte. Auf zu anderen Projekten...
InformationsquelleAutor doubleJ | 2012-07-11
Schreibe einen Kommentar