diff --git a/src/app.html b/src/app.html index f273cc5..7d0accb 100644 --- a/src/app.html +++ b/src/app.html @@ -3,6 +3,7 @@ + %sveltekit.head% diff --git a/src/service-worker.ts b/src/service-worker.ts new file mode 100644 index 0000000..90f0cce --- /dev/null +++ b/src/service-worker.ts @@ -0,0 +1,94 @@ +// Disables access to DOM typings like `HTMLElement` which are not available +// inside a service worker and instantiates the correct globals +/// +/// +/// + +// Ensures that the `$service-worker` import has proper type definitions +/// + +// Only necessary if you have an import from `$env/static/public` +/// + +import { build, files, version } from '$service-worker'; + +// This gives `self` the correct types +const self = globalThis.self as unknown as ServiceWorkerGlobalScope; + +// Create a unique cache name for this deployment +const CACHE = `cache-${version}`; + +const ASSETS = [ + ...build, // the app itself + ...files // everything in `static` +]; + +self.addEventListener('install', (event) => { + // Create a new cache and add all files to it + async function addFilesToCache() { + const cache = await caches.open(CACHE); + await cache.addAll(ASSETS); + } + + event.waitUntil(addFilesToCache()); +}); + +self.addEventListener('activate', (event) => { + // Remove previous cached data from disk + async function deleteOldCaches() { + for (const key of await caches.keys()) { + if (key !== CACHE) await caches.delete(key); + } + } + + event.waitUntil(deleteOldCaches()); +}); + +self.addEventListener('fetch', (event) => { + // ignore POST requests etc + if (event.request.method !== 'GET') return; + + async function respond() { + const url = new URL(event.request.url); + const cache = await caches.open(CACHE); + + // `build`/`files` can always be served from the cache + if (ASSETS.includes(url.pathname)) { + const response = await cache.match(url.pathname); + + if (response) { + return response; + } + } + + // for everything else, try the network first, but + // fall back to the cache if we're offline + try { + const response = await fetch(event.request); + + // if we're offline, fetch can return a value that is not a Response + // instead of throwing - and we can't pass this non-Response to respondWith + if (!(response instanceof Response)) { + throw new Error('invalid response from fetch'); + } + + if (response.status === 200) { + cache.put(event.request, response.clone()); + } + + return response; + } catch (err) { + const response = await cache.match(event.request); + + if (response) { + return response; + } + + // if there's no cache, then just error out + // as there is nothing we can do to respond to this request + throw err; + } + } + + event.respondWith(respond()); +}); diff --git a/static/apple-touch-icon-180x180.png b/static/apple-touch-icon-180x180.png new file mode 100644 index 0000000..eb1abf3 Binary files /dev/null and b/static/apple-touch-icon-180x180.png differ diff --git a/static/favicon-192x192.png b/static/favicon-192x192.png new file mode 100644 index 0000000..94b4298 Binary files /dev/null and b/static/favicon-192x192.png differ diff --git a/static/favicon-512x512.png b/static/favicon-512x512.png new file mode 100644 index 0000000..88a5463 Binary files /dev/null and b/static/favicon-512x512.png differ diff --git a/static/favicon-64x64.png b/static/favicon-64x64.png new file mode 100644 index 0000000..fd91f62 Binary files /dev/null and b/static/favicon-64x64.png differ diff --git a/static/favicon.ico b/static/favicon.ico new file mode 100644 index 0000000..afd8582 Binary files /dev/null and b/static/favicon.ico differ diff --git a/static/logo.svg b/static/logo.svg new file mode 100644 index 0000000..0bac784 --- /dev/null +++ b/static/logo.svg @@ -0,0 +1,4 @@ + + + + diff --git a/static/manifest.json b/static/manifest.json new file mode 100644 index 0000000..d4b50fc --- /dev/null +++ b/static/manifest.json @@ -0,0 +1,26 @@ +{ + "short_name": "Serengo", + "name": "Serengo", + "description": "Meet the unexcpected.", + "icons": [ + { + "src": "/favicon-64x64.png", + "sizes": "64x64", + "type": "image/png" + }, + { + "src": "/favicon-192x192.png", + "sizes": "192x192", + "type": "image/png" + }, + { + "src": "/favicon-512x512.png", + "sizes": "512x512", + "type": "image/png" + } + ], + "start_url": ".", + "display": "standalone", + "theme_color": "black", + "background_color": "white" +}