Timeline User Control with C# and Masterpage

[EC]

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.

[Larry Kluger]

Thanks EC,

Any public Timeline pages that we can add to the In-the-wild section of the wiki?

Thanks,

Larry

---

From: EC <coop...@gmail.com>
To: SIMILE Widgets <simile-...@googlegroups.com>
Sent: Thursday, March 26, 2009 10:11:47 AM
Subject: Timeline User Control with C# and Masterpage

[David Karger]

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 <coop...@gmail.com>
> *To:* SIMILE Widgets <simile-...@googlegroups.com>
> *Sent:* Thursday, March 26, 2009 10:11:47 AM
> *Subject:* Timeline User Control with C# and Masterpage