fullCalendar jQuery, repeat every monday?

Question

Normally this is a event in calendar:

            {

                title: 'Test',

                start: '2012-06-08',

                end: '2012-06-08',

                url: 'test/test'

            },

Works fine. Although how can i make 1 event that shows on every Monday in the calendar? Or every tuesday and so on depend on what weekday/number you enter? Whats the param if there exists one?

If it does not exists, can I somehow modify and add the feature for making this happen? So you can enter a param like repeatEveryWeekDay: 2 (which is monday), then on all future mondays the data will show there.

I tried looking in http://arshaw.com/fullcalendar/docs/event_data/Event_Object/ but can't find anything.

Answer 1

fullCalendar permits that instead of passing an array of events, you can pass a function which, for example, downloads the events from a server, or dynamically generates those events.

Most examples in the documentation use HTTP requests to get events data. But the callback function is still flexible enough to make it work the way you want.

Look at the following example I've just written for you:

$(document).ready(function() {

    var date = new Date();
    var d = date.getDate();
    var m = date.getMonth();
    var y = date.getFullYear();

    $('#calendar').fullCalendar({
        header: {
            left: 'prev,next today',
            center: 'title',
            right: 'month,agendaWeek,agendaDay'
        },
        editable: true,
        events: [
            // some original fullCalendar examples
            {
                title: 'All Day Event',
                start: new Date(y, m, 1)
            },
            {
                title: 'Long Event',
                start: new Date(y, m, d-5),
                end: new Date(y, m, d-2)
            },
            {
                id: 999,
                title: 'Repeating Event',
                start: new Date(y, m, d-3, 16, 0),
                allDay: false
            }
        ]
    });

    // adding a every monday and wednesday events:
    $('#calendar').fullCalendar( 'addEventSource',        
        function(start, end, callback) {
            // When requested, dynamically generate virtual
            // events for every monday and wednesday.
            var events = [];

            for (loop = start.getTime();
                 loop <= end.getTime();
                 loop = loop + (24 * 60 * 60 * 1000)) {

                var test_date = new Date(loop);

                if (test_date.is().monday()) {
                    // we're in Moday, create the event
                    events.push({
                        title: 'I hate mondays - Garfield',
                        start: test_date
                    });
                }

                if (test_date.is().wednesday()) {
                    // we're in Wednesday, create the Wednesday event
                    events.push({
                        title: 'It\'s the middle of the week!',
                        start: test_date
                    });
                }
            } // for loop

            // return events generated
            callback( events );
        }
    );
});

The above function automatically generates an event for every Monday and Wednesday between two dates. The dates are indicated in start and end params. Those params are passed by fullCallendar. Events generated by the above function are returned to fullCallendar through the callback function in third param.

I use DateJS to test if a given date is monday.

UPDATE: If you want to mix static events and/or [more than one] repeatable event, you can use addEventSource.