Vendor Plugin

<!--
	FULLCALENDAR
	See below more info about attributes

	NOTE:
		data-fullcalendar-modal-event-edit
		also used on event resize & drag (GET method only)
		Open your console to see the request for event drag/resize (debug is enabled in demo)
-->
<div class="fullcalendar rounded"
	data-fullcalendar-default-view="dayGridMonth" 
	data-fullcalendar-editable="true" 
	data-fullcalendar-timezone="local" 
	data-fullcalendar-default-date="now" 

	data-fullcalendar-modal-size="modal-lg" 

	data-fullcalendar-event-create-modal="true" 
	data-fullcalendar-modal-event-create="_ajax/fullcalendar_event_create.html" 

	data-fullcalendar-event-edit-modal="true" 
	data-fullcalendar-modal-event-edit="_ajax/fullcalendar_event_edit.html?id=" 

	data-fullcalendar-date-click="modal" 
	data-fullcalendar-modal-date-click-modal="_ajax/fullcalendar_event_create.html?date=" 

	data-toast-success="Successfully Updated!" 
	data-toast-position="top-center"  

	data-fullcalendar-plugins='[ "interaction", "dayGrid", "timeGrid", "list", "bootstrap", "googleCalendar" ]'

	data-fullcalendar-google-apikey="AIzaSyCBpT7NTo9rwR-gS5iq7ayV-dGlE_Ebr0s" 

	data-fullcalendar-source-json-url='[
		{
			"url": "_ajax/fullcalendar_events.json",
			"method": "GET",
			"extraParams": {
				"param1": "val1",
				"param2": "val2"
			}
		}, 

		{
			"googleCalendarId": "6dhq1i511vid645mmtn2pujfok@group.calendar.google.com",
			"className": "fc-smarty-gcal bg-primary-soft border-primary-soft"
		}
	]' 

	data-fullcalendar-lang-btn='{
		"today" : "today",
		"month" : "month",
		"week" 	: "week",
		"day" 	: "day",
		"list" 	: "list"
	}' 

	data-fullcalendar-header='{
		"left" 		: "prev,next, today, customAddEventButton",
		"center" 	: "title",
		"right" 	: "dayGridMonth,timeGridWeek,timeGridDay,listWeek"
	}' 

	data-fullcalendar-time-format='{
		"hour" 		: "numeric",
		"minute" 	: "2-digit",
		"meridiem" 	: "short"
	}'></div>
								

// FULLCALENDAR ATTRIBUTES

data-fullcalendar-default-date="now|2019-08-01" = calendar date view (now or date)


// Event id is added at the end of edit URL!
// You should get data from database and populate your form!
data-fullcalendar-modal-event-edit="_ajax/fullcalendar_event_create.html?id=" 

// On date click - open modal
data-fullcalendar-date-click="modal"		// open in modal
data-fullcalendar-date-click="redirect"		// redirect to url
data-fullcalendar-date-click=""			// do nothing 

data-fullcalendar-source-json-url 		// url of JSON data. Multiple sources supported.
data-fullcalendar-source-json-inline 		// the format is json, the same as external json, but added here (inline)
data-fullcalendar-source-object="myObj" 	// javascript object - example:
<script>
	var myObj = [
		{
			id: '1',
			title: 'All Day Event',
			start: '2019-08-01'
		},
		{
			id: '2',
			title: 'Long Event',
			start: '2019-08-07',
			end: '2019-08-10'
		},
	];
</script>

// Default view
data-fullcalendar-default-view="dayGridMonth|timeGridWeek|timeGridDay|listWeek"







/* 	

	GOOGLE CALENDAR & LOCAL

	Right now, Smarty is usiong Google Galendar (using "googleCalendar" plugin) & Local Json data.
	You can add multiple sources (multiple local sources, multiple google calendars)

	Create your own Google Calendar API before using because this is
	used by Smarty as a demo. If you need help to setup google API,
	please read this:  https://fullcalendar.io/docs/google-calendar

	Note: the plugin is not returning the colors from Google Calendar,
	so set any bg-* default to diferentiate Google events.

*/
data-fullcalendar-google-apikey="AIzaSyCBpT7NTo9rwR-gS5iq7ayV-dGlE_Ebr0s" 
data-fullcalendar-source-json-url='[
	{
		"url": "_ajax/fullcalendar_events.json",
		"method": "GET",
		"extraParams": {
			"param1": "val1",
			"param2": "val2"
		}
	}, 

	{
		"googleCalendarId": "6dhq1i511vid645mmtn2pujfok@group.calendar.google.com",
		"className": "fc-smarty-gcal bg-primary-soft border-primary-soft"
	}
]' 








++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ 
// JAVASCRIPT : EXTEND CURRENT SETTINGS
data-fullcalendar-extend="extendCalendar"
<script>
	var extendCalendar = {
		// your custom fullcalendar
	};
</script>
++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ 



++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ 
// JAVASCRIPT : ENTIRELY CUSTOM FULLCALENDAR! ALL SMARTY FULLCALENDAR IS IGNORED
// EXCEPT THESE (which you can overwrite in your custom)
/*
	var _defaults = {

		themeSystem 	: 'bootstrap',
		defaultView 	: defaultView || 'dayGridMonth', 	// dayGridMonth|timeGridWeek|timeGridDay|listWeek
		defaultDate 	: new Date(),
		dir 		: $.SOW.globals.direction, 			// LTR|RTL
		header 		: {
					left 	: 'prev,next, today',
					center 	: 'title',
					right 	: 'dayGridMonth,timeGridWeek,timeGridDay,listWeek'
				}

	};
*/

data-fullcalendar-custom="customCalendar"
<script>
	var customCalendar = {
		// your custom fullcalendar
	};
</script>
++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ ++ 



;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
// HINT - PROGRAMATICALLY AJAX MODAL
if(typeof $.SOW.core.ajax_modal === 'object') {

	// Programtically Create Modal 	: 		      url , 'modal-md', 'true' (centered), 'null|static' (backdrop), callback
	$.SOW.core.ajax_modal.createFromThinAir('_ajax/fullcalendar_event_create.html', 'modal-md', 'true', null, function() {/* callback */});

}
;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
								

// CREATE|UPDATE FORMS ARE SEDING VARIABLES (via POST) IN THIS FORMAT:

Array
(
    [action] => add_event
    [id] => 
    [start] => 2019-08-20 06:03
    [end] => 
    [startRecur] => 2019-08-23 06:03
    [endRecur] => 
    [daysOfWeek] => Array 	// recurency days
        (
            [0] => 0 		// 0 = Sunday
            [1] => 3
        )

    [title] => event title
    [url] => 
    [className] => bg-primary border-primary text-white
    [description] => 
)