Classe Javascript per il rilevamento di Flash
Mercoledì 3 Gennaio, 2007Anche se non si realizza un sito interamente in Flash, alcuni componenti possono presentarsi comunque all'interno della pagina, come banner, claim, visori RSS, ecc... Eco quindi un modo semplice per verificare se Flash è attivo e installato. Proponiamo qui un metodo che non necessità di più pagine, come proposto dalla stessa Adobe. Faremo in modo di risolvere tutto all'interno di un'unica pagina.
La classe qui presentata permette anche di risolvere l'ultimo problema nato con Explorer, ovvero quello dell'attivazione di un controllo ActiveX. Per risolverlo basta utilizzare Javascript per inserire il componente Flash, proprio quello che fa la nostra classe.
La prima cosa di cui abbiamo bisogno è una simpatica classe Javascript che ci permetterà di eseguire tutti i controlli necessari:
-
<!--
-
/*
-
** Detect Flash Class & Path insertFlash Object
-
**
-
*/
-
-
var df = {
-
__release: "1.0",
-
_isIE: ( (navigator.appVersion.indexOf("MSIE") != -1) ? true : false),
-
_isWin:( (navigator.appVersion.toLowerCase().indexOf("win") != -1) ? true : false),
-
_isOpera:( (navigator.userAgent.indexOf("Opera") != -1) ? true : false),
-
-
getSwfVer: function (i) {
-
// Le versioni di NS/Opera dalla 3 in poi verificano la presenza del plug-in Flash nell'array dei plug-in
-
if (navigator.plugins != null && navigator.plugins.length> 0) {
-
if (navigator.plugins["Shockwave Flash 2.0"] || navigator.plugins["Shockwave Flash"]) {
-
var swVer2 = navigator.plugins["Shockwave Flash 2.0"] ? " 2.0" : "";
-
var flashDescription = navigator.plugins["Shockwave Flash" + swVer2].description;
-
var descArray = flashDescription.split(" ");
-
var tempArrayMajor = descArray[2].split(".");
-
var versionMajor = tempArrayMajor[0];
-
var versionMinor = tempArrayMajor[1];
-
if ( descArray[3] != "" ) var tempArrayMinor = descArray[3].split("r");
-
else var tempArrayMinor = descArray[4].split("r");
-
//
-
var versionRevision = tempArrayMinor[1]> 0 ? tempArrayMinor[1] : 0;
-
var flashVer = versionMajor + "." + versionMinor + "." + versionRevision;
-
} else var flashVer = -1;
-
}
-
else if (navigator.userAgent.toLowerCase().indexOf("webtv/2.6") != -1) flashVer = 4;
-
else if (navigator.userAgent.toLowerCase().indexOf("webtv/2.5") != -1) flashVer = 3;
-
else if (navigator.userAgent.toLowerCase().indexOf("webtv") != -1) flashVer = 2;
-
else flashVer = -1;
-
//
-
return flashVer;
-
},
-
-
detectFlashVer:function (reqMajorVer, reqMinorVer, reqRevision) {
-
var reqVer = parseFloat(reqMajorVer + "." + reqRevision);
-
for (var i=25;i>0;i--) {
-
if (this._isIE && this._isWin && !this._isOpera) var versionStr = VBgetSwfVer(i);
-
else var versionStr = this.getSwfVer(i);
-
if (versionStr == -1 ) return false;
-
else if (versionStr != 0) {
-
if(this._isIE && this._isWin && !this._isOpera) {
-
var tempArray = versionStr.split(" ");
-
var tempString = tempArray[1];
-
var versionArray = tempString .split(",");
-
} else var versionArray = versionStr.split(".");
-
//
-
var versionMajor = versionArray[0];
-
var versionMinor = versionArray[1];
-
var versionRevision = versionArray[2];
-
-
var versionString = versionMajor + "." + versionRevision; // 7.0r24 == 7.24
-
var versionNum = parseFloat(versionString);
-
// è la versione maggiore>= versione maggiore richiesta è la versione minore>= versione minore richiesta
-
if ( (versionMajor> reqMajorVer) && (versionNum>= reqVer) ) return true;
-
else return ((versionNum>= reqVer && versionMinor>= reqMinorVer) ? true : false );
-
}
-
}
-
return (reqVer ? false : 0.0);
-
},
-
-
// TO DO
-
insertFlash: function(n,w,h) {
-
if( this.detectFlashVer(8,0,0) ) {
-
n += ".swf";
-
document.write( '<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,29,0" width="'+w+'" height="'+h+'">\n' );
-
document.write( '<param name="movie" value="'+n+'" />\n');
-
document.write( '<param name="quality" value="auto" />\n' );
-
document.write( '<embed src="'+n+'" width="'+w+'" height="'+h+'" quality="auto" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash"></embed>\n' );
-
document.write( '</object>\n');
-
} else document.write( '<a id="flash_alternate" target="_blank" href="http://www.adobe.com/go/getflashplayer"></a>' );
-
}
-
};
-
-
//-->
Come al solito, Internet Explorer (7) si differenzia e vuole un codice appositamente strutturato in VBScript:
-
<!-- //
-
Function VBgetSwfVer(i)
-
on error resume next
-
Dim swControl, swVersion
-
swVersion = 0
-
set swControl = CreateObject("ShockwaveFlash.ShockwaveFlash." + CStr(i))
-
if (IsObject(swControl)) then
-
swVersion = swControl.GetVariable("$version")
-
end if
-
VBGetSwfVer = swVersion
-
End Function
-
// -->
Salviamo questi due file (df.js e df.vbs nella cartella js) e includiamoli nella nostra pagina (index.html, index.php o default.html, ecc...) all'interno del TAG HEAD.
Ora abbiamo tutto il necessario e possiamo spostarci nella pagina che conterrà l'oggetto Flash. Posizionatevi nel punto dove Flash sarà visualizzato e inserite il seguente codice:
-
<script language="javascript1.2" type="text/javascript">df.insertFlash("flash/splash","900","122");</script>
Nell'esempio abbiamo assunto che esista un file splash.swf nella cartella flash! Notate che non è necessario inserire l'estensione swf. I due numeri 900 e 122 sono le dimensioni.
Ancora meglio sarebbe supportare il caso - remoto - dove Javascript è stato disabilitato. In questa circostanza potete scegliere di procedere in due modi:
1. Inseire direttamente in codice OBJECT/EMBED
2. Notificare che Javascript è disabilitato
Nel primo caso perdiamo il controllo sulla presenza di Flash ed Explorer richiederà di attivare il controllo ActiveX. Tuttavia il filmato sarà visibile, se Flash è installato.
Nel secondo caso possiamo mostrare un'immagine e/o notoficare che con Javascript spento non è possibile verificare la presenza del Plug-in Adobe Flash. Ad esempio, scegliendo la soluzione numero 1:
-
<div id="claim">
-
<script language="javascript1.2" type="text/javascript">df.insertFlash("flash/splash","900","122");</script>
-
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" width="900" height="122">
-
<param name="movie" value="flash/splash.swf" />
-
<param name="quality" value="high" />
-
<embed src="flash/splash.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="900" height="122"></embed>
-
</object>
-
</noscript>
-
</div>
Rilevare Flash e gestire le numerose alternative, come spiegato su Flash detect: come rilevare Flash, non è proprio comodissimo, speriamo almeno che la cosa non andrà a peggiorare con il tempo.
In realtà tu hai ragione, e non sei il primo a...
undolog » Blog Archive » Unobtrusive Flash Objects ha detto:
[...] Unobtrusive Flash Objects Tags: ActionScript, ActionScript 3.0, Adobe, DHTML, Flash, Flash Player, Internet, Javascript, Macromedia, Prototype, Prototype.js, scriptaculous, Sviluppo, Unobtrusive, Unobtrusive JavaScriptL’inserimanto di oggetti (in particolare Flash Objects) all’interno delle pagine Web è diventato ultimamente un’attività spesso stressante. In altri Post abbiamo già affrontato l’argomento di come rilevare Flash ed inserirlo nelle pagine in modo appropriato. Dato che abbiamo parlato di tecniche Unobtrusive, vi segnalo due noti script in grado di rilevare (ed eventualmente installare) ed inserire oggetti Flash in una pagina, in modo assai afficiente e poco intrusivo: SWFObject e UFO. Entrambi gli script offrono in sostanza le stesse caratteristiche e un funzionamento identico. L’approccio è quello che sostituire tramite Javascript un determinato TAG con il contenuto Flash. Come sappiamo questo procedimento elimina il problema dell’attivazione dell’oggetto Flash imposto da Internet Explorer, tuttavia implica che Javascript sia attivato sul target-browser. Entrambi gli script non fanno uso di librerie esterne, come Prototype.js ad esempio. La differenza più importante tra i due è che SWFObject va chiamato quando il TAG da sostituire è già stato caricato nella pagina, modalità non propriamente Unobtrusive. Ecco uno stralcio di codice che mostra la sequenza di chiamata: PLAIN TEXT HTML: [...]