<cfsilence>

Introducing cfTimeline Custom Tag

Posted At : March 30, 2007 8:46 AM | Posted By : todd sharp
Related Categories: cfTimeline, ColdFusion

Here's a preview of a custom tag that I threw together last night as a way to easily implement the very slick SIMILE Timeline. It's very early but I wanted to get a preview online because I think it's just damn cool how easy it will be to drop a timeline into a cf application once I get this finished. Below is a sample timeline, and here is the only code needed to generate it.

<cf_timeline startDateTime="#createDateTime(2007,1,1,12,0,0)#" xmlEvents="events.cfm" />

I could have gotten away with passing one less attribute too - the tag will default to today's date as the start if none is passed. The xmlEvents attribute points to an XML file on the server (in my case a cfm page that serves up the XML). Here is an overview of the XML format accepted by the tag.

Update: BlogCFC include rendering wasn't working so here's a link to a demo. This is likely a bug with the tag, not any fault of BlogCFC!!

I've set up a page on RIAForge for the project but I'm going to wait a bit before I post the code. I haven't dug too deep into the API but I'd like to do something like this:

<cf_timeline timelineid="myTimeline">
<cf_timelineevent start="1/1/07" end="1/31/07">
</cf_timeline>

There is also a concept of 'hot zones' on the timeline which are essentially groupings of events that take place within a short timeframe. The hot zone will 'zoom in' on the event so that the timeline will be clearer to read for that time period. Something I'd definitely like to look into accomodating too!

Any thoughts/suggestions/ideas?

Comments (6) |

Print |

Send |

Code |

del.icio.us |

Linking Blogs | 2867 Views

Related Blog Entries

cfTimeline Released (April 20, 2007)
What's Up With cfTimeline? (April 4, 2007)

Comments

[Add Comment]

Nice work, really nice.

Suggestions:

Make this a jQuery plugin that would take an unsorted list of the dates and then wrap the timeline around it. This would make it accessible and will show the dates if JS and CSS are turned off.

# Posted By tony petruzzi | 3/30/07 9:44 AM

Hi Todd,

I haven't had a chance to play with your tag yet, but I'm excited about the possibilities. The SIMILE project is a very cool set of tools, and wrapping the Timeline for ColdFusion adds one more great UI widget to the CF'ers bag of tricks.

# Posted By Rob Brooks-Bilson | 3/30/07 10:50 AM

Very interesting. But how does this work for a intranet page?

# Posted By Patrick Whittingham | 3/30/07 11:38 AM

Can your page access the internet? If so then it should work. If not you could probably download the JS and point the tag to a local version. I'd check the SIMILE site to make sure that's not a violation of the TOS for using the API.

I hope to play around with this more this weekend and get a downloadable version up next week.

# Posted By todd sharp | 3/30/07 11:49 AM

Patrick: According to the wiki the source is downloadable here http://simile.mit.edu/wiki/Timeline/Download_The_S...

I think I'm going to leave the custom tags source pointing to their source instead of introducing an external dependency into the tag (external JS files). I'll provide an explanation how to modify the tag for that once I release it and come up with some documentation.

In short - if your intranet can't talk to the internet there will still be a way for you to use this tag when it's released.

# Posted By todd sharp | 3/30/07 1:23 PM

Thanks

# Posted By Patrick Whittingham | 3/30/07 1:24 PM

[Add Comment]