diff --git a/templates/calendar.html b/templates/calendar.html
new file mode 100644
index 0000000..31067ce
--- /dev/null
+++ b/templates/calendar.html
@@ -0,0 +1,147 @@
+<!doctype html>
+<html lang="en">
+<head>
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <title>Agenda - Edward Betts</title>
+  <link href="{{ url_for("static", filename="bootstrap5/css/bootstrap.min.css") }}" rel="stylesheet">
+  <link rel="icon" href="data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 100 100%22><text y=%22.9em%22 font-size=%2290%22>📅</text></svg>">
+
+  <script async src="{{ url_for("static", filename="es-module-shims/es-module-shims.js") }}"></script>
+
+    <script type='importmap'>
+      {
+        "imports": {
+          "@fullcalendar/core": "https://cdn.skypack.dev/@fullcalendar/core@6.1.9",
+          "@fullcalendar/daygrid": "https://cdn.skypack.dev/@fullcalendar/daygrid@6.1.9",
+          "@fullcalendar/timegrid": "https://cdn.skypack.dev/@fullcalendar/timegrid@6.1.9",
+          "@fullcalendar/list": "https://cdn.skypack.dev/@fullcalendar/list@6.1.9",
+          "@fullcalendar/core/locales/en-gb": "https://cdn.skypack.dev/@fullcalendar/core@6.1.9/locales/en-gb"
+        }
+      }
+    </script>
+    <script type='module'>
+      import { Calendar } from '@fullcalendar/core'
+      import dayGridPlugin from '@fullcalendar/daygrid'
+      import timeGridPlugin from '@fullcalendar/timegrid'
+      import listPlugin from '@fullcalendar/list'
+      import gbLocale from '@fullcalendar/core/locales/en-gb';
+
+      // Function to save the current view to local storage
+      function saveView(view) {
+          localStorage.setItem('fullCalendarDefaultView', view);
+      }
+
+      // Function to get the saved view from local storage
+      function getSavedView() {
+          return localStorage.getItem('fullCalendarDefaultView') || 'dayGridMonth';
+      }
+
+      document.addEventListener('DOMContentLoaded', function() {
+        const calendarEl = document.getElementById('calendar')
+        const calendar = new Calendar(calendarEl, {
+          locale: gbLocale,
+          plugins: [dayGridPlugin, timeGridPlugin, listPlugin ],
+          themeSystem: 'bootstrap5',
+          firstDay: 1,
+          initialView: getSavedView(),
+          viewDidMount: function(info) {
+              saveView(info.view.type);
+          },
+          headerToolbar: {
+            left: 'prev,next today',
+            center: 'title',
+            right: 'dayGridMonth,timeGridWeek,timeGridDay,listWeek'
+          },
+          nowIndicator: true,
+          weekNumbers: true,
+          eventTimeFormat: {
+            hour: '2-digit',
+            minute: '2-digit',
+            hour12: false,
+          },
+          events: {{ fullcalendar_events | tojson(indent=2) }},
+          eventDidMount: function(info) {
+            info.el.title = info.event.title;
+          },
+        })
+        calendar.render()
+      })
+
+    </script>
+
+</head>
+
+{% set event_labels = {
+  "economist": "📰 The Economist",
+  "mothers_day": "Mothers' day",
+  "fathers_day": "Fathers' day",
+  "uk_financial_year_end": "End of financial year",
+  "bank_holiday": "UK bank holiday",
+  "us_holiday": "US holiday",
+  "uk_clock_change": "UK clock change",
+  "us_clock_change": "US clock change",
+  "us_presidential_election": "US pres. election",
+  "xmas_last_second": "Christmas last posting 2nd class",
+  "xmas_last_first": "Christmas last posting 1st class",
+  "up_series": "Up documentary",
+  "waste_schedule": "Waste schedule",
+  "gwr_advance_tickets": "GWR advance tickets",
+  "critical_mass": "Critical Mass",
+}
+%}
+
+{%set class_map = {
+  "bank_holiday": "bg-success-subtle",
+  "conference": "bg-primary-subtle",
+  "us_holiday": "bg-secondary-subtle",
+  "birthday": "bg-info-subtle",
+  "waste_schedule": "bg-danger-subtle",
+} %}
+
+
+
+{% from "navbar.html" import navbar with context %}
+<body>
+  {{ navbar() }}
+
+  <div class="container-fluid mt-2">
+    <h1>Agenda</h1>
+    <p>
+      <a href="/tools">&larr; personal tools</a>
+    </p>
+
+  {% if errors %}
+    {% for error in errors %}
+      <div class="alert alert-danger" role="alert">
+        Error: {{ error }}
+      </div>
+    {% endfor %}
+  {% endif %}
+
+  <div>
+  Markets:
+  <a href="{{ url_for(request.endpoint) }}">Hide while away</a>
+  | <a href="{{ url_for(request.endpoint, markets="show") }}">Show all</a>
+  | <a href="{{ url_for(request.endpoint, markets="hide") }}">Hide all</a>
+  </div>
+
+  <div class="mb-3" id="calendar"></div>
+
+  <div class="mt-2">
+    <h5>Page generation time</h5>
+    <ul>
+    <li>Data gather took {{ "%.1f" | format(data_gather_seconds) }} seconds</li>
+    <li>Stock market open/close took
+        {{ "%.1f" | format(stock_market_times_seconds) }} seconds</li>
+    {% for name, seconds in timings %}
+    <li>{{ name }} took {{ "%.1f" | format(seconds) }} seconds</li>
+    {% endfor %}
+
+    </ul>
+  </div>
+
+  </div>
+  <script src="{{ url_for("static", filename="bootstrap5/js/bootstrap.bundle.min.js") }}"></script>
+</body>
+</html>
