Add manifest.json; add some meta for iOS to index.html; add iOS icons for testing

public/index.html

@@ -8,21 +8,40 @@
 	<meta name="keywords" content="">
 	<meta name="author" content="">
 	<meta name="viewport" content="width=device-width, initial-scale=1.0">
-	<!-- <meta http-equiv="refresh" content="30"> --
+	<!-- <meta http-equiv="refresh" content="30"> -->
 
+	<!-- NOTE: iOS - Add to Homescreen -->
+	<!-- Icon: No transparency allowed -->
+	<link rel="apple-touch-icon" href="img/ios-icon/th_ohmicon_192x192.png"> <!-- iphone -->
+	<link rel="apple-touch-icon" sizes="152x152" href="img/ios-icon/th_ohmicon_152x152.png"><!-- ipad -->
+	<link rel="apple-touch-icon" sizes="180x180" href="img/ios-icon/th_ohmicon_180x180.png"><!-- iphone-retina -->
+	<link rel="apple-touch-icon" sizes="167x167" href="img/ios-icon/th_ohmicon_167x167.png"><!-- ipad-retina -->
+	<!-- Splash screen: If not set, will be white screen -->
+	<meta name="apple-mobile-web-app-capable" content="yes" />
+	<link rel="apple-touch-startup-image" sizes="2048x2732" href="/ios-splash/apple_splash_2048.png" /><!-- Tablet -->
+	<link rel="apple-touch-startup-image" sizes="1668x2224"href="/ios-splash/apple_splash_1668.png" /><!-- Tablet -->
+	<link rel="apple-touch-startup-image" sizes="1536x2048" href="/ios-splash/apple_splash_1536.png" /><!-- Tablet -->
+	<link rel="apple-touch-startup-image" sizes="1125x2436" href="/ios-splash/apple_splash_1125.png" /><!-- Tablet ? Phone -->
+	<link rel="apple-touch-startup-image" sizes="1242x2208" href="/ios-splash/apple_splash_1242.png" /><!-- Tablet ? Phone -->
+	<link rel="apple-touch-startup-image" sizes="750x1334" href="/ios-splash/apple_splash_750.png" /><!-- Phone -->
+	<link rel="apple-touch-startup-image" sizes="640x1136" href="/ios-splash/apple_splash_640.png" /><!-- Phone -->
+
+	<!-- NOTE: CSS -->
 	<!-- CSS_Material Design for Bootstrap fonts and icons -->
 	<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700|Material+Icons">
-
 	<!-- CSS_Material Design for Bootstrap minified CSS -->
 	<link rel="stylesheet" href="https://unpkg.com/bootstrap-material-design@4.1.1/dist/css/bootstrap-material-design.min.css" integrity="sha384-wXznGJNEXNG1NFsbm0ugrLFMQPWswR3lds2VeinahP8N0zJw9VWSopbjv2x7WCvX" crossorigin="anonymous">
+    <!-- CSS_Custom Design -->
+	<link rel="stylesheet" type="text/css" href="style/style.css">
+
+    <!-- NOTE: Call manifest.json -->
+	<link rel="manifest" href="manifest.json">
 
     <!-- NOTE: VUE.js und VueRouter -->
     <script src=lib/jquery-3.3.1.min.js></script>
     <script src=lib/vue.js></script>
     <script src=lib/vue-router.js></script>
 
-	<!-- CSS_Custom Design -->
-	<link rel="stylesheet" type="text/css" href="style/style.css">
     <!-- NOTE: Call Vue Components -->
     <script src="home.js"></script>
     <!-- <script src="files.js"></script> -->

public/manifest.json

@@ -0,0 +1,15 @@
+{
+  "short_name": "OMapp",
+  "name": "OMapp",
+  "icons": [
+    {
+      "src":"img/th_nbg_ohmicon_amp.png",
+      "sizes": "200x200",
+      "type": "image/png"
+    }
+  ],
+  "start_url": "/?utm_source=homescreen",
+  "background_color": "#FFF",
+  "theme_color": "#0046a0",
+  "display": "standalone"
+}

public/serviceWorker.js

@@ -12,11 +12,11 @@ const shellFilesToCache = [
 	'/message.html',
 	'/bookmark.js',
 	'/createMessage.js',
-	'/files',
+	'/files.js',
 	'/home.js',
 	'/main.js',
 	'/profil.js',
-	'/img/favicon.ico',
+	'/favicon.ico',
 	'/img/th_nbg_ohmicon_amp.png',
 	'/lib/jquery-3.3.1.min.js',
 	'/lib/vue.js',
@@ -25,11 +25,9 @@ const shellFilesToCache = [
 ];
 const logicFilesToCache = [
 	'',
-	'',
 ];
 const dataFilesToCache = [
 	'',
-	'',
 ];
 
 // NOTE: Registration done in main.js
@@ -41,33 +39,21 @@ self.addEventListener('install', function (event) {
 		caches.open(shellCacheKey).then(function (cache) {
 			console.log('[ServiceWorker] Cache shell files.');
 			return cache.addAll(shellFilesToCache);
-		}),
+		}).then(self.skipWaiting()),
 		caches.open(logicCasheKey).then(function (cache) {
 			console.log('[ServiceWorker] Cache logic files.');
 			return cache.addAll(logicFilesToCache);
-		}),
+		}).then(self.skipWaiting()),
 		caches.open(dataCacheKey).then(function (cache) {
 			console.log('[ServiceWorker] Cache data files.');
 			return cache.addAll(dataFilesToCache);
-		})
+		}).then(self.skipWaiting())
 	);
 });
 
 // NOTE: Activate structure and delete older cache versions
 self.addEventListener('activate', function (event) {
 	console.log('[ServiceWorker] Activate');
-	/*const cacheWhitelist = [staticCacheName];
-	event.waitUntil(
-		caches.keys().then(function (cacheNames) {
-			return Promise.all(
-				cacheNames.map(function (cacheName) {
-					if (cacheWhitelist.indexOf(cacheName) === -1) {
-						return caches.delete(cacheName);
-					}
-				})
-			);
-		})
-	);*/
 	event.waitUntil(
 		caches.keys().then(function (cacheKeyList) {
 			return Promise.all(
@@ -90,7 +76,7 @@ self.addEventListener('fetch', function (event) {
 	var dataUrl = 'localhost:8888'; // Provide HTTPS URL for query data.
 	console.log('[ServiceWorker] Fetch', event.request.url);
 
-	if (event.request.url.indexOf(dataUrl) > -1) {
+	//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
@@ -99,8 +85,8 @@ self.addEventListener('fetch', function (event) {
 		 * https://jakearchibald.com/2014/offline-cookbook/#cache-then-network
 		 */
 
-		event.respondWith(
-			caches.open(dataCacheKey).then(function (cache) {
+		/*event.respondWith(
+			caches.open(shellCacheKey).then(function (cache) {
 				return fetch(event.request).then(function (response) {
 					cache.put(event.request.url, response.clone());
 					return response;
@@ -108,7 +94,7 @@ self.addEventListener('fetch', function (event) {
 			})
 		);
 	} else {
-
+	*/
 		/*
 		 * The app is asking for app shell files. In this scenario the app uses the
 		 * "Cache, falling back to the network" offline strategy:
@@ -119,6 +105,22 @@ self.addEventListener('fetch', function (event) {
 				return response || fetch(event.request);
 			})
 		);
-	}
+	//}
+	/*
+	caches.match(event.request).then(cachedResponse => {
+        if (cachedResponse) {
+          return cachedResponse;
+        }
+
+        return caches.open(shellCacheKey).then(cache => {
+          return fetch(event.request).then(response => {
+            // Put a copy of the response in the runtime cache.
+            return cache.put(event.request, response.clone()).then(() => {
+              return response;
+            });
+          });
+        });
+
+})*/
 });