Mercurial
comparison mrjunejune/src/sw.js @ 256:30c2196d03d4
[site] Integrate Zenbu themes and components
Co-authored-by: Copilot <[email protected]>
| author | MrJuneJune <me@mrjunejune.com> |
|---|---|
| date | Tue, 04 Aug 2026 16:49:01 -0700 |
| parents | |
| children | 60a876c4587a |
comparison
equal
deleted
inserted
replaced
| 255:5ec271d612ae | 256:30c2196d03d4 |
|---|---|
| 1 // Root-scoped Service Worker for MrJuneJune PWA | |
| 2 const CACHE_VERSION = 'v5-zenbu-themes'; | |
| 3 const CACHE_NAME = `mrjunejune-${CACHE_VERSION}`; | |
| 4 | |
| 5 // Files to cache immediately on install | |
| 6 const STATIC_CACHE = [ | |
| 7 '/', | |
| 8 '/index.js', | |
| 9 '/base.css', | |
| 10 '/public/design-system/styles/tokens.css', | |
| 11 '/public/design-system/styles/themes.css', | |
| 12 '/public/design-system/styles/components.css', | |
| 13 '/public/design-system/styles/shadcn.css', | |
| 14 '/public/design-system/components/index.js', | |
| 15 '/public/design-system/components/alert.js', | |
| 16 '/public/design-system/components/button.js', | |
| 17 '/public/design-system/components/card.js', | |
| 18 '/public/design-system/components/collections.js', | |
| 19 '/public/design-system/components/disclosure.js', | |
| 20 '/public/design-system/components/field.js', | |
| 21 '/public/design-system/components/forms.js', | |
| 22 '/public/design-system/components/icon.js', | |
| 23 '/public/design-system/components/notifications.js', | |
| 24 '/public/design-system/components/overlays.js', | |
| 25 '/public/design-system/components/primitives.js', | |
| 26 '/public/design-system/components/stack.js', | |
| 27 '/public/design-system/components/story.js', | |
| 28 '/public/epi_all_colors.svg', | |
| 29 '/public/fonts/Roboto-Regular.ttf', | |
| 30 '/public/fonts/Roboto-Thin.ttf', | |
| 31 '/public/fonts/more-sugar.regular.otf', | |
| 32 '/public/fonts/more-sugar.thin.otf', | |
| 33 ]; | |
| 34 | |
| 35 // Install event - cache static assets | |
| 36 self.addEventListener('install', (event) => { | |
| 37 console.log('[SW] Installing service worker...'); | |
| 38 | |
| 39 event.waitUntil( | |
| 40 caches.open(CACHE_NAME).then((cache) => { | |
| 41 console.log('[SW] Caching static assets'); | |
| 42 return cache.addAll(STATIC_CACHE); | |
| 43 }).then(() => { | |
| 44 console.log('[SW] Skip waiting'); | |
| 45 return self.skipWaiting(); | |
| 46 }) | |
| 47 ); | |
| 48 }); | |
| 49 | |
| 50 // Activate event - clean up old caches | |
| 51 self.addEventListener('activate', (event) => { | |
| 52 console.log('[SW] Activating service worker...'); | |
| 53 | |
| 54 event.waitUntil( | |
| 55 caches.keys().then((cacheNames) => { | |
| 56 return Promise.all( | |
| 57 cacheNames.map((cacheName) => { | |
| 58 if (cacheName !== CACHE_NAME) { | |
| 59 console.log('[SW] Deleting old cache:', cacheName); | |
| 60 return caches.delete(cacheName); | |
| 61 } | |
| 62 }) | |
| 63 ); | |
| 64 }).then(() => { | |
| 65 console.log('[SW] Claiming clients'); | |
| 66 return self.clients.claim(); | |
| 67 }) | |
| 68 ); | |
| 69 }); | |
| 70 | |
| 71 // Fetch event - serve from cache, fallback to network | |
| 72 self.addEventListener('fetch', (event) => { | |
| 73 const { request } = event; | |
| 74 const url = new URL(request.url); | |
| 75 | |
| 76 // Skip non-GET requests | |
| 77 if (request.method !== 'GET') { | |
| 78 return; | |
| 79 } | |
| 80 | |
| 81 // Skip chrome-extension and other non-http(s) requests | |
| 82 if (!url.protocol.startsWith('http')) { | |
| 83 return; | |
| 84 } | |
| 85 | |
| 86 // Skip API calls and media uploads (always go to network) | |
| 87 if (url.pathname.startsWith('/api/')) { | |
| 88 return; | |
| 89 } | |
| 90 | |
| 91 // The HLS tool and media must always reflect the current player version. | |
| 92 if (url.pathname.startsWith('/tools/hls_player') || | |
| 93 url.pathname.startsWith('/public/hls-sample/')) { | |
| 94 return; | |
| 95 } | |
| 96 | |
| 97 event.respondWith( | |
| 98 caches.match(request).then((cachedResponse) => { | |
| 99 if (cachedResponse) { | |
| 100 console.log('[SW] Serving from cache:', url.pathname); | |
| 101 return cachedResponse; | |
| 102 } | |
| 103 | |
| 104 // Not in cache, fetch from network | |
| 105 return fetch(request).then((networkResponse) => { | |
| 106 // Only cache successful responses | |
| 107 if (!networkResponse || networkResponse.status !== 200 || networkResponse.type === 'error') { | |
| 108 return networkResponse; | |
| 109 } | |
| 110 | |
| 111 // Cache specific file types | |
| 112 const shouldCache = | |
| 113 url.pathname.endsWith('.css') || | |
| 114 url.pathname.endsWith('.js') || | |
| 115 url.pathname.endsWith('.svg') || | |
| 116 url.pathname.endsWith('.jpg') || | |
| 117 url.pathname.endsWith('.webp') || | |
| 118 url.pathname.endsWith('.woff') || | |
| 119 url.pathname.endsWith('.woff2') || | |
| 120 url.pathname.endsWith('.ttf') || | |
| 121 url.pathname.endsWith('.otf') || | |
| 122 url.pathname.startsWith('/blog/') || | |
| 123 url.pathname.startsWith('/notes/') || | |
| 124 url.pathname === '/'; | |
| 125 | |
| 126 if (shouldCache) { | |
| 127 const responseToCache = networkResponse.clone(); | |
| 128 caches.open(CACHE_NAME).then((cache) => { | |
| 129 console.log('[SW] Caching new resource:', url.pathname); | |
| 130 cache.put(request, responseToCache); | |
| 131 }); | |
| 132 } | |
| 133 | |
| 134 return networkResponse; | |
| 135 }).catch((error) => { | |
| 136 console.log('[SW] Fetch failed:', error); | |
| 137 | |
| 138 // Return offline page for HTML requests | |
| 139 if (request.headers.get('Accept').includes('text/html')) { | |
| 140 return caches.match('/offline.html'); | |
| 141 } | |
| 142 }); | |
| 143 }) | |
| 144 ); | |
| 145 }); | |
| 146 | |
| 147 // Handle messages from the client | |
| 148 self.addEventListener('message', (event) => { | |
| 149 if (event.data && event.data.type === 'SKIP_WAITING') { | |
| 150 self.skipWaiting(); | |
| 151 } | |
| 152 | |
| 153 if (event.data && event.data.type === 'CLEAR_CACHE') { | |
| 154 event.waitUntil( | |
| 155 caches.keys().then((cacheNames) => { | |
| 156 return Promise.all( | |
| 157 cacheNames.map((cacheName) => caches.delete(cacheName)) | |
| 158 ); | |
| 159 }) | |
| 160 ); | |
| 161 } | |
| 162 }); |