www.recovery.org Larry Kluger wrote: > > Thanks EC, > > Any public Timeline pages that we can add to the In-the-wild section > of the wiki? > > Thanks, > > Larry > > ------------------------------------------------------------------------ > *From:* EC <[email protected]> > *To:* SIMILE Widgets <[email protected]> > *Sent:* Thursday, March 26, 2009 10:11:47 AM > *Subject:* Timeline User Control with C# and Masterpage > > > Not a question, but after a few weeks of implementing simile timeline > I've got a few tricks for any C# ASP.NET users out there. > > First, if you're using masterpages you absolutely have to link to the > timeline-api.js in the server side head tag in the Masterpage. I > tried putting it in the aspx page, the user control, no luck, has to > be in the masterpage. All other javascript can be in the page/ > control. > > Second, I needed to create a user control that could be dropped onto > several pages that loads data dynamically, as in I couldn't just point > to an XML file like all the examples show. Here is some code for > dynamically generating Events in the code behind and passing them to > the javascript on the client. > > In the onLoad function: > > function onLoad() { > var eventSource = new Timeline.DefaultEventSource(); > > // this will be populated by code behind, it is the list of events > <%= DCEvents %> > > ..... all the other code for creating the zones, timeline, etc ..... > > } > > In the code behind, have a property called DCEvents: > > private string _DCEvents; > public string DCEvents > { > get > { > return _DCEvents; > } > set > { > _DCEvents = value; > } > } > > > Then on page load fill DCEvents, for my purposes I'm getting an array > of "streams" that have an attribute of "createDate", but you can loop > through a dataset or generic list or anything you want: > > > StringBuilder sb = new StringBuilder(); > > // get the streams, here just do whatever you need to get > your data > streams = mgmt.getDatastreamHistory(pid, dsid); > > // loop through your data creating an Event for each row, > again your data object will be different > foreach (FedoraManagement.Datastream stream in streams) > { > string Date = DateTime.Parse > (stream.createDate).ToString("MMM dd yyyy 00:00:00 EST"); > > sb.AppendLine("var dateEvent = new Date(\"" + Date + > "\");"); > sb.AppendLine("var evt = new > Timeline.DefaultEventSource.Event("); > sb.AppendLine("dateEvent, //start"); > sb.AppendLine("dateEvent, //end"); > sb.AppendLine("dateEvent, //latestStart"); > sb.AppendLine("dateEvent, //earliestEnd"); > sb.AppendLine("true, //instant"); > sb.AppendLine("\"My Title\","); > sb.AppendLine("\"<a href=javascript:__doPostBack('" + > stream.createDate + "')>This is a Postback</a>\");"); > sb.AppendLine("eventSource.add(evt);"); > sb.AppendLine(" "); > } > > // finally fill your property with this string > this.DCEvents = sb.ToString(); > > > For every event this will now show up in your onLoad function as seen > in Firebug (the postback line is simply the text of the popup, I > needed a postback link): > > var dateEvent = new Date("Mar 02 2009 00:00:00 EST"); > var evt = new Timeline.DefaultEventSource.Event( > dateEvent, //start > dateEvent, //end > dateEvent, //latestStart > dateEvent, //earliestEnd > true, //instant > "My Title", > "<a href=javascript:__doPostBack('2009-03-02T19:28:59.365Z')>This is a > Postback</a>"); > eventSource.add(evt); > > > Lastly here is the postback function, because it took a long stinkin > time to get a postback working: > > function __doPostBack(eventArgument) { > var theform = document.aspnetForm > theform.__EVENTTARGET.value = theform > theform.__EVENTARGUMENT.value = eventArgument > theform.submit() > } > > Its now working and I gotta say its pretty sweet, let me know if > you've got any questions. > > > > >
--~--~---------~--~----~------------~-------~--~----~ You received this message because you are subscribed to the Google Groups "SIMILE Widgets" group. To post to this group, send email to [email protected] To unsubscribe from this group, send email to [email protected] For more options, visit this group at http://groups.google.com/group/simile-widgets?hl=en -~----------~----~----~----~------~----~------~--~---
