Our customized Date+Calendar-based Drupal event calendar is coming along quite nicely. The information architect’s design called for extensive customizations, such as:

• hiding the year view
• creating a context-sensitive year navigator that displays the entire year, and linking that to the title of the image
• adding AJAX effects
• adding a pop-up callout with three of the day’s events
• displaying times in the user’s timezone generally, and in the user’s timezone and the event’s timezone on the actual event page
• including dates for the previous month in the month view
• allowing people to subscribe for notifications for new events in their interest group
• allowing people to get iCal feeds for their events, all the events, or a group’s events, and these feeds should work without login
• allowing people to sign up for e-mail reminders

We went with Date+Calendar instead of Event because Date+Calendar seemed more up to date, and its integration with Views meant that it was easy to add in domain access and other constraints. I learned quite a lot of new things in the process of implementing these features, such as:

• writing a lot of Javascript using jQuery in order to bind events and do AJAX calls
• writing test cases to check event subscription, event notification, timezone handling, and so on
• programmatically creating a CCK node type with a date field
• overriding calendar.inc to modify the way Drupal prepares the calendar
• overriding calendar.theme to modify the way Drupal presents the calendar
• making my own set of functions to generate the year navigator, based on the year view in calendar.inc

It took me a bit of time to figure out how this Date+Calendar AJAX patch worked, and I ended up modifying it extensively. I had been getting confused by mini= and view=ajax and all the other parameters floating around. I tried different approaches, including creating a callback function that generated just the HTML for the block, but then I found myself passing in too many parameters to control the URLs for the links.

My aha! moment was when I realized that the way the patch was handling the AJAX was to generate the entire page. When it got to processing the calendar block in the sidebar, the code checked for the $_GET[‘view’] parameter, and if an AJAX view was requested, it would print out the block and exit without printing the rest of the page. While that worked for the general case, we needed to modify our code so that the calendar blocks don’t appear on the calendar detail pages, so I wrote some Javascript code that requested a page within the right context.

This approach of generating the whole page didn’t quite work when it came to the subscription form that we embedded in event node page templates, though, because it printed out the node content before it generated the form. I used jQuery to retrieve the entire page, and then I extracted just the DIV I wanted to keep.

I still don’t like fussing with CSS (particularly when it comes to collapsing borders or dealing with browser issues), so I’ll leave that in the capable hands of our information architect. But now I’m the jQuery ninja on our team, too, and I know I can rock CCK+Views and calendars for future projects. =D

(p.s. Left out details, but if you’re curious about any of the bullet points, comment and I might flesh it out into its own blog post!)