Se è vero che la prima impressione è quella che conta, perchè questo non vale per le applicazioni Silverlight?
Alla data di oggi l’adozione mondiale di Silverlight è attorno al 60%, questo significa che il 40% degli utenti che finiscono sulla nostra pagina quello che si ritrovano è un desolante:

image oppure image

che per un utente non esperto potrebbe significare tutto e niente.
Non sarebbe meglio fornire un esperienza più “amichevole” e magari riuscire anche a capire, tra gli utenti che non hanno Silverlight, quanti hanno deciso di installare il plug-in e quanti invece hanno abbandonato la pagina?

image

La buona notizia è che grazie a un framework (in realtà poco pubblicizzato) chiamato SILF (Silverlight Install and Logging Framework) http://mediaevangelism.com/silf/silf.html tutto questo è molto semplice, basta sostituire il file silverlight.js del progetto web col file silf.js (visto che sono quasi 100K è consigliata la compressione)

   1: <script type="text/javascript" src="silf.js"></script>

e  aggiungere nella pagina che ospita il plug-in uno script che inizializza il framework:

   1: <script type="text/javascript">
   2:        SILF.appName = "Test";
   3:        SILF.appVersion = "1.2.3";
   4:        SILF.logEntryflow = true;
   5:        SILF.logInstall = true;
   6:        SILF.loggingURIinstall = "http://mysite.com/public?state=install";  
   7:      SILF.minSlVersion = "3.0.50106.0";
   8:      SILF.SilverlightControlHost = "silverlightControlHost";
   9:      // div which contains Silverlight control 
  10:      // Use this section to configure messages
  11:      SILF.PromptInstall = "Please <a href='#' onclick='SILF.InstallClicked()'>click here to install Silverlight</a>";
  12:      SILF.PromptFinishInstall = "Please wait for Silverlight installation to complete. You may need to refresh the page.";
  13:      SILF.PromptUpgrade = "Please <a href='#' onclick='SILF.UpgradeClicked()'>click here to upgrade Silverlight</a>";
  14:      SILF.PromptFinishUpgrade = "Please wait for Silverlight upgrade to complete. You will need to restart your browser.";
  15:      SILF.PromptRestart = "Please exit/quit and restart your browser to proceed";
  16:      SILF.PromptNotSupported = "Sorry, your browser or operating system are not supported";
  17:      // If you want to redirect on Silverlight not supported, rather than show a slate, enable this variable// 
  18:      SILF.RedirectNotSupported = "http://bing.com";
  19:     
</script>

e nel body, oltre ad aggiungere una chiamata al metodo onLauncherPageLoad nell’evento onLoad, aggiungere la classica definizione del plugin Silverlight.

 
   1: <body onload="SILF.onLauncherPageLoad();">
   2:     <form id="form1" runat="server" style="height:100%">
   3:     <div id="silverlightControlHost">
   4:         <object data="data:application/x-silverlight-2," type="application/x-silverlight-2" width="100%" height="100%">
   5:           <param name="source" value="ClientBin/InstallExperience.xap"/>
   6:           <param name="onError" value="onSilverlightError" />
   7:           <param name="background" value="white" />
   8:           <param name="minRuntimeVersion" value="3.0.40818.0" />
   9:           <param name="autoUpgrade" value="true" />          
  10:         </object><iframe id="_sl_historyFrame" style="visibility:hidden;height:0px;width:0px;border:0px"></iframe></div>
  11:     </form>
  12: </body>
Fatto questo se l’utente non ha il plugin installato verrà mostrato ciò che avete definito con la proprietà PromptInstall (ricordate che è possible usare codice HTML) e lo stesso accade per le varie fasi dell’installazione, inoltre l’eventuale uri specificata verrà invocata con una serie di informazioni rigurdanti lo status dell’ installazione.
Al link indicato in precedenza trovate la descrizione delle varie proprietà e come vanno usate (provate a visitare la pagina col plugin Silverlight disabilitato), segnalo solo che il file silf.js è un po’ datato quindi vi consiglio di aggiornare l’elenco delle versioni di Silverlight identificate in questo modo:
 
   1: var slVers = new Array(
   2:          "4.0.50420.0", // 4 GDR2
   3:          "4.0.50401.0", // 4 RTM
   4:             "4.0.50303.0",    // 4 RC
   5:             "4.0.41108.0",  // 4 Beta 1 
   6:             "3.0.50106.0",  // 3 GDR 3
   7:             "3.0.40818.0",  // 3 GDR 2
   8:             "3.0.40723.0",  // 3 GDR 1
   9:             "3.0.40624.0",    // 3 RTW
  10:             "3.0.40307.0",
  11:             "2.0.40115.0",
  12:             "2.0.31005.0",
  13:             "2.0.30523.9",
  14:             "2.0.30523.8",
  15:             "2.0.30523.6",
  16:             "2.0.30226.2",
  17:             "1.0.30715.0",
  18:             "1.0.30401.0",
  19:             "1.0.30109.0",
  20:             "1.0.21115.0",
  21:             "1.1.20926.0",
  22:             "1.0.20816"
  23:             );

Enjoy…

Technorati Tags: ,