making it work but it's sort of a mess

2022-01-10 22:51:06 -08:00
parent 91a01f7b7c
commit 81a7358452
1583 changed files with 26 additions and 4 deletions
@@ -0,0 +1,93 @@
+"use strict";
+
+// Class definition
+var KTGeneralFullCalendarEventsDemos = function() {
+	// Private functions
+
+	var exampleBackgroundEvents = function() {
+		// Define colors
+		var green = KTUtil.getCssVariableValue('--bs-active-success');
+		var red = KTUtil.getCssVariableValue('--bs-active-danger');
+
+		// Initialize Fullcalendar -- for more info please visit the official site: https://fullcalendar.io/demos
+		var calendarEl = document.getElementById('kt_docs_fullcalendar_background_events');
+
+		var calendar = new FullCalendar.Calendar(calendarEl, {
+			headerToolbar: {
+				left: 'prev,next today',
+				center: 'title',
+				right: 'dayGridMonth,timeGridWeek,timeGridDay,listMonth'
+			},
+			initialDate: '2020-09-12',
+			navLinks: true, // can click day/week names to navigate views
+			businessHours: true, // display business hours
+			editable: true,
+			selectable: true,
+			events: [{
+					title: 'Business Lunch',
+					start: '2020-09-03T13:00:00',
+					constraint: 'businessHours'
+				},
+				{
+					title: 'Meeting',
+					start: '2020-09-13T11:00:00',
+					constraint: 'availableForMeeting', // defined below
+					color: green
+				},
+				{
+					title: 'Conference',
+					start: '2020-09-18',
+					end: '2020-09-20'
+				},
+				{
+					title: 'Party',
+					start: '2020-09-29T20:00:00'
+				},
+
+				// areas where "Meeting" must be dropped
+				{
+					groupId: 'availableForMeeting',
+					start: '2020-09-11',
+					end: '2020-09-11',
+					display: 'background',
+				},
+				{
+					groupId: 'availableForMeeting',
+					start: '2020-09-13',
+					end: '2020-09-13',
+					display: 'background',
+				},
+
+				// red areas where no events can be dropped
+				{
+					start: '2020-09-24',
+					end: '2020-09-28',
+					overlap: false,
+					display: 'background',
+					color: red
+				},
+				{
+					start: '2020-09-06',
+					end: '2020-09-08',
+					overlap: false,
+					display: 'background',
+					color: red
+				}
+			]
+		});
+
+		calendar.render();
+	}
+
+	return {
+		// Public Functions
+		init: function() {
+			exampleBackgroundEvents();
+		}
+	};
+}();
+
+// On document ready
+KTUtil.onDOMContentLoaded(function() {
+	KTGeneralFullCalendarEventsDemos.init();
+});