Classe Javascript per il rilevamento di Flash

Mercoledì 3 Gennaio, 2007

Anche 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:

PLAIN TEXT
JavaScript:
  1. <!--
  2.     /*
  3.     ** Detect Flash Class & Path insertFlash Object
  4.     **
  5.     */
  6.  
  7. var df = {
  8.     __release: "1.0",
  9.     _isIE: ( (navigator.appVersion.indexOf("MSIE") != -1) ? true : false),
  10.     _isWin:( (navigator.appVersion.toLowerCase().indexOf("win") != -1) ? true : false),
  11.     _isOpera:( (navigator.userAgent.indexOf("Opera") != -1) ? true : false),
  12.    
  13.     getSwfVer: function (i) {
  14.         // Le versioni di NS/Opera dalla 3 in poi verificano la presenza del plug-in Flash nell'array dei plug-in
  15.         if (navigator.plugins != null && navigator.plugins.length> 0) {
  16.             if (navigator.plugins["Shockwave Flash 2.0"] || navigator.plugins["Shockwave Flash"]) {
  17.                 var swVer2 = navigator.plugins["Shockwave Flash 2.0"] ? " 2.0" : "";
  18.               var flashDescription = navigator.plugins["Shockwave Flash" + swVer2].description;
  19.                 var descArray = flashDescription.split(" ");
  20.                 var tempArrayMajor = descArray[2].split(".");
  21.                 var versionMajor = tempArrayMajor[0];
  22.                 var versionMinor = tempArrayMajor[1];
  23.                 if ( descArray[3] != "" ) var tempArrayMinor = descArray[3].split("r");
  24.                 else var tempArrayMinor = descArray[4].split("r");
  25.                 //
  26.               var versionRevision = tempArrayMinor[1]> 0 ? tempArrayMinor[1] : 0;
  27.                 var flashVer = versionMajor + "." + versionMinor + "." + versionRevision;
  28.             } else    var flashVer = -1;
  29.         }
  30.         else if (navigator.userAgent.toLowerCase().indexOf("webtv/2.6") != -1) flashVer = 4;
  31.         else if (navigator.userAgent.toLowerCase().indexOf("webtv/2.5") != -1) flashVer = 3;
  32.         else if (navigator.userAgent.toLowerCase().indexOf("webtv") != -1) flashVer = 2;
  33.         else flashVer = -1;
  34.         //
  35.         return flashVer;
  36.     },
  37.    
  38.     detectFlashVer:function (reqMajorVer, reqMinorVer, reqRevision) {
  39.         var reqVer = parseFloat(reqMajorVer + "." + reqRevision);
  40.         for (var i=25;i>0;i--) {   
  41.             if (this._isIE && this._isWin && !this._isOpera) var versionStr = VBgetSwfVer(i);
  42.             else var versionStr = this.getSwfVer(i);
  43.             if (versionStr == -1 ) return false;
  44.             else if (versionStr != 0) {
  45.                 if(this._isIE && this._isWin && !this._isOpera) {
  46.                     var tempArray         = versionStr.split(" ");
  47.                     var tempString        = tempArray[1];
  48.                     var versionArray      = tempString .split(",");    
  49.                 } else var versionArray = versionStr.split(".");
  50.                 //
  51.                 var versionMajor      = versionArray[0];
  52.                 var versionMinor      = versionArray[1];
  53.                 var versionRevision   = versionArray[2];
  54.                
  55.                 var versionString     = versionMajor + "." + versionRevision;   // 7.0r24 == 7.24
  56.                 var versionNum        = parseFloat(versionString);
  57.                 // è la versione maggiore>= versione maggiore richiesta è la versione minore>= versione minore richiesta
  58.                 if ( (versionMajor> reqMajorVer) && (versionNum>= reqVer) ) return true;
  59.                 else return ((versionNum>= reqVer && versionMinor>= reqMinorVer) ? true : false );
  60.             }
  61.         }   
  62.         return (reqVer ? false : 0.0);
  63.     },
  64.    
  65.     // TO DO
  66.     insertFlash: function(n,w,h) {
  67.         if( this.detectFlashVer(8,0,0) ) {
  68.             n += ".swf";
  69.             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' );
  70.             document.write( '<param name="movie" value="'+n+'" />\n');
  71.             document.write( '<param name="quality" value="auto" />\n' );
  72.             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' );
  73.             document.write( '</object>\n');
  74.         } else document.write( '<a id="flash_alternate" target="_blank" href="http://www.adobe.com/go/getflashplayer"></a>' );
  75.     }   
  76. };
  77.  
  78. //-->

Come al solito, Internet Explorer (7) si differenzia e vuole un codice appositamente strutturato in VBScript:

PLAIN TEXT
Visual Basic:
  1. <!-- //
  2.     Function VBgetSwfVer(i)
  3.       on error resume next
  4.       Dim swControl, swVersion
  5.       swVersion = 0
  6.       set swControl = CreateObject("ShockwaveFlash.ShockwaveFlash." + CStr(i))
  7.       if (IsObject(swControl)) then
  8.         swVersion = swControl.GetVariable("$version")
  9.       end if
  10.       VBGetSwfVer = swVersion
  11.     End Function
  12. // -->

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.

PLAIN TEXT
HTML:
  1. <script language="javascript1.2" type="text/javascript" src="js/df.js"></script>
  2. <script language="VBScript" type="text/vbscript" src="js/df.vbs"></script>

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:

PLAIN TEXT
HTML:
  1. <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:

PLAIN TEXT
HTML:
  1. <div id="claim">
  2.     <script language="javascript1.2" type="text/javascript">df.insertFlash("flash/splash","900","122");</script>
  4.         <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">
  5.                       <param name="movie" value="flash/splash.swf" />
  6.                       <param name="quality" value="high" />
  7.                       <embed src="flash/splash.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="900" height="122"></embed>
  8.         </object>
  9.     </noscript>
  10. </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.

Post correlati

Tags: , , , , ,
Pubblicato in Flash, Internet, Javascript, Sviluppo | 1 commento »