[uf-discuss] Re: hCalendar for events in a table format

Toby A Inkster mail at tobyinkster.co.uk
Tue Mar 4 14:44:38 PST 2008

> Is there an example of hCalendar in a table?  The example link for  
> "Web Essentials 05 Session program" on http://microformats.org/wiki/ 
> hcalendar-brainstorming is rotten (the domain we05.com has expired).

Indeed -- I've recently implemented it, but without a decent example  
I can't be sure whether my implementation in interoperable with  
anything else. I took a quick peek at http://hg.microformats.org / 
x2v, but despite indications on the hcalendar-brainstorming page that  
this pattern is supported by X2V, I couldn't see any evidence for it  
in the source code. (But then again, I'm no XSLT expert.)

I put together this example (using hCard instead of hCalendar, but  
the principle is the same) for testing. There is nothing special  
about the use of TH elements for the headers. They are the  
semantically correct element to use, but TD would work just the same.  
The THEAD and TBODY elements are optional.

       <th id="id_fn" axis="fn">Full name</th>
       <th id="id_role" axis="role">Role</th>
       <th id="id_adr"><span class="locality">London</span> Address</th>
     <tr class="vcard">
       <td headers="id_fn">Elizabeth Windsor</td>
       <td headers="id_role">Queen</td>
       <td headers="id_adr" class="adr">
         <span class="street-address">Buckingham Palace</span>
     <tr class="vcard">
       <td headers="id_fn">Gordon Brown</td>
       <td headers="id_role">Prime Minister</td>
       <td headers="id_adr" class="adr">
         <span class="street-address">10 Downing Street</span>

The output should be:

FN:Gordon Brown
ROLE:Prime Minister
ADR:;;10 Downing Street;London;;;
FN:Elizabeth Windsor
ADR:;;Buckingham Palace;London;;;

For the record, here's the algorithm I've used, operating on a clone  
of the DOM tree (because it makes DOM modifications which you  
probably want to discard after parsing)

For each TD element within a microformat root element (including the  
root element itself if it's a TD)
	Skip to the next TD if there is no "headers" attribute;

	Split the "headers" attribute on whitespace into individual headers.  
For each header
		Htag = getElementById(header);
		If Htag has an "axis" attribute, append its value to the TD  
element's "class" attribute;
		Create a new DOM "DIV" element, called NewTag;
		NewTag.setAttribute("class", Htag.getAttribute("class"));
		Foreach child node of Htag
			Clone the child and add it as a child of NewTag;

		Add NewTag as a child of the TD;

After this, the table design pattern has been "normalised", so that  
the hCalendar/hCard can be parsed as normal without having to worry  
about the pattern at all.

Toby A Inkster
<mailto:mail at tobyinkster.co.uk>

More information about the microformats-discuss mailing list