trotz Verweis auf Alternative wollen Browser Plugin laden
joerghigert
- javascript
0 JürgenB1 Cheatah0 joerghigert0 suit0 joerghigert0 suit
0 joerghigert
Guten Tag allerseits,
ich möchte als erstes darauf verweisen, das ich im Moment erst beginne mich mit JS auseinanderzusetzen, oder mit anderen Worten: Ich bin in Sachen Javascript bzw. Scripting überhaupt ein Dau.
Zum Problem:
Dem Besucher einer Website soll bei Aufruf der Site automatisch eine Animation, in diesem Fall eine kurze Videosequenz, gezeigt werden. Gewählt wurde hierfür das mp4-Format, welches dann mit Hilfe des installierten Quicktime Plugins des Browsers angezeigt werden soll. Für Besucher der Seite, welche kein Quicktime installiert haben, soll die gleiche Animation mit Hilfe von Flash angezeigt werden. Hierfür wird mittels SWF-Container ebenfalls die mp4-Datei auf dem Server genutzt.
Um zu prüfen, ob im Browser des Besuchers Quicktime installiert ist habe ich eine entsprechende Abfrage in die Site integriert:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta http-equiv="expires" content="0">
<meta http-equiv="cache-control" content="no-cache">
<meta name="robots" content="index">
<meta name="robots" content="follow">
<meta name="robots" content="all">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="language" content="de">
<meta http-equiv="content-language" content="de">
<title>Fegefeuer - Dortmund ... der neue Szene-Shop im Pott</title>
<script src="animation2.js" type="text/javascript"></script>
<SCRIPT LANGUAGE="Javascript" type="text/javascript">
var qtvorhanden = false;
</SCRIPT>
<SCRIPT LANGUAGE="VBScript">
On Error Resume Next
Set theObject =
CreateObject("QuickTimeCheckObject.QuickTimeCheck.1")
On Error goto 0
If IsObject(theObject) Then
If theObject.IsQuickTimeAvailable(0) Then
qtvorhanden = true
End If
End If
</SCRIPT>
<SCRIPT LANGUAGE="Javascript" type="text/javascript">
if (navigator.plugins) {
for (i=0; i < navigator.plugins.length; i++ ) {
if (navigator.plugins[i].name.indexOf
("QuickTime") >= 0)
{ qtvorhanden = true; }
}
}
if ((navigator.appVersion.indexOf("Mac") > 0)
&& (navigator.appName.substring(0,9) == "Microsoft")
&& (parseInt(navigator.appVersion) < 5) )
{ qtvorhanden = true; }
</SCRIPT>
<style type="text/css">
<!--
body,td,th {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
}
body {
background-color: #000000;
}
-->
</style>
</head>
<body>
<p align="center">
<script language="JavaScript" type="text/javascript">
animation();
</script>
</p>
</body>
</html>
... die eigentliche Funktion habe ich in eine externe Datei mit Namen "animation2.js" ausgelagert:
function animation() {
if (qt_vorhanden = true) {
document.write('<object classid="clsid:02bf25d5-8c17-4b23-bc80-d3488abddc6b" codebase="http://www.apple.com/qtactivex/qtplugin.cab" width="768" height="576">'
+ '<param name="src" value="http://www.ebm-front-ruhr.de/fegefeuer/bilder/coverani.mp4" />'
+ '<param name="autoplay" value="true" />'
+ '<param name="controller" value="false" />'
+ '<param name="cache" value="false" />'
+ '<param name="kioskmode" value="true" />'
+ '<!--[if !IE]> -->'
+ '<object type="video/quicktime" data="http://www.ebm-front-ruhr.de/fegefeuer/bilder/coverani.mp4" width="768" height="576">'
+ '<param name="pluginspage" VALUE="http://quicktime.apple.com/" />'
+ '<param name="autoplay" value="true" />'
+ '<param name="controller" value="false" />'
+ '<param name="kioskmode" value="true" />'
+ '<param name="cache" value="false" />'
+ '</object>'
+ '<!--<![endif]-->'
+ '</object>');
}
else {
document.write('<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="768" height="576" id="coverani" align="middle">'
+ '<param name="movie" value="http://www.ebm-front-ruhr.de/fegefeuer/bilder/coverani.swf"/>'
+ '<param name="play" value="false" />'
+ '<param name="menu" value="false" />'
+ '<param name="loop" value="false" />'
+ '<param name="allowfullscreen" value="false" />'
+ '<param name="quality" value="high" />'
+ '<!--[if !IE]>-->'
+ '<object type="application/x-shockwave-flash" data="http://www.ebm-front-ruhr.de/fegefeuer/bilder/coverani.swf" width="768" height="576">'
+ '<param name="movie" value="http://www.ebm-front-ruhr.de/fegefeuer/bilder//coverani.swf"/>'
+ '<param name="play" value="false" />'
+ '<param name="menu" value="false" />'
+ '<param name="loop" value="false" />'
+ '<param name="allowfullscreen" value="false" />'
+ '<param name="quality" value="high" />'
+ '<!--[if !IE]>-->'
+ '</object>'
+ '<!--<![endif]-->'
+ '</object>');
}
}
Das Problem ist nun, sofern Quicktime nicht installiert ist versuchen alle getesteten Browser (IE 8, Firefox, Safari) das entsprechende Plugin zu installieren, statt die Animation per Flash anzuzeigen. Ich kann mir nicht erklären warum, denn sofern ich statt den "object.write('xxx'),"-Anweisungen zwei entsprechende Alerts einsetze, wird die jeweilig richtige Meldung auf dem Bildschirm ausgegeben.
Was habe ich falsch gemacht? Kann mir jemand einen Rat geben?
Danke schon mal im Voraus
Jörg
P.S.: den Pfad zur Site auf dem Server findet Ihr im Kopf ...
P.P.S.: Ich würde gerne auch die eigentliche Plugin-Abfrage lieber in die externe Datei auslagern, hab aber keinen blassen Schimmer wie das zu bewerkstelligen ist (Schreibweise in der externen Datei). Kann mir dabei vielleicht jemand helfen?
Hallo joerghigert,
nur kurz drüber gesehen:
if (qt_vorhanden = true) {
das ist eine Zuweisung, der Vergleich geht mit "==". In diesem Fall würde aber
if (qt_vorhanden)
reichen.
Gruß, Jürgen
Hallo joerghigert,
nur kurz drüber gesehen:
if (qt\_vorhanden = true) {
das ist eine Zuweisung, der Vergleich geht mit "==". In diesem Fall würde aber
if (qt_vorhanden)
reichen.
Gruß, Jürgen
Hallo Jürgen,
ich merke schon, ich hab da noch einen langen Weg vor mir. Wie so oft hat also eine kleine Ursache eine grosse Wirkung.
Danke für die Hilfe
Gruss Jörg
Hi,
Dem Besucher einer Website soll bei Aufruf der Site automatisch eine Animation, in diesem Fall eine kurze Videosequenz, gezeigt werden. Gewählt wurde hierfür das mp4-Format, welches dann mit Hilfe des installierten Quicktime Plugins des Browsers angezeigt werden soll. Für Besucher der Seite, welche kein Quicktime installiert haben, soll die gleiche Animation mit Hilfe von Flash angezeigt werden. Hierfür wird mittels SWF-Container ebenfalls die mp4-Datei auf dem Server genutzt.
Um zu prüfen, ob im Browser des Besuchers Quicktime installiert ist habe ich eine entsprechende Abfrage in die Site integriert:
der Browser kann von sich aus prüfen, ob er den im <object>-Element angegebenen Typus unterstützt. Tut er dies nicht, verwendet er den Inhalt des <object> zur Darstellung - welcher beispielsweise ein weiteres <object> mit einem anderen Typus sein kann.
Wo genau brauchst Du jetzt JavaScript?
Cheatah
Hi,
Dem Besucher einer Website soll bei Aufruf der Site automatisch eine Animation, in diesem Fall eine kurze Videosequenz, gezeigt werden. Gewählt wurde hierfür das mp4-Format, welches dann mit Hilfe des installierten Quicktime Plugins des Browsers angezeigt werden soll. Für Besucher der Seite, welche kein Quicktime installiert haben, soll die gleiche Animation mit Hilfe von Flash angezeigt werden. Hierfür wird mittels SWF-Container ebenfalls die mp4-Datei auf dem Server genutzt.
Um zu prüfen, ob im Browser des Besuchers Quicktime installiert ist habe ich eine entsprechende Abfrage in die Site integriert:der Browser kann von sich aus prüfen, ob er den im <object>-Element angegebenen Typus unterstützt. Tut er dies nicht, verwendet er den Inhalt des <object> zur Darstellung - welcher beispielsweise ein weiteres <object> mit einem anderen Typus sein kann.
Wo genau brauchst Du jetzt JavaScript?
Cheatah
Hallo Cheatah,
Du meinst eine verschachtelte <object>-Anweisung im HTML-Code. Das war meine ursprüngliche Variante, allerdings habe ich dann gelesen, das es im IE wohl ein grundsätzliches Problem mit dem automatischen Ausführen z.B. des Quicktime Plugins geben soll. Von Seiten der Autorin wurde daher alternativ der Aufruf per Javascript-Funktion empfohlen. Dies fand ich auch von Seiten Apples auf einer Seite in deren Entwickler-Bereich bestätigt. Um diesem eventuellen Problem aus dem Weg zu gehen, habe ich mich zu der empfohlenen Lösung per Javascript durchgerungen. Ich weiss allerdings nicht, inwieweit diese Information noch aktuell ist.
Gruss Jörg
Du meinst eine verschachtelte <object>-Anweisung im HTML-Code. Das war meine ursprüngliche Variante, allerdings habe ich dann gelesen, das es im IE wohl ein grundsätzliches Problem mit dem automatischen Ausführen z.B. des Quicktime Plugins geben soll.
Das kann dir doch Wurst sein, wenn du die Flash-Lösung primär anbietest und die Quicktime-Variante als Fallback für der Rest (und da meinetwegen noch einen Fallback mit Bildern oder was auch immer).
Du meinst eine verschachtelte <object>-Anweisung im HTML-Code. Das war meine ursprüngliche Variante, allerdings habe ich dann gelesen, das es im IE wohl ein grundsätzliches Problem mit dem automatischen Ausführen z.B. des Quicktime Plugins geben soll.
Das kann dir doch Wurst sein, wenn du die Flash-Lösung primär anbietest und die Quicktime-Variante als Fallback für der Rest (und da meinetwegen noch einen Fallback mit Bildern oder was auch immer).
Grundsätzlich wäre es natürlich gegangen, die Sache hat allerdings einen Haken ... nachdem die Animation durchlaufen wurde, soll das letzte Bild (in diesem Fall ein Logo) weiter auf der Seite zu sehen sein. Dies geht entweder :
1. per GIF-Animation
2. indem der jeweilige Player nicht automatisch ein Rewind durchführt (in Quicktime ist dies Standard)
oder
3. indem nach dem Durchlaufen der Animation der Player ausgeblendet und dafür dann das Logo als Bild angezeigt
... wird.
Die Verwendung einer GIF-Animation fiel aus, da für eine einigermaßen natürlich wirkende Darstellung des aus den Flammen entstehenden Logos die gesamte Animation aus über 150 Einzelbildern bestehen müsste. Bei einer Auflösung von 800 x 600 Pixeln wird die Datei nicht gerade klein. Hinzu kommen die bekannten Einschränkungen in der Farbtiefe, diese sind leider auch nicht gerade förderlich in Bezug auf die Natürlichkeit der Darstellung. Alternativ hatten wir schon über eine PNG-Animation nachgedacht, doch welcher Browser kann damit wirklich umgehen?
Bei Verwendung des Flash Plugin stellt sich laut Elisabeth Castro und Apple im IE letztlich die gleiche Problematik wie bei Quicktime, da dieser ein allgemein geltendes Problem mit dem automatischen Auslösenden ActiveX-Komponenten haben soll. Auch hier wird von Beiden eine Umgehung des Problems mit Hilfe von Javascript empfohlen.
Im weiteren stellt sich bei einer Flash-Animation die Frage, wie setzt man den Parameter "autoRewind" innerhalb des SWF-Containers auf "false", damit die Animation nach Durchlaufen nicht automatisch auf das Startbild zurückgesetzt wird. Ich kenne zumindest keine frei verfügbare Software-Lösung, welche das könnte. Auch habe ich bisher keinen frei verfügbaren Flash- bzw. FLV-Player ausfindig machen können, bei dem sich ein "autoRewind" per Parameterangabe innerhalb einer <object>-Anweisung unterbinden liesse. Ich konnte dieses Problem nur mittels Flash selbst lösen.
Eine Lösung in der Form erst die Animation abspielen, im Anschluss dann den Player aus- und dafür dann ein Bild einzublenden, lässt sich meines Wissens nach auch nur mit Hilfe von JavaScript umsetzen. Und bei einem "autoRewind" des Players wäre die Darstellung nicht durchgängig, da das erste Bild der Animation einfach schwarz ist, während das letzte Bild der Animation das Logo zeigt.
Und letztlich kamen bei unserer Entscheidungsfindung auch noch die Umstände hinzu, das sowohl Flash als auch Quicktime nicht standardmässig auf jedem System installiert sind, Flash unter iOS nicht unterstützt wird und auch eine HTML5-Syntax in einigen von uns getesteten Browsern noch nicht wirklich funktionierte. Von daher haben wir uns entschieden, quasi ein zum üblichen Standard umgekehrten Fallback von Quicktime zu Flash einzurichten und den Prozess der Aktivierung des Plugins per JavaScript auszulösen.
Eine wie ich finde nicht wirklich schöne und für mich als JavaScript-Dau doch recht aufwendige Methode. Doch was soll ich machen? Wenn Du, oder auch jemand anderes, eine bessere Lösung anzubieten hast/hat ... immer her damit.
Gruss Jörg
Grundsätzlich wäre es natürlich gegangen, die Sache hat allerdings einen Haken ... nachdem die Animation durchlaufen wurde, soll das letzte Bild (in diesem Fall ein Logo) weiter auf der Seite zu sehen sein. Dies geht entweder :
Dann nimm ein fertiges Player-Framework - der flowplayer ist z.B. recht praktisch - da definierst du, wenn das Abspielen beendet ist, wird der Player zerstört und wieder durch das Teaserbild ausgetauscht.
P.P.S.: Ich würde gerne auch die eigentliche Plugin-Abfrage lieber in die externe Datei auslagern, hab aber keinen blassen Schimmer wie das zu bewerkstelligen ist (Schreibweise in der externen Datei). Kann mir dabei vielleicht jemand helfen?
Ok ... das Thema hat sich mittlerweile erledigt, hab's mit etwas Lesen und Probieren selbst herausgefunden.