| Mission Name | ${item.name} | ${launch.rocket.name} | +${launch.rocket.name} | ${launch.payloads[0].name} ${launch.payloads[1] ? ' ' + launch.payloads[1].name : ''} |
${launch.payloads[0].orbit} ${launch.payloads[1] ? ' ' + launch.payloads[1].orbit : ''} |
${launch.payloads[0].customers[0]} ${launch.payloads[1] ? ' ' + launch.payloads[1].customers[0] : ''} |
${launch.launchpad.name} (${launch.launchpad.region}) | ${launch.date_precision === 'month' || launch.date_precision === 'quarter' ? moment(launch.date_local).format('MMM YYYY') : moment(launch.date_local).format('MMM YYYY')} | `; + list.append(row); } diff --git a/dist/service-worker.js b/dist/service-worker.js index 03d7858..596e215 100644 --- a/dist/service-worker.js +++ b/dist/service-worker.js @@ -1,23 +1,45 @@ -// Set this to true for production -var doCache = false; +// // Set this to true for production +var doCache = true; // Name our cache -var CACHE_NAME = 'whenisthenextspacexlaunch'; +var contentAssetCache = 'witnsl-content-assets'; +var contentImgsCache = 'witnsl-content-imgs'; +var allCaches = [contentImgsCache, contentAssetCache]; + +// self.addEventListener('activate', (event) => { +// const cacheWhitelist = [CACHE_NAME]; +// event.waitUntil( +// caches.keys().then((keyList) => +// Promise.all( +// keyList.map((key) => { +// if (!cacheWhitelist.includes(key)) { +// console.log('Deleting cache: ' + key); +// return caches.delete(key); +// } +// }) +// ) +// ) +// ); +// }); // Delete old caches that are not our current one! -self.addEventListener('activate', (event) => { - const cacheWhitelist = [CACHE_NAME]; +self.addEventListener('activate', function (event) { event.waitUntil( - caches.keys().then((keyList) => - Promise.all( - keyList.map((key) => { - if (!cacheWhitelist.includes(key)) { - console.log('Deleting cache: ' + key); - return caches.delete(key); - } - }) - ) - ) + caches.keys().then(function (cacheNames) { + return Promise.all( + cacheNames + .filter(function (cacheName) { + return ( + cacheName.startsWith('witnsl') && + // cacheName != staticCacheName; // old + !allCaches.includes(cacheName) + ); // new + }) + .map(function (cacheName) { + return caches.delete(cacheName); + }) + ); + }) ); }); @@ -25,7 +47,7 @@ self.addEventListener('activate', (event) => { self.addEventListener('install', function (event) { if (doCache) { event.waitUntil( - caches.open(CACHE_NAME).then(function (cache) { + caches.open(contentAssetCache).then(function (cache) { // Get the assets manifest so we can see what our js file is named // This is because webpack hashes it fetch('manifest.json') @@ -36,16 +58,9 @@ self.addEventListener('install', function (event) { // Open a cache and cache our files // We want to cache the page and the main.js generated by webpack // We could also cache any static assets like CSS or images - const urlsToCache = [ - '/index.html', - assets['app.js'], - assets['ui.js'], - assets['http.js'], - assets['storage.js'], - assets['style.css'], - ]; + const urlsToCache = ['/index.html', '/js/lib/fa-all.js', '/js/lib/moment.min.js', '/js/lib/indexeddb.shim.min.js', '/js/lib/dexie.min.js', '/js/app.js', '/js/ui.js', '/js/http.js', '/js/storage.js', '/css/fa-all.min.css', '/css/style.css']; cache.addAll(urlsToCache); - console.log('cached'); + //console.log('cached'); }); }) ); @@ -55,7 +70,28 @@ self.addEventListener('install', function (event) { // When the webpage goes to fetch files, we intercept that request and serve up the matching files // if we have them self.addEventListener('fetch', function (event) { + //console.log(event); if (doCache) { + //Detect know images in /img + var requestUrl = new URL(event.request.url); + if (requestUrl.origin === location.origin) { + // if (requestUrl.pathname === '/') { + // event.respondWith(caches.match('/skeleton')); + // return; + // } + if (requestUrl.pathname.startsWith('/img/')) { + event.respondWith(servePhoto(event.request)); + return; + } + } + + // detect images referenced in api details + if (event.request.url.endsWith('png') || event.request.url.endsWith('jpg') || event.request.url.endsWith('svg')) { + event.respondWith(servePhoto(event.request)); + return; + } + + // default if found in catch return of not continue with fetch request event.respondWith( caches.match(event.request).then(function (response) { return response || fetch(event.request); @@ -63,3 +99,30 @@ self.addEventListener('fetch', function (event) { ); } }); + +function servePhoto(request) { + // Photo urls look like: + // /photos/9-8028-7527734776-e1d2bda28e-800px.jpg + // But storageUrl has the -800px.jpg bit missing. + // Use this url to store & match the image in the cache. + // This means you only store one copy of each photo. + var storageUrl = request.url.replace(/-\d+px\.jpg$/, ''); + + // TODO: return images from the "wittr-content-imgs" cache + // if they're in there. Otherwise, fetch the images from + // the network, put them into the cache, and send it back + // to the browser. + // + // HINT: cache.put supports a plain url as the first parameter + return caches.open(contentImgsCache).then(function (cache) { + return cache.match(storageUrl).then(function (response) { + return ( + response || + fetch(request).then(function (networkResponse) { + cache.put(storageUrl, networkResponse.clone()); + return networkResponse; + }) + ); + }); + }); +}