/* ------------------------------------------------------------------------------
*
* # Fullcalendar basic options
*
* Demo JS code for extra_fullcalendar_views.html and extra_fullcalendar_styling.html pages
*
* ---------------------------------------------------------------------------- */
// Setup module
// ------------------------------
var FullCalendarBasic = function() {
//
// Setup module components
//
// Basic calendar
var _componentFullCalendarBasic = function() {
if (typeof FullCalendar == 'undefined') {
console.warn('Warning - Fullcalendar files are not loaded.');
return;
}
// Add demo events
// ------------------------------
// Default events
var events = [
{
title: 'All Day Event',
start: '2014-11-01'
},
{
title: 'Long Event',
start: '2014-11-07',
end: '2014-11-10'
},
{
id: 999,
title: 'Repeating Event',
start: '2014-11-09T16:00:00'
},
{
id: 999,
title: 'Repeating Event',
start: '2014-11-16T16:00:00'
},
{
title: 'Conference',
start: '2014-11-11',
end: '2014-11-13'
},
{
title: 'Meeting',
start: '2014-11-12T10:30:00',
end: '2014-11-12T12:30:00'
},
{
title: 'Lunch',
start: '2014-11-12T12:00:00'
},
{
title: 'Meeting',
start: '2014-11-12T14:30:00'
},
{
title: 'Happy Hour',
start: '2014-11-12T17:30:00'
},
{
title: 'Dinner',
start: '2014-11-12T20:00:00'
},
{
title: 'Birthday Party',
start: '2014-11-13T07:00:00'
},
{
title: 'Click for Google',
url: 'http://google.com/',
start: '2014-11-28'
}
];
// Initialization
// ------------------------------
//
// Basic view
//
// Define element
var calendarBasicViewElement = document.querySelector('.fullcalendar-basic');
// Initialize
if(calendarBasicViewElement) {
var calendarBasicViewInit = new FullCalendar.Calendar(calendarBasicViewElement, {
plugins: [ 'dayGrid', 'interaction' ],
header: {
left: 'prev,next today',
center: 'title',
right: 'dayGridMonth,dayGridWeek,dayGridDay'
},
defaultDate: '2014-11-12',
editable: true,
events: events,
eventLimit: true
}).render();
}
//
// Agenda view
//
// Define element
var calendarAgendaViewElement = document.querySelector('.fullcalendar-agenda');
// Initialize
if(calendarAgendaViewElement) {
var calendarAgendaViewInit = new FullCalendar.Calendar(calendarAgendaViewElement, {
plugins: [ 'dayGrid', 'timeGrid', 'interaction' ],
header: {
left: 'prev,next today',
center: 'title',
right: 'dayGridMonth,timeGridWeek,timeGridDay'
},
defaultDate: '2014-11-12',
defaultView: 'timeGridWeek',
editable: true,
businessHours: true,
events: events
}).render();
}
//
// List view
//
// Define element
var calendarListViewElement = document.querySelector('.fullcalendar-list');
// Initialize
if(calendarListViewElement) {
var calendarListViewInit = new FullCalendar.Calendar(calendarListViewElement, {
plugins: [ 'list', 'interaction' ],
header: {
left: 'prev,next today',
center: 'title',
right: 'listDay,listWeek,listMonth'
},
views: {
listDay: { buttonText: 'Day' },
listWeek: { buttonText: 'Week' },
listMonth: { buttonText: 'Month' }
},
defaultView: 'listMonth',
defaultDate: '2014-11-12',
navLinks: true, // can click day/week names to navigate views
editable: true,
eventLimit: true, // allow "more" link when too many events
events: events
}).render();
}
};
//
// Return objects assigned to module
//
return {
init: function() {
_componentFullCalendarBasic();
}
}
}();
// Initialize module
// ------------------------------
document.addEventListener('DOMContentLoaded', function() {
FullCalendarBasic.init();
});