Wednesday, April 16, 2008

Timeline .Net

. Wednesday, April 16, 2008

Timeline .Net è uno user control per Asp.Net 2.0 realizzato da Rob Chartier.
Possiamo inserire i vari eventi usando sia direttamente le API del controllo, sia come sorgente dati i feed RSS.
Prima di iniziare a giocare con questo controllo è necessario scaricare la TimelineNet.dll e aggiungere il referimento al nostro progetto Asp.Net 2.0.
Aggiungiamo il controllo nella toolbox di Visual Studio 2008, in modo che possiamo trascinarlo sulla nostra pagina aspx.
A questo punto non ci rimane che indicare tramite la property DataSourceType il tipo di fonte dati, nel caso specifico rss e settare DataUrl con l'url del feed:

   1: <cc1:timeline ScriptSourceLocation="Local" 
   2:         LocalTimelineJSFolder="js/timeline/"
   3:         Height="300"
   4:         DataSourceType="rss"
   5:         DataUrl="http://feeds.feedburner.com/SignIn"         
   6:         Width="100%" runat="server"></cc1:timeline>



Per recuperare i dati bisogna infine aggiungere un handler http nel web.config:
   1: <system.web>
   2:   <httpHandlers>
   3:     <add verb="GET" path="*.ashx" type="TimelineNet.TimelineAjaxHandler, TimelineNet" />
   4:   </httpHandlers>
   5: </system.web>

Questa sarebbe la prassi da seguire ma purtroppo al lancio della pagina mi son trovato di fronte il seguente errore javascript:

Timeline1Analizzando nello specifico il codice js che viene prodotto dalla dll ed incapsulato nella pagina ho notato che i valori dei parametri trackHeight e trackGap presentano come separatore delle decine il carattere virgola anzichè il punto.
Sicuramente il problema si presenta su un sistema in cui la lingua  è diversa da quella inglese(nella fattispecie it-IT).
Essendo a disposizione il codice sorgente sul sito codeplex ho sbirciato nella classe Band, intervenedo sull'override del metodo ToString dove appunto viene generato/formattato il codice js.
Per evitare tale situazione su di una macchina con impostata la lingua  italiana ho effettuato il ToString dei due valori decimal sopra citati passando esplicitamente un oggetto CultureInfo settato su inglese:

   1: using System.Globalization;
   2: ....
   3: CultureInfo culture = CultureInfo.CreateSpecificCulture("en-US");
   4: ....
   5: if(TrackHeight > 0) sb.Append(string.Format(",trackHeight: {0}\n", TrackHeight.ToString( culture)));
   6: if(TrackGap > 0) sb.Append(string.Format(",trackGap: {0}\n", TrackGap.ToString( culture)));

Risultato:

timeline2Inoltre come accenato in precedenza possiamo usare le API del controllo per inserire in modo estremamente semplice un evento:

   1: using TimelineNet.Library;
   2: ....
   3: timeline.DataSourceType = TimelineNet.DataSourceTypes.named;
   4: TimelineData datiTimeline = new TimelineData();
   5: datiTimeline.Add(new Event(DateTime.Now, DateTime.Now, false, "Timeline test",
   6:                  string.Empty, "Evento personalizzato", string.Empty));
   7: timeline.TimelineData = datiTimeline;

Risultato finale:
timeline3

0 commenti:

Post a Comment