Fix calendar widget timezone display (#826)

* Fix calendar widget timezone display

This requires a manual compilation of fullcalendar. See inline
comments in `layouts/calendars/list.html` for details.

xref: fullcalendar/fullcalendar#7450
xref: fullcalendar/fullcalendar#7456

* Remove comment

Author: stefanv

.pre-commit-config.yaml

@@ -37,7 +37,13 @@ repos:
     hooks:
       - id: codespell
         args:
-          ["-L", "recuse,nd,coo", "-w", "--skip=static/teams/bots-graphs.html"]
+          [
+            "-L",
+            "recuse,nd,coo",
+            "-w",
+            "--skip=static/teams/bots-graphs.html",
+            "--skip=static/js-non-bundled/*",
+          ]
 
 ci:
   autofix_prs: false

layouts/calendars/list.html

@@ -31,36 +31,52 @@ <h5 class="subtitle">{{ .Params.Subtitle }}</h5>
 
         <br>
         <script src="https://cdn.jsdelivr.net/npm/vega@5"></script>
-        <script src="https://cdnjs.cloudflare.com/ajax/libs/ical.js/1.5.0/ical.min.js"></script>
-        <script src='https://cdn.jsdelivr.net/npm/fullcalendar@6.1.15/index.global.min.js'></script>
-        <script src="https://cdn.jsdelivr.net/npm/@fullcalendar/icalendar@6.1.15/index.global.min.js"></script>
+        <script src="https://unpkg.com/ical.js/dist/ical.es5.min.cjs"></script>
+        <script src='https://cdn.jsdelivr.net/npm/fullcalendar@6.1.18/index.global.min.js'></script>
+
+        <!-- This is a temporary workaround for https://github.com/fullcalendar/fullcalendar/issues/7456
+
+             PR proposed in https://github.com/fullcalendar/fullcalendar/pull/7450 was compiled and is sourced
+             below as `icalendar.js`
+
+             Build procedure:
+
+             0. Clone git@github.com:fullcalendar/fullcalendar.git
+             1. pnpm install
+             2. pnpm run build
+             3. Unzip resulting archive in ./dist
+             4. Copy /dist/fullcalendar-6.1.19/packages/icalendar/index.global.js to static/js-non-bundled/icalendar.js -->
+
+        <!-- <script src="https://cdn.jsdelivr.net/npm/@fullcalendar/icalendar@6.1.19/index.global.min.js"></script> -->
+        <script src="/js-non-bundled/icalendar.js"></script>
+
         <script>
           document.addEventListener('DOMContentLoaded', function() {
             var cal_colors = vega.scheme('category10');
             var community_calendar = document.getElementById('community-calendar');
             var calendar = new FullCalendar.Calendar(community_calendar, {
-                aspectRatio: 1,
-                timeZone: 'local',
-                initialView: 'dayGridMonth',
-                headerToolbar: {
-                  left: "prev,next today",
-                  center: "title",
-                  right: "dayGridMonth,timeGridWeek,listWeek",
-                },
-                eventSources: [
-                {{ range $key, $value := $.Site.Data.calendars }}
-                    {
-                        url: '{{ $key }}.ics',
-                        format: 'ics',
-                        color: cal_colors.shift(),
-                    },
-                {{ end }}
-                ],
-                eventClick: function(info) {
-                    info.jsEvent.preventDefault();
-                    alert('Event: ' + info.event.title + '\n' + info.event.extendedProps.description + '\n' + 'URL: ' +info.event.url);
+              aspectRatio: 1,
+              timeZone: 'local',
+              initialView: 'timeGridWeek',
+              headerToolbar: {
+                left: "prev,next today",
+                center: "title",
+                right: "dayGridMonth,timeGridWeek,listWeek",
+              },
+              eventSources: [
+                {{- range $key, $value:= $.Site.Data.calendars }}
+                {
+                  url: '{{ $key }}.ics',
+                  format: 'ics',
+                  backgroundColor: cal_colors.shift(),
                 },
-                eventDisplay: 'block',
+                {{- end }}
+              ],
+              eventClick: function(info) {
+                info.jsEvent.preventDefault();
+                alert('Event: ' + info.event.title + '\n' + info.event.extendedProps.description + '\n' + 'URL: ' +info.event.url);
+              },
+              eventDisplay: 'block',
             });
             calendar.render();
           });