JQFullCalendarPlugin

%STARTSECTION{"init"}%
<literal>
<script type='text/javascript'>
jQuery(function($) {
    var date = new Date();
    var d = date.getDate();
    var m = date.getMonth();
    var y = date.getFullYear();

    $('#calendar1').fullCalendar({
      theme: true,
      header: {
        left: 'prev,next today',
        center: 'title',
        right: 'month,agendaWeek,agendaDay'
      },
      firstDay: 1,
      editable: true,
      events: [
        {
          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
        },
        {
          id: 999,
          title: 'Repeating Event',
          start: new Date(y, m, d+4, 16, 0),
          allDay: false
        },
        {
          title: 'Meeting',
          start: new Date(y, m, d, 10, 30),
          allDay: false
        },
        {
          title: 'Lunch',
          start: new Date(y, m, d, 12, 0),
          end: new Date(y, m, d, 14, 0),
          allDay: false
        },
        {
          title: 'Birthday Party',
          start: new Date(y, m, d+1, 19, 0),
          end: new Date(y, m, d+1, 22, 30),
          allDay: false
        },
        {
          title: 'Click for Google',
          start: new Date(y, m, 28),
          end: new Date(y, m, 29),
          url: 'http://google.com/'
        }
      ]
    });

    $('#calendar2').fullCalendar({
      theme: true,
      editable: true,
      firstDay: 1,
      defaultView: 'agendaWeek',

      events: ['%SCRIPTURLPATH{"view"}%/%BASEWEB%/%BASETOPIC%?section=json-events;skin=text'],

      header: {
        left: 'prev,next today',
        center: 'title',
        right: 'month,agendaWeek,agendaDay'
      },

      eventDragStop: function(calEvent, jsEvent, ui, view) {
        alert(calEvent.title + 
              ' was dragged\n' +
              'id=' + calEvent.id + '\n' +
              'start=' + calEvent.start + '\n' +
              'end='+calEvent.end);
      },

      eventResize: function(calEvent, jsEvent, ui, view) {
        alert(calEvent.title + 
              ' was resized\n' +
              'id=' + calEvent.id + '\n' +
              'start=' + calEvent.start + '\n' +
              'end='+calEvent.end);
      },

      eventClick: function(calEvent, jsEvent, view) {
        alert(calEvent.title + ':\n' +
              'id=' + calEvent.id + '\n' +
              'start=' + calEvent.start + '\n' +
              'end='+calEvent.end);
      },

      loading: function(bool) {
        if (bool) {
          $('#loading').stop().show();
        } else {
          $('#loading').stop().fadeOut();
        }
      },
      timeFormat: {
        // for agendaWeek and agendaDay
        agenda: 'H:mm{ - H:mm}', 

        // for all other views
        '': 'h(:mm)'
      },
      columnFormat: {
        month: 'ddd',
        week: 'ddd d',
        day: 'dddd d'
      },
      axisFormat: 'H:mm'
    });
});
</script>
</literal>
%ENDSECTION{"init"}%