An XSLT Calendar

The First Step in Building a Design Administration Application

To develop a design business administration application, it is essential to be able to keep track of time, schedule appointments, process phases and deadlines. This means that a calendar will be one of the first requirements.

Now, we could generate calendars with JavaScript and use cookies to maintain persistent selections from one page to another. With Symphony, neither of those is necessary. Let’s let the server do the work, with XML and XSLT to produce calendar views with XHTML. Thankfully, many have done a lot of the hard work of getting a calendar to work in XSLT. There are date and time libraries available from the XSLT Standard Library. It is also possible to glean templates that perform date and time functions from EXSLT.org.

I took a look at a couple other calendar examples that I might be able to adapt, but both are dependent on external xslt libraries or functions, which is why I passed on them to begin with: trying to avoid any dependencies on external libraries. XSLT Cookbook: Creating a HTML Calendar depends on the the EXSLT.org date-time extensions. The other is A Calendar, using the XSelerator’s datetime library. In the end, I chose to use the work of Muhammad Athar Parvez on an XSL stylesheet that generates a single calendar month: Parvez’s Wing of the Gallery of Stupid XSL and XSLT Tricks.

Note: there is an interesting calendar FAQ on the issues of dates and calendars compiled by Claus Tøndering, Frequently Asked Questions about Calendars.

I started in Symphony with a static XML data source:

<calendar>
    <year>
        <month value="1" days="31">January</month>
        <month value="2" days="28" leap-year-days="29">February</month>
        <month value="3" days="31">March</month>
        <month value="4" days="30">April</month>
        <month value="5" days="31">May</month>
        <month value="6" days="30">June</month>
        <month value="7" days="31">July</month>
        <month value="8" days="31">August</month>
        <month value="9" days="30">September</month>
        <month value="10" days="31">October</month>
        <month value="11" days="30">November</month>
        <month value="12" days="31">December</month>
    </year>
</calendar>

The rest of the application is a CSS file and four XSLT templates that display the four calendar views: year, month, week and day. View the calendar to see the results of this work, which extends the work of Parvez to include the additional views, navigation with persistent dates, and hours for the week and day views.

27 July 2007 by Stephen Bau