recreate project

2026-02-10 22:11:06 -05:00
commit 663c0cdbda
10149 changed files with 1379710 additions and 0 deletions
@@ -0,0 +1,73 @@
+<?= $this->extend('layout/main_layout') ?>
+<?= $this->section('content') ?>
+<div class="container-xxl py-5">
+    <div class="container">
+        <div class="d-flex align-items-center gap-3 mb-3">
+            <strong>Legend:</strong>
+            <span class="d-inline-flex align-items-center"><span style="display:inline-block;width:12px;height:12px;border-radius:3px;background:#3788d8;border:1px solid rgba(0,0,0,.2);margin-right:6px"></span>General Event</span>
+            <span class="d-inline-flex align-items-center"><span style="display:inline-block;width:12px;height:12px;border-radius:3px;background:#28a745;border:1px solid rgba(0,0,0,.2);margin-right:6px"></span>Teacher-only Event</span>
+            <span class="d-inline-flex align-items-center"><span style="display:inline-block;width:12px;height:12px;border-radius:3px;background:#ffc107;border:1px solid rgba(0,0,0,.2);margin-right:6px"></span>No School Day</span>
+        </div>
+        <div class="main-content">
+            <div id="calendar-container">
+                <div id="calendar"></div>
+            </div>
+        </div>
+    </div>
+<?= $this->endSection() ?>
+    <?= $this->section('scripts') ?>
+    <script>
+        document.addEventListener('DOMContentLoaded', function() {
+            const calendarEl = document.getElementById('calendar');
+            const isMobile = window.innerWidth <= 576;
+
+            const calendar = new FullCalendar.Calendar(calendarEl, {
+                initialView: isMobile ? 'listWeek' : 'dayGridMonth',
+                height: 'auto',
+                contentHeight: 'auto',
+                expandRows: true,
+                events: <?= json_encode($events) ?>,
+
+                eventDidMount: function(info) {
+                    if (info.event.extendedProps.description) {
+                        $(info.el).tooltip({
+                            title: info.event.extendedProps.description,
+                            placement: 'top',
+                            trigger: 'hover',
+                            container: 'body'
+                        });
+                    }
+                },
+
+                eventContent: function(arg) {
+                    const event = arg.event;
+                    const bg = event.extendedProps.backgroundColor || '#3788d8';
+                    return {
+                        html: `
+                    <div style="
+                        background-color: ${bg};
+                        padding: 4px;
+                        border-radius: 4px;
+                        color: #fff;
+                        font-size: 0.8rem;
+                        text-align: center;">
+                        ${event.title}
+                    </div>`
+                    };
+                },
+
+                windowResize: function(view) {
+                    if (window.innerWidth <= 576 && calendar.view.type !== 'listWeek') {
+                        calendar.changeView('listWeek');
+                    } else if (window.innerWidth > 576 && calendar.view.type !== 'dayGridMonth') {
+                        calendar.changeView('dayGridMonth');
+                    }
+                    calendar.updateSize();
+                }
+            });
+
+            calendar.render();
+            window.calendar = calendar;
+        });
+    </script>
+<?= $this->endSection() ?>