I gave a talk with the title, "Hands-on Microformats: Quickly build an hCalendar-based view" at the 2009 BarCamp Omaha. Since the presentation was really looking at code, I didn't have a slide deck. So I thought I would share my notes in a series of posts. This is the first.
Short version: By adding a few specific attributes and abiding by some date formatting rules, you can generate a great-looking monthly calendar with surprisingly little effort. That is, get something like this:

From HTML that looks like this:

A microformat lets you use standard XHTML but add in some semantic goodness without resorting to a separate XML namespace and corresponding set of tags (or formally, an XML application).
For our example, hCalendar uses a 1:1 representation of standard iCalendar (RFC2445) VEVENT properties and values in semantic XHTML.
hCalendar wouldn't have caught my attention if it weren't for js-hCalendar. This bit of JavaScript created by David Glasser and hosted at Google code will take some hCalendar-laced HTML and give you back a Monthly calendar view of the data.
Now, if you are working in the heart of the application and you already have (or can acquire) a calendar component that does what you want, then this code may be less useful. But, I've found it very handy when I'm working around the edges of an application or I'm using a language with a smaller set of available components. The key is, no matter what platform on which I'm running, I can probably generate the required HTML to get this working in an hour or two.
Up next: some examples from XSLT and Seaside (Smalltalk).
Short version: By adding a few specific attributes and abiding by some date formatting rules, you can generate a great-looking monthly calendar with surprisingly little effort. That is, get something like this:

From HTML that looks like this:

A microformat lets you use standard XHTML but add in some semantic goodness without resorting to a separate XML namespace and corresponding set of tags (or formally, an XML application).
For our example, hCalendar uses a 1:1 representation of standard iCalendar (RFC2445) VEVENT properties and values in semantic XHTML.
hCalendar wouldn't have caught my attention if it weren't for js-hCalendar. This bit of JavaScript created by David Glasser and hosted at Google code will take some hCalendar-laced HTML and give you back a Monthly calendar view of the data.
Now, if you are working in the heart of the application and you already have (or can acquire) a calendar component that does what you want, then this code may be less useful. But, I've found it very handy when I'm working around the edges of an application or I'm using a language with a smaller set of available components. The key is, no matter what platform on which I'm running, I can probably generate the required HTML to get this working in an hour or two.
Up next: some examples from XSLT and Seaside (Smalltalk).
Comments