Fixed: ServiceWorker, Favicon.ico must be at root

public/serviceWorker.js

@@ -1,33 +1,62 @@
 'use strict';
 
-// NOTE: StaticCacheName & FilesToCache list
-const staticCacheName = 'omapp-v1.0.0';
-const filesToCache = [
+// NOTE: CacheKey & FilesToCache Lists
+const cacheKey = 'omapp-v';
+const shellCacheKey = cacheKey + '1';
+const logicCasheKey = shellCacheKey + '.' + '0';
+const dataCacheKey = logicCasheKey + '.' + '0';
+const shellFilesToCache = [
 	'/',
+	'/manifest.json',
 	'/index.html',
 	'/message.html',
-	'/style.css',
+	'/bookmark.js',
+	'/createMessage.js',
+	'/files',
+	'/home.js',
 	'/main.js',
-	'/favicon.ico'
+	'/profil.js',
+	'/img/favicon.ico',
+	'/img/th_nbg_ohmicon_amp.png',
+	'/lib/jquery-3.3.1.min.js',
+	'/lib/vue.js',
+	'/lib/vue-router.js',
+	'/style/style.css',
+];
+const logicFilesToCache = [
+	'',
+	'',
+];
+const dataFilesToCache = [
+	'',
+	'',
 ];
 
 // NOTE: Registration done in main.js
 
 // NOTE: Install and activate: Populating cache
 self.addEventListener('install', function (event) {
-	console.log('Service worker installing...');
+	console.log('[ServiceWorker] Install');
 	event.waitUntil(
-		(console.log('Trying to install service worker and static cache files.'),
-		caches.open(staticCacheName).then(function (cache) {
-			return cache.addAll(filesToCache);
-		}))
+		caches.open(shellCacheKey).then(function (cache) {
+			console.log('[ServiceWorker] Cache shell files.');
+			return cache.addAll(shellFilesToCache);
+		}),
+		caches.open(logicCasheKey).then(function (cache) {
+			console.log('[ServiceWorker] Cache logic files.');
+			return cache.addAll(logicFilesToCache);
+		}),
+		caches.open(dataCacheKey).then(function (cache) {
+			console.log('[ServiceWorker] Cache data files.');
+			return cache.addAll(dataFilesToCache);
+		})
 	);
 });
 
 // NOTE: Activate structure and delete older cache versions
 self.addEventListener('activate', function (event) {
-	console.log('Activating new service worker...');
-	const cacheWhitelist = [staticCacheName];
+	console.log('[ServiceWorker] Activate');
+	/*const cacheWhitelist = [staticCacheName];
 	event.waitUntil(
 		caches.keys().then(function (cacheNames) {
 			return Promise.all(
@@ -38,12 +67,58 @@ self.addEventListener('activate', function (event) {
 				})
 			);
 		})
+	);*/
+	event.waitUntil(
+		caches.keys().then(function (cacheKeyList) {
+			return Promise.all(
+				cacheKeyList.map(function (key) {
+					if (key !== shellCacheKey && key !== logicCasheKey && key !== dataCacheKey) {
+						console.log('[ServiceWorker] Removing old cache', key);
+						return caches.delete(key);
+					}
+				})
+			);
+		})
 	);
+	// Shorten activation time for initial [ServiceWorker] call.
+	//return self.clients.claim();
 });
 
 
 // NOTE: Fetch structure // TODO: Setup fetching method
 self.addEventListener('fetch', function (event) {
-	console.log('Fetch event for ', event.request.url);
-	// Perform some task
+	var dataUrl = 'localhost:8888'; // Provide HTTPS URL for query data.
+	console.log('[ServiceWorker] Fetch', event.request.url);
+
+	if (event.request.url.indexOf(dataUrl) > -1) {
+		/*
+		 * When the request URL contains dataUrl, the app is asking for fresh
+		 * data. In this case, the service worker always goes to the network
+		 * and then caches the response. This is called
+		 * the "Cache then network" strategy:
+		 * https://jakearchibald.com/2014/offline-cookbook/#cache-then-network
+		 */
+
+		event.respondWith(
+			caches.open(dataCacheKey).then(function (cache) {
+				return fetch(event.request).then(function (response) {
+					cache.put(event.request.url, response.clone());
+					return response;
+				});
+			})
+		);
+	} else {
+
+		/*
+		 * The app is asking for app shell files. In this scenario the app uses the
+		 * "Cache, falling back to the network" offline strategy:
+		 * https://jakearchibald.com/2014/offline-cookbook/#cache-falling-back-to-network
+		 */
+		event.respondWith(
+			caches.match(event.request).then(function (response) {
+				return response || fetch(event.request);
+			})
+		);
+	}
 });
+