diff --git a/index.html b/index.html index b6833e3..933feb0 100644 --- a/index.html +++ b/index.html @@ -185,6 +185,20 @@ + + diff --git a/sw.js b/sw.js new file mode 100644 index 0000000..7207ca3 --- /dev/null +++ b/sw.js @@ -0,0 +1,65 @@ +const filesToCache = [ + '/', + 'style/main.css', + 'images/still_life_medium.jpg', + 'index.html', + 'pages/offline.html', + 'pages/404.html' +]; + +const staticCacheName = 'pages-cache-v1'; + +self.addEventListener('install', event => { + console.log('Attempting to install service worker and cache static assets'); + event.waitUntil( + caches.open(staticCacheName) + .then(cache => { + return cache.addAll(filesToCache); + }) + ); +}); + +self.addEventListener('fetch', event => { + console.log('Fetch event for ', event.request.url); + event.respondWith( + caches.match(event.request) + .then(response => { + if (response) { + console.log('Found ', event.request.url, ' in cache'); + return response; + } + console.log('Network request for ', event.request.url); + return fetch(event.request) + .then(response => { + // TODO 5 - Respond with custom 404 page + return caches.open(staticCacheName).then(cache => { + cache.put(event.request.url, response.clone()); + return response; + }); + }); + + }).catch(error => { + + // TODO 6 - Respond with custom offline page + + }) + ); +}); + +self.addEventListener('activate', event => { + console.log('Activating new service worker...'); + + const cacheWhitelist = [staticCacheName]; + + event.waitUntil( + caches.keys().then(cacheNames => { + return Promise.all( + cacheNames.map(cacheName => { + if (cacheWhitelist.indexOf(cacheName) === -1) { + return caches.delete(cacheName); + } + }) + ); + }) + ); +}); \ No newline at end of file