Files
ttvfx/public/set/sw.js
T
twotalesanimation 52d492506b
Deploy / deploy (push) Successful in 35s
Add /set/spill: on-set green screen spill checker
- Phone camera or photo -> WebGL shader that classifies every pixel against
  the sampled screen colour; colour-blind friendly (stripes, motion, words)
- Views: Spill, Screen (flat colour), rough live Key, Evenness
- Spill = worse of lean toward the screen hue and the green/blue despill
  limit, tuned on a real Alexa car-interior plate (teal screen, green bounce)
- Plain-English verdict incl. widespread colour cast; tap for readouts
- Pick screen / pick white (neutral reference), freeze, exposure/WB lock
- Service worker caches each /set page under its own path (spill page no
  longer overwrites the markers page offline); link from /set

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
2026-10-07 11:55:24 +02:00

60 lines
2.0 KiB
JavaScript

// Offline cache for /set (screen markers, spill checker). Crews often have no signal on set:
// once the page has loaded once, it and every marker image work offline.
// Must match OFFLINE_CACHE in components/set/MarkerPicker.tsx
const CACHE = "ttvfx-set-v1";
self.addEventListener("install", (event) => {
event.waitUntil(caches.open(CACHE).then((c) => c.addAll(["/set/"])).then(() => self.skipWaiting()));
});
self.addEventListener("activate", (event) => {
event.waitUntil(
caches
.keys()
.then((keys) => Promise.all(keys.filter((k) => k.startsWith("ttvfx-set-") && k !== CACHE).map((k) => caches.delete(k))))
.then(() => self.clients.claim()),
);
});
self.addEventListener("fetch", (event) => {
const req = event.request;
if (req.method !== "GET") return;
const url = new URL(req.url);
if (url.origin !== self.location.origin) return;
// Pages (/set/, /set/spill/): network first so updates arrive, cached copy when offline.
// Each page is cached under its own path so one never replaces the other.
if (req.mode === "navigate") {
const page = url.pathname.endsWith("/") ? url.pathname : url.pathname + "/";
event.respondWith(
fetch(req)
.then((res) => {
if (res.ok) {
const copy = res.clone();
caches.open(CACHE).then((c) => c.put(page, copy));
}
return res;
})
.catch(() => caches.match(page).then((hit) => hit || caches.match("/set/"))),
);
return;
}
// Marker images, build assets, fonts, icons: cache first
if (url.pathname.startsWith("/set/") || url.pathname.startsWith("/_next/") || /\.(png|woff2|webmanifest)$/.test(url.pathname)) {
event.respondWith(
caches.match(req).then(
(hit) =>
hit ||
fetch(req).then((res) => {
if (res.ok) {
const copy = res.clone();
caches.open(CACHE).then((c) => c.put(req, copy));
}
return res;
}),
),
);
}
});