Improved calendar helper with ajax paging

Improved Improved calendar helper with ajax paging, year view and half days 4
Posted by Damien Tanner on 2006年5月9日
I‘ve been working on an improved version of the great calendar_helper plugin written byjvoorhis andpluginized by topfunky. We‘re using it in a property rentals website so a few extras needed to be added. Thanks go to Max for pioneering the improved calendar.
Update: ademo is now available. No caching, so be nice. The year view has also been finished off.
Features in this version
Year view is required for making bookings as people need to be able to see availability for more than one month at a time. Typically you might see several calendars being used to increase the scope, but this year view does a nicer job. AJAX paging is just fancy and makes browsing a bit quicker. Half days are an important one for bookings (as we‘ve discovered). Places which run a tight schedule want to get people in and out on the same day. Half days have been implemented with background images sporting a diagonal split. When running the calendar_styles generator, as well as generating css, background images are also created. Theme support has been added. Nothing too special now, but you can set the background colours in a yaml file.
For the time being I‘ve put the new version in a new svn repository. I‘m not sure if all of the features added will be implemented into the original helper. Plus this code isn‘t the prettiest as I‘m on a tight schedule. Next month I‘ll get some tests written and DRY the code a bit.
Using the calendar helper
First jump into your rails project directory and add the helper as an svn external:
svn propedit svn:externals vendor/plugins/
by adding the line:
calendar_helper svn://new-bamboo.co.uk/newbamboo/svn/plugins/calendar_helper
save, then do an svn up
Before we can use the calendar we need to generate the css and half day background images.
First create the images directory if you‘re going to be using half days (can‘t quite work out how to get this done in the generator).
mkdir public/images/calendar
Now run the calendar styles the generator:
script/generate calendar_styles trafficlights halfDays
The last two arguments are the theme and enable half days, respectively. Only two theme are included for now: blue and trafficlights. Editing or creating a new theme easily done by editing the files in calendar_helper/generators/themes. They‘re very self explanatory and YAML formatted.
When doing AJAX rendering it‘s easier if we generate the calendar in the controller, so if there‘s and AJAX request we can just throw it back. So in your controller include the calendar helper with:
include CalendarHelper
You‘ll want an action similar to this one.
def monthlyparams.has_key?(:year) ? @year = params[:year].to_i : @year = Time.now.yearparams.has_key?(:month) ? @month = params[:month].to_i : @month = Time.now.month@booked_days = Property.find(:first).days_booked(:year => @year, :month => @month)@cal = calendar(:year => @year, :month => @month, :ajax_paging => { :controller => ‘bamcal‘, :action => ‘monthly‘}, :half_days => true) do |d|if @booked_days.include?(d)[d.mday, { :class => ‘specialDay‘ }, true]else[d.mday]endendif request.xhr?render(:update) { |page| page.replace_html ‘mycal‘, @cal }elserender :action => ‘mycal‘endend
There are a few things which need explaining here. The first two lines get the year and month from the parameters, or set them to days date. Next we get the booked days from our model. The days_booked method of our Property model returns an array of Date objects, one for each day which is booked or unavailable. In the calendar table cells which are booked are given the specialDay class. The calendar is then generated with the calendar method (so don‘t name your action calendar!) and the output is saved in the @cal variable.
There are several extra options for the helper:
:ajax_paging takes a hash with the controller and action (usually the same as the one we‘re in). If it‘s supplied little next and prev links are included in the calendar. :half_days will enable half day backgrounds if set to true. To use the year view, simply don‘t supply the :month option.
If this is an AJAX (request.xhr?) then do some inline RJS to replace the old calendar with the new one. You‘ll need to make sure the element id page.replace_html is given is the same as in your view. A visual effect could be added here for extra spice.
The mycal.rhtml view is pretty uneventful:

With all this in place you should be able to view a beautiful calendar by visiting your action.
Next time...
I hope to find some time to tidy up the code and write some tests. I also have a few more snippets to help with using the calendar with your project. If you find any bugs or have any feature suggestions or even patches! Please submit them tocollaboa.
TagsRails,Typo Meta1 trackback,4 comments,permalink,rss,atom
Use the following link to trackback from your own site:
http://iamrice.org/articles/trackback/747
Betty White From Donald Harris
animal-fuckers