const CACHE_NAME = 'opus-loop-v1';
const ASSETS_TO_CACHE = [
'/',
'/index.html',
'/manifest.json',
'/images/logo.svg',
'/images/icon-192.png',
'/images/icon-512.png',
];
// Install - precache shell
self.addEventListener('install', (event) => {
event.waitUntil(
caches.open(CACHE_NAME).then((cache) => cache.addAll(ASSETS_TO_CACHE))
);
self.skipWaiting();
});
// Activate - clean old caches
self.addEventListener('activate', (event) => {
event.waitUntil(
caches.keys().then((keys) =>
Promise.all(keys.filter((k) => k !== CACHE_NAME).map((k) => caches.delete(k)))
)
);
self.clients.claim();
});
// Fetch - network first for pages, cache first for assets
self.addEventListener('fetch', (event) => {
const { request } = event;
const url = new URL(request.url);
// Skip non-GET and cross-origin
if (request.method !== 'GET' || url.origin !== location.origin) return;
// HTML pages: network first, fallback to cache
if (request.mode === 'navigate') {
event.respondWith(
fetch(request)
.then((response) => {
const clone = response.clone();
caches.open(CACHE_NAME).then((cache) => cache.put(request, clone));
return response;
})
.catch(() => caches.match('/index.html'))
);
return;
}
// Videos: cache first with network fallback (range-request aware)
if (url.pathname.startsWith('/videos/')) {
event.respondWith(
caches.match(request).then((cached) => {
if (cached) return cached;
return fetch(request).then((response) => {
if (response.ok) {
const clone = response.clone();
caches.open(CACHE_NAME).then((cache) => cache.put(request, clone));
}
return response;
});
})
);
return;
}
// Other assets: stale-while-revalidate
event.respondWith(
caches.match(request).then((cached) => {
const fetching = fetch(request).then((response) => {
if (response.ok) {
const clone = response.clone();
caches.open(CACHE_NAME).then((cache) => cache.put(request, clone));
}
return response;
});
return cached || fetching;
})
);
});