feat: pwa

2026-07-14 20:23:48 +02:00
parent 4040b4fdd9
commit 9a795dc3c9
10 changed files with 178 additions and 0 deletions
@@ -1,7 +1,22 @@
 {% extends "admin/base.html" %}
+{% load static %}

 {% block title %}{% if subtitle %}{{ subtitle }} | {% endif %}{{ title }} | {{ site_title|default:_('Osiris') }}{% endblock %}

+{% block extrahead %}
+{{ block.super }}
+<link rel="manifest" href="{% static 'manifest.webmanifest' %}">
+<meta name="theme-color" content="#202a35">
+<meta name="mobile-web-app-capable" content="yes">
+<link rel="apple-touch-icon" href="{% static 'icons/icon-192.png' %}">
+<link rel="icon" href="{% static 'icons/icon-192.png' %}">
+<script>
+  if ("serviceWorker" in navigator) {
+    window.addEventListener("load", () => navigator.serviceWorker.register("/sw.js"));
+  }
+</script>
+{% endblock %}
+
 {% block branding %}
 <div id="site-name"><a href="{% url 'admin:index' %}">{{ site_header|default:_('Osiris') }}</a></div>
 {% if user.is_anonymous %}
@@ -0,0 +1,68 @@
+// Served from / (not /static/) so its scope covers /admin/today/.
+const CACHE = "osiris-v1";
+
+self.addEventListener("install", (event) => {
+  self.skipWaiting();
+});
+
+self.addEventListener("activate", (event) => {
+  event.waitUntil(
+    caches
+      .keys()
+      .then((keys) =>
+        Promise.all(keys.filter((key) => key !== CACHE).map((key) => caches.delete(key)))
+      )
+      .then(() => self.clients.claim())
+  );
+});
+
+self.addEventListener("fetch", (event) => {
+  const { request } = event;
+
+  // Never touch writes or the API: a stale or replayed dose would be a lie.
+  if (request.method !== "GET" || new URL(request.url).pathname.startsWith("/api/")) {
+    return;
+  }
+
+  // Static assets change rarely: serve from cache, refresh in the background.
+  if (new URL(request.url).pathname.startsWith("/static/")) {
+    event.respondWith(
+      caches.open(CACHE).then(async (cache) => {
+        const cached = await cache.match(request);
+        const network = fetch(request)
+          .then((response) => {
+            if (response.ok) cache.put(request, response.clone());
+            return response;
+          })
+          .catch(() => cached);
+        return cached || network;
+      })
+    );
+    return;
+  }
+
+  // Pages: always prefer the live version, fall back to the last one seen so the
+  // app still opens (read-only) with no signal.
+  event.respondWith(
+    fetch(request)
+      .then((response) => {
+        if (response.ok) {
+          const copy = response.clone();
+          caches.open(CACHE).then((cache) => cache.put(request, copy));
+        }
+        return response;
+      })
+      .catch(async () => {
+        const cached = await caches.match(request);
+        return (
+          cached ||
+          new Response(
+            "<!doctype html><meta name='viewport' content='width=device-width,initial-scale=1'>" +
+              "<body style='font-family:system-ui;background:#202a35;color:#eee;padding:2rem;text-align:center'>" +
+              "<h1>Offline</h1><p>Osiris needs a connection to load. Try again once you're back online.</p>",
+            { headers: { "Content-Type": "text/html; charset=utf-8" } }
+          )
+        );
+      })
+  );
+});