[whatwg] [WA1] Markup for vCalendar and vCard

[Matthew Raymond]

    I've been pondering my earlier post regarding calendars in WA1:

http://listserver.dreamhost.com/pipermail/whatwg-whatwg.org/2005-February/003046.html

    While I like the idea, it seems to introduce too many tags, so I've 
simplified things a bit. The element <cattr> will now be called <vattr> 
and will be used in place of <cdatetime> and <csummary>. This may seem 
to general, but if you look at a vCalendar example, it's pretty straight 
forward. Here's a vCalendar from the hCalendar spec 
(http://developers.technorati.com/wiki/hCalendar):

| BEGIN:VCALENDAR
| PRODID:-//XYZproduct//EN
| VERSION:2.0
| BEGIN:VEVENT
| URL:http://www.web2con.com/
| DTSTART:20041005
| DTEND:20041007
| SUMMARY:Web 2.0 Conference
| END:VEVENT
| END:VCALENDAR

    Now here's how I propose we handle the same information in WA1 markup:

| <vcalendar>
|   <vattr name="prodid" value="-//XYZproduct//EN"
|   <vattr name="version" value="2.0"></vattr>
|   <vevent>
|     <vattr name="url" value="http://www.web2con.com/"></vattr>
|     <vattr name="dtstart" value="2004-10-05"></vattr>
|     <vattr name="dtend" value="2004-10-07"></vattr>
|     <vattr name="summary" value="Web 2.0 Conference"></vattr>
|   </vevent>
| </vcalendar>

    It's fairly simple, and it can be transformed directly into a 
vCalendar and back. The idea is quite similar for vCards. Let's look at 
and example from the hCard spec 
(http://developers.technorati.com/wiki/hCard):

| BEGIN:VCARD
| VERSION:3.0
| N:Çelik;Tantek
| FN:Tantek Çelik
| URL:http://tantek.com
| END:VCARD

    This translates into the following markup:

| <vcard>
|   <vattr name="version" value="3.0"></vattr>
|   <vattr name="n" value="Çelik;Tantek"></vattr>
|   <vattr name="fn" value="Tantek Çelik"></vattr>
|   <vattr name="url" value="http://tantek.com"></vattr>
| </vcard>

    As you can see, the markup structure mirrors the vCard structure and 
contains the same attribute names and information. It would be trivial 
to parse this information and convert it to vCard format.

    Here's the same two examples with fallback content:

| <vcalendar>
|   <table>
|     <caption>Upcoming Events</caption>
|     <tr>
|       <th>URL</th>
|       <th>Start Date</th>
|       <th>End Date</th>
|       <th>Summary</th>
|     </tr>
|     <vevent>
|     <tr>
|       <td><vattr name="url">http://www.web2con.com/</vattr></td>
|       <td><vattr name="dtstart">2004-10-05</vattr></td>
|       <td><vattr name="dtend">2004-10-07</vattr></td>
|       <td><vattr name="summary">Web 2.0 Conference</vattr></td>
|     </tr>
|     </vevent>
|   </table>
| </vcalendar>

| <vcard>
|   <vattr name="version" value="3.0"></vattr>
|   <vattr name="n" value="Çelik;Tantek"></vattr>
|   <div id="tc" class="vcard">
|     <p><vattr name="fn">Tantek Çelik</vattr></p>
|     <a href="http://tantek.com">
|      <vattr name="url">http://tantek.com</vattr>
|     </a>
|     <button type="button" onclick="return addContact('tc')">
|       Add to contact list...
|     </button>
|   </div>
| </vcard>

    Comments welcome.