base tabler

liquid/includes/ui/fullcalendar.html

@@ -0,0 +1,87 @@
+{% removeemptylines %}
+{% assign id = include.id | default: 'default' -%}
+
+<div id="calendar-{{ id }}"></div>
+
+{% capture script %}
+<script>
+	document.addEventListener('DOMContentLoaded', function () {
+		var calendarEl = document.getElementById('calendar-{{ id }}');
+		var currentYear = new Date().getFullYear();
+		var currentMonth = new Date().getMonth();
+
+		var calendar = new FullCalendar.Calendar(calendarEl, {
+			initialView: 'dayGridMonth',
+			
+			{% if include.sample-events %}
+			events: [
+				{
+					title: "Offsite Retreat",
+					start: new Date(currentYear, currentMonth, 2, 9, 0),
+					end: new Date(currentYear, currentMonth, 4, 17, 0),
+					color: 'var(--tblr-red)',
+					backgroundColor: 'var(--tblr-red-lt)',
+					borderColor: 'var(--tblr-red-200)',
+				}, 
+				{
+					title: "Monthly Planning",
+					start: new Date(currentYear, currentMonth, 1, 10, 0),
+					end: new Date(currentYear, currentMonth, 1, 11, 30),
+				},
+				{
+					title: "Marketing Strategy Call",
+					start: new Date(currentYear, currentMonth, 4, 14, 0),
+					end: new Date(currentYear, currentMonth, 4, 15, 0)
+				},
+				{
+					title: "Design Sprint",
+					start: new Date(currentYear, currentMonth, 7, 9, 0),
+					end: new Date(currentYear, currentMonth, 7, 12, 0)
+				},
+				{
+					title: "Dev Team Check-in",
+					start: new Date(currentYear, currentMonth, 10, 11, 0),
+					end: new Date(currentYear, currentMonth, 10, 11, 30)
+				},
+				{
+					title: "Customer Feedback Review",
+					start: new Date(currentYear, currentMonth, 13, 13, 0),
+					end: new Date(currentYear, currentMonth, 13, 14, 0)
+				},
+				{
+					title: "Mid-Month Review",
+					start: new Date(currentYear, currentMonth, 15, 10, 30),
+					end: new Date(currentYear, currentMonth, 15, 11, 30)
+				},
+				{
+					title: "Webinar: Product Update",
+					start: new Date(currentYear, currentMonth, 18, 16, 0),
+					end: new Date(currentYear, currentMonth, 18, 17, 0)
+				},
+				{
+					title: "Sales Training",
+					start: new Date(currentYear, currentMonth, 21, 9, 30),
+					end: new Date(currentYear, currentMonth, 21, 11, 0)
+				},
+				{
+					title: "Company All-Hands",
+					start: new Date(currentYear, currentMonth, 25, 15, 0),
+					end: new Date(currentYear, currentMonth, 25, 16, 0)
+				},
+				{
+					title: "End-of-Month Wrap-up",
+					start: new Date(currentYear, currentMonth, 31, 10, 0),
+					end: new Date(currentYear, currentMonth, 31, 11, 0)
+				}
+			],
+			{% endif %}
+		});
+		calendar.render();
+	});
+</script>
+{% endcapture %}
+
+{% capture_script %}
+{{ script }}
+{% endcapture_script %}
+{% endremoveemptylines %}