Fix/hide classes holidays

src/components/DaySummary.vue

@@ -2,14 +2,15 @@
 import { onActivated, watch } from 'vue'
 import { state, cache } from '../model.js'
 import { classrooms } from '../utils/locations.js'
+import { getTodayHoliday } from '../utils/holidays.js'
 import { MapPinIcon, AcademicCapIcon, BookOpenIcon } from '@heroicons/vue/24/outline'
 import { useRouter } from 'vue-router'
 
 const router = useRouter()
+const todayHoliday = getTodayHoliday()
 let classes = $ref(false)
 let tip = $ref(''), displayTime = $ref(''), target = $ref(0), targetClass = $ref(null)
 
-
 //get all classes / custom events for today, and sort by time
 function getClasses () {
 
@@ -87,6 +88,7 @@ function currentwTime () {
 function updateStatus () {
   const wTime = currentwTime()
   let t = Infinity // target
+  if (todayHoliday) return tip = `Day off today for ${todayHoliday}! 😌`
   if (!classes || !classes.length) return tip = 'Day Off! 🏖️'
   for (const c of classes) { // check current class
     c.next = false
@@ -156,7 +158,7 @@ tick()
               {{ targetClass.location }}
             </div>
           </div>
-          <div v-for="c in classes" class="relative rounded-r-sm p-2 mx-1 h-full overflow-hidden w-40 all-transition" :class="c.current ? 'bg-red-50' : (c.next ? 'bg-yellow-50' : 'bg-blue-50')"><!-- course card -->
+          <div v-if="!todayHoliday" v-for="c in classes" class="relative rounded-r-sm p-2 mx-1 h-full overflow-hidden w-40 all-transition" :class="c.current ? 'bg-red-50' : (c.next ? 'bg-yellow-50' : 'bg-blue-50')"><!-- course card -->
             <div class="flex items-center justify-between w-full">
               <div class="flex items-center">
                 <b>{{ c.course }}</b>
@@ -173,7 +175,7 @@ tick()
             <div class="text-sm">{{ c.time }}</div>
             <div class="all-transition absolute bottom-0 top-0 left-0 w-0.5" :class="c.current ? 'bg-red-500' : (c.next ? 'bg-yellow-500' : 'bg-blue-500')" />
           </div>
-          <div v-if="classes && !classes.length" class="px-4">You don't have classes today! 👻</div>
+          <div v-if="(classes && !classes.length) || todayHoliday" class="px-4">You don't have classes today! 👻</div>
         </div>
       </div>
     </Transition>

src/utils/holidays.js

@@ -0,0 +1,57 @@
+const getHolidays = (year) => {
+  function nthWeekdayOfMonth(n, weekday, month) {
+    const firstDayOfMonth = new Date(year, month, 1);
+    const firstWeekday = firstDayOfMonth.getDay();
+    const offset = (weekday - firstWeekday + 7) % 7;
+    return new Date(year, month, 1 + offset + (n - 1) * 7);
+  }
+
+  const getMemorialDay = () => {
+    const lastDayOfMay = new Date(year, 4, 31);
+    const lastWeekday = lastDayOfMay.getDay();
+    const offset = (lastWeekday - 1 + 7) % 7;
+    return new Date(year, 4, 31 - offset);
+  }
+
+  const dateRange = (startMonth, startDay, endMonth, endDay, endYear = year) => {
+    const dates = [];
+    const end = new Date(endYear, endMonth, endDay);
+    for (let d = new Date(year, startMonth, startDay); d <= end; d.setDate(d.getDate() + 1)) {
+      dates.push(new Date(d));
+    }
+    return dates;
+  }
+
+  const date = (month, day) => {
+    return [new Date(year, month, day)];
+  }
+
+  const fmt = (d) => d.toISOString().slice(0, 10);
+
+  return new Map([
+    ["Veterans Day", date(10, 11).map(fmt)],
+    ["Thanksgiving", (() => { const t = nthWeekdayOfMonth(4, 4, 10); return [t, new Date(year, 10, t.getDate() + 1)]; })().map(fmt)],
+    ["Christmas", dateRange(11, 24, 11, 25).map(fmt)],
+    ["New Years", dateRange(11, 31, 0, 1, year + 1).map(fmt)],
+    ["Winter Break", dateRange(11, 13, 0, 4, year + 1).map(fmt)],
+    ["M.L.K. Jr. Day", date(0, nthWeekdayOfMonth(3, 1, 0).getDate()).map(fmt)],
+    ["Presidents Day", date(1, nthWeekdayOfMonth(3, 1, 1).getDate()).map(fmt)],
+    ["Cesar Chavez Day", date(2, 27).map(fmt)],
+    ["Spring Break", dateRange(2, 21, 2, 29).map(fmt)],
+    ["Memorial Day", [getMemorialDay()].map(fmt)],
+    ["Juneteenth", date(5, 19).map(fmt)],
+    ["Independence Day", dateRange(6, 3, 6, 4).map(fmt)],
+    ["Labor Day", date(8, nthWeekdayOfMonth(1, 1, 8).getDate()).map(fmt)],
+  ]);
+}
+
+export const getTodayHoliday = () => {
+  const today = new Date().toISOString().slice(0, 10);
+  const holidays = getHolidays(new Date().getFullYear());
+  for (const [name, dates] of holidays) {
+    if (dates.includes(today)) {
+      return name;
+    }
+  }
+  return null;
+}