FullCalendar.js - Example Initialization (http://fullcalendar.io)

fullCalendar_init.js

calendar = $('#calendar').fullCalendar({
    defaultView: "agendaWeek",
    header: {
        left: 'prev,next today',
        center: 'title',
        right: 'month,agendaWeek,agendaDay'
    },
    buttonText: {
        today: "Today",
        month: "Month",
        agendaWeek: "Week",
        agendaDay: "Day"
    },
    businessHours: {start: '8:00',end: '20:00', dow: availableDays}, // display business hours
    editable: true,
    events: {
        url: "/appointmentsajax.cgi",
        type: "GET",
        data: {
            action: "getUserAppointments"
        }
    },
    selectable: true,
    selectHelper: true,
    selectConstraint: "businessHours",
    select: function(start, end, allDay) {
        $("#appointment_start").val(start.format("YYYY-MM-DD HH:mm:ss"));
        $("#appointment_end").val(end.format("YYYY-MM-DD HH:mm:ss"));
        $("#edit_appointment").modal("show");
    },
    slotDuration: "00:15:00",
    scrollTime: "08:00:00",
    eventClick: function(calEvent, jsEvent, view) {
        console.log( 'Event: ' + calEvent.title );
        console.log('Coordinates: ' + jsEvent.pageX + ',' + jsEvent.pageY);
        console.log('View: ' + view.name);
        console.dir(calEvent);
        
        // change the border color just for fun
        $(this).css('border-color', '#BADA55');               
    },
    eventRender: function(event, element) {
        if ( event.user ) {
            element.find(".fc-title").append(" (" + event.user + ")");
        }
        //console.dir(element);
    }
});