refresh tag for demo purpose

package.json

@@ -1,7 +1,7 @@
 {
-	"name": "omapp",
+	"name": "ohmnews",
 	"version": "1.0.0",
-	"description": "ohm-management app for a alternative communication and organization",
+	"description": "ohm-information app for smarter and more intuitive information and organization",
 	"main": "server.js",
 	"scripts": {
 		"test": "echo \"Error: no test specified\" && exit 1",
@@ -13,7 +13,7 @@
 	},
 	"keywords": [
 		"ohm",
-		"management",
+		"news",
 		"app"
 	],
 	"author": "Barbalan, Gruenzinger, Mandutz, Pham, Roemmelt",

public/index.html

@@ -8,52 +8,76 @@
 	<meta name="keywords" content="">
 	<meta name="author" content="">
 	<meta name="viewport" content="width=device-width, initial-scale=1.0">
+<<<<<<< HEAD
     <!--for demonstration:-->
     <meta http-equiv="refresh" content="10">
+=======
+	<!-- <meta http-equiv="refresh" content="30"> -->
+
+	<!-- NOTE: Define Theme Color -->
+	<!-- Chrome, Firefox OS and Opera -->
+	<meta name="theme-color" content="#0046a0">
+
+	<!-- NOTE: Icon for tab recognition -->
+	<!-- highest resolution for Chrome & Opera -->
+	<link rel="icon" sizes="192x192" href="favicon.ico">
+	<!-- icons for Safari -> iOS Icons -->
+	<!-- icons for IE & Windows phone -->
+	<meta name="msapplication-square70x70logo" content="icon_smalltile.png">
+	<meta name="msapplication-square150x150logo" content="icon_mediumtile.png">
+	<meta name="msapplication-square310x310logo" content="icon_largetile.png">
+	<meta name="msapplication-wide310x150logo" content="icon_widetile.png">
+
+>>>>>>> 7a6d46c85b54e576ce552e15a8938291ab2fd22f
 	<!-- NOTE: iOS - Add to Homescreen -->
-	<!-- Icon: No transparency allowed -->
+	<!-- Hide Safari UI Components -->
-	<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 -->
+	<!-- iOS Status bar: black or black-translucent -->
-	<link rel="apple-touch-startup-image" sizes="1668x2224"href="/ios-splash/apple_splash_1668.png" /><!-- Tablet -->
+	<meta name="apple-mobile-web-app-status-bar-style" content="black">
-	<link rel="apple-touch-startup-image" sizes="1536x2048" href="/ios-splash/apple_splash_1536.png" /><!-- Tablet -->
+	<!-- iOS App Name next to Icon -->
-	<link rel="apple-touch-startup-image" sizes="1125x2436" href="/ios-splash/apple_splash_1125.png" /><!-- Tablet ? Phone -->
+	<meta name="apple-mobile-web-app-title" content="OHM News">
-	<link rel="apple-touch-startup-image" sizes="1242x2208" href="/ios-splash/apple_splash_1242.png" /><!-- Tablet ? Phone -->
+	<!-- Icon: No transparency allowed -->
-	<link rel="apple-touch-startup-image" sizes="750x1334" href="/ios-splash/apple_splash_750.png" /><!-- Phone -->
+	<link rel="apple-touch-icon" href="img/launcher/ios_launcher_app_icon_192.png"> <!-- iphone -->
-	<link rel="apple-touch-startup-image" sizes="640x1136" href="/ios-splash/apple_splash_640.png" /><!-- Phone -->
+	<link rel="apple-touch-icon" sizes="152x152" href="img/launcher/ios_launcher_app_icon_152.png"><!-- ipad -->
+	<link rel="apple-touch-icon" sizes="180x180" href="img/launcher/ios_launcher_app_icon_180.png"><!-- iphone-retina -->
+	<link rel="apple-touch-icon" sizes="167x167" href="img/launcher/ios_launcher_app_icon_167.png"><!-- ipad-retina -->
+	<!-- Splash screen: If not set, will be white screen -->
+	<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">
+	<link rel="stylesheet" href="lib/bootstrap-font-and-icons.css">
 	<!-- 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">
+	<link rel="stylesheet" href="lib/bootstrap-material-design.min.css">
     <!-- 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 -->
+    <!-- NOTE: Load JQuery, Vue.js, VueRouter -->
     <script src=lib/jquery-3.3.1.min.js></script>
     <script src=lib/vue.js></script>
     <script src=lib/vue-router.js></script>
 
 	<!-- NOTE: JavaScript Libs & Files -->
-    <script src="home.js"></script>
+    <script src="routes/home.js"></script>
-    <script src="files.js"></script>
+    <script src="routes/files.js"></script>
-    <script src="createMessage.js"></script>
+    <script src="routes/createMessage.js"></script>
-    <script src="bookmark.js"></script>
+    <script src="routes/bookmark.js"></script>
-    <script src="profil.js"></script>
+    <script src="routes/profil.js"></script>
-    <script src="msgCard.js"></script>
+    <script src="routes/msgCard.js"></script>
-    <script src="messageData.js"></script>
+    <script src="routes/messageData.js"></script>
-	<script src="profilCard.js"></script>
+	<script src="routes/profilCard.js"></script>
-	<script src="profilData.js"></script>
+	<script src="routes/profilData.js"></script>
 
-	<title>OMApp</title>
+	<title>OHM News</title>
 </head>
 
 <body>
@@ -108,10 +132,10 @@
 	<!-- <script src="https://cdn.jsdelivr.net/npm/vue@2.5.17/dist/vue.min.js"></script> -->
 	<!-- CDN_jQuery minified lib -->
 	<!--<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>-->
-	<!-- CDN_Popper.js lib -->
+	<!-- Load Popper.js -->
-	<script src="https://unpkg.com/popper.js@1.12.6/dist/umd/popper.js" integrity="sha384-fA23ZRQ3G/J53mElWqVJEGJzU0sTs+SvzG8fXVWP+kJQ1lwFAOkcUOysnlKJC33U" crossorigin="anonymous"></script>
+	<script src="lib/popper-1.12.6.js"></script>
-	<!-- CDN_Bootstrap JS lib -->
+	<!-- Load Bootstrap.js -->
-	<script src="https://unpkg.com/bootstrap-material-design@4.1.1/dist/js/bootstrap-material-design.js" integrity="sha384-CauSuKpEqAFajSpkdjv3z9t8E7RlpJ1UP0lKM/+NdtSarroVKu069AlsRPKkFBz9" crossorigin="anonymous"></script>
+	<script src="lib/bootstrap-material-design.js"></script>
 	<!-- NOTE: Call main.js -->
 	<script src="main.js"></script>
 

public/lib/bootstrap-font-and-icons.css

@@ -0,0 +1,87 @@
+/* fallback */
+@font-face {
+  font-family: 'Material Icons';
+  font-style: normal;
+  font-weight: 400;
+  src: url(../font/flUhRq6tzZclQEJ-Vdg-IuiaDsNc.woff2) format('woff2');
+}
+/* latin-ext */
+@font-face {
+  font-family: 'Roboto';
+  font-style: normal;
+  font-weight: 300;
+  src: local('Roboto Light'), local('Roboto-Light'), url(../font/KFOlCnqEu92Fr1MmSU5fChc4EsA.woff2) format('woff2');
+  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
+}
+/* latin */
+@font-face {
+  font-family: 'Roboto';
+  font-style: normal;
+  font-weight: 300;
+  src: local('Roboto Light'), local('Roboto-Light'), url(../font/KFOlCnqEu92Fr1MmSU5fBBc4.woff2) format('woff2');
+  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+}
+/* latin-ext */
+@font-face {
+  font-family: 'Roboto';
+  font-style: normal;
+  font-weight: 400;
+  src: local('Roboto'), local('Roboto-Regular'), url(../font/KFOmCnqEu92Fr1Mu7GxKOzY.woff2) format('woff2');
+  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
+}
+/* latin */
+@font-face {
+  font-family: 'Roboto';
+  font-style: normal;
+  font-weight: 400;
+  src: local('Roboto'), local('Roboto-Regular'), url(../font/KFOmCnqEu92Fr1Mu4mxK.woff2) format('woff2');
+  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+}
+/* latin-ext */
+@font-face {
+  font-family: 'Roboto';
+  font-style: normal;
+  font-weight: 500;
+  src: local('Roboto Medium'), local('Roboto-Medium'), url(../font/KFOlCnqEu92Fr1MmEU9fChc4EsA.woff2) format('woff2');
+  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
+}
+/* latin */
+@font-face {
+  font-family: 'Roboto';
+  font-style: normal;
+  font-weight: 500;
+  src: local('Roboto Medium'), local('Roboto-Medium'), url(../font/KFOlCnqEu92Fr1MmEU9fBBc4.woff2) format('woff2');
+  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+}
+/* latin-ext */
+@font-face {
+  font-family: 'Roboto';
+  font-style: normal;
+  font-weight: 700;
+  src: local('Roboto Bold'), local('Roboto-Bold'), url(../font/KFOlCnqEu92Fr1MmWUlfChc4EsA.woff2) format('woff2');
+  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
+}
+/* latin */
+@font-face {
+  font-family: 'Roboto';
+  font-style: normal;
+  font-weight: 700;
+  src: local('Roboto Bold'), local('Roboto-Bold'), url(../font/KFOlCnqEu92Fr1MmWUlfBBc4.woff2) format('woff2');
+  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+}
+
+.material-icons {
+  font-family: 'Material Icons';
+  font-weight: normal;
+  font-style: normal;
+  font-size: 24px;
+  line-height: 1;
+  letter-spacing: normal;
+  text-transform: none;
+  display: inline-block;
+  white-space: nowrap;
+  word-wrap: normal;
+  direction: ltr;
+  -webkit-font-feature-settings: 'liga';
+  -webkit-font-smoothing: antialiased;
+}

public/main.js

@@ -2,11 +2,10 @@
  * Main JavaScript file - Entry point of all JS files *
  ******************************************************/
 
-// NOTE: ServiceWorker Registration
+// Wait until page loaded
-if ('serviceWorker' in navigator) {
+window.addEventListener('load', () => {
-	window.addEventListener('load', function () {
+	if ('serviceWorker' in navigator) {
-		// Register a service worker hosted at the root of the
+		// NOTE: ServiceWorker Registration
-		// site using the default scope ('/').
 		return navigator.serviceWorker.register('serviceWorker.js', {
 			scope: '/'
 		}).then(function (registration) {
@@ -14,17 +13,13 @@ if ('serviceWorker' in navigator) {
 		}).catch(function (error) {
 			return console.log('[Service worker] Registration failed: ', error);
 		});
-	});
+	} else {
-} else {
+		console.log('[ServiceWorker] are not supported.');
-	console.log('[ServiceWorker] are not supported.');
+		return;
-}
+	}
+});
 
 // NOTE: Set Bootstrap materialdesign
 document.addEventListener("DOMContentLoaded", function () {
 	$('body').bootstrapMaterialDesign();
 }, false);
-/*
-$(document).ready(function() {
-	$('body').bootstrapMaterialDesign();
-});
-*/

public/manifest.json

@@ -1,15 +1,22 @@
 {
-  "short_name": "OMapp",
+  	"short_name": "OHM News",
-  "name": "OMapp",
+  	"name": "OHM News",
-  "icons": [
+  	"icons": [
-    {
+    	{
-      "src":"img/th_nbg_ohmicon_amp.png",
+      		"src":"img/launcher/android_launcher_app_icon_192.png",
-      "sizes": "200x200",
+      		"type": "image/png",
-      "type": "image/png"
+      		"sizes": "192x192"
-    }
+    	},
-  ],
+		{
-  "start_url": "/om/?utm_source=homescreen",
+      		"src":"img/launcher/android_launcher_app_icon_512.png",
-  "background_color": "#FFF",
+      		"type": "image/png",
-  "theme_color": "#0046a0",
+      		"sizes": "512x512"
-  "display": "standalone"
+    	}
+  	],
+	"start_url": "/om/?utm_source=homescreen",
+  	"background_color": "#FFF",
+  	"display": "standalone",
+	"orientation": "portrait",
+  	"scope": "/om/",
+  	"theme_color": "#0046a0"
 }

public/routes/profilCard.js

@@ -1,6 +1,6 @@
 Vue.component('ProfilCard', {
     template: `<div>
-                <img class="profil-img rounded-circle" src="img/profil_icon2.png" width=120px height=120px>
+                <img class="profil-img rounded-circle" src="img/profil_icon.png" width=120px height=120px>
                 <div class="profil-card card">
                     <div class="edit-item"><i class="material-icons">edit</i></div>
                     <div class="profil-text">

public/serviceWorker.js

@@ -1,167 +1,157 @@
 'use strict';
+/* ================================== */
+/* NOTE: Registration done in main.js */
+/* ================================== */
 
-// NOTE: CacheKey & FilesToCache Lists
+/* =================================== */
-const cacheKey = 'omapp-';
+/* NOTE: CacheKey & FilesToCache Lists */
-const staticCacheKey = cacheKey + 's-v' + '1';
+/* =================================== */
-const dataCacheKey = casheKey + 'd-v' + '1';
+const version = '1';
-const staticFilesToCache = [
+const appPrefix = 'ohmnews-';
-	'/',
+const staticCacheKey = appPrefix + 'static-v' + version;
-	'manifest.json',
+const dataCacheKey = appPrefix + 'content-data';
-	'index.html',
+var allCacheKey = [
-	'message.html',
+        staticCacheKey,
-	'bookmark.js',
+        dataCacheKey
-	'createMessage.js',
-	'files.js',
-	'home.js',
-	'main.js',
-	'profil.js',
-	'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 dataFilesToCache = [
-	'',
 ];
 
-// NOTE: Registration done in main.js
+/* ================================== */
-
+/* NOTE: Install: Save files to cache */
-// NOTE: Install and activate: Populating cache
+/* ================================== */
 // Install new service worker even when old version still in use.
 // Install happens only once a lifetime of a service worker.
-self.addEventListener('install', function(event) {
+const cacheResources = async () => {
-	console.log('[ServiceWorker] Install');
+        const staticFilesToCache = [
-	// don't wait
+                './',
-	self.skipWaiting();
+                'favicon.ico',
-	// cache static files
+                'index.html',
-	event.waitUntil(
+                'main.js',
-		caches.open(staticCacheKey).then(function(cache) {
+                'manifest.json',
-			console.log('[ServiceWorker] Cache static files.');
+                'font/flUhRq6tzZclQEJ-Vdg-IuiaDsNc.woff2',
-			return cache.addAll(staticFilesToCache);
+                'font/KFOlCnqEu92Fr1MmEU9fBBc4.woff2',
-		}),
+                'font/KFOlCnqEu92Fr1MmEU9fChc4EsA.woff2',
-		caches.open(dataCacheKey).then(function(cache) {
+                'font/KFOlCnqEu92Fr1MmSU5fBBc4.woff2',
-			console.log('[ServiceWorker] Cache data files.');
+                'font/KFOlCnqEu92Fr1MmSU5fChc4EsA.woff2',
-			return cache.addAll(dataFilesToCache);
+                'font/KFOlCnqEu92Fr1MmWUlfBBc4.woff2',
-		})
+                'font/KFOlCnqEu92Fr1MmWUlfChc4EsA.woff2',
-	);
+                'font/KFOmCnqEu92Fr1Mu4mxK.woff2',
+                'font/KFOmCnqEu92Fr1Mu7GxKOzY.woff2',
+                'img/launcher/launcher_app_icon_152.png',
+                'img/launcher/launcher_app_icon_167.png',
+                'img/launcher/launcher_app_icon_180.png',
+                'img/launcher/launcher_app_icon_192.png',
+                'img/launcher/launcher_app_icon_512.png',
+                'img/app_icon.png',
+                'img/launcher_app_icon.png',
+                'img/profil_icon.png',
+                'lib/bootstrap-font-and-icons.css',
+                'lib/bootstrap-material-design.js',
+                'lib/bootstrap-material-design.min.css',
+                'lib/jquery-3.3.1.min.js',
+                'lib/popper-1.12.6.js',
+                'lib/vue-router.js',
+                'lib/vue.js',
+                'routes/bookmark.js',
+                'routes/createMessage.js',
+                'routes/files.js',
+                'routes/home.js',
+                'routes/messageData.js',
+                'routes/msgCard.js',
+                'routes/profil.js',
+                'routes/profilCard.js',
+                'routes/profilData.js',
+                'style/style.css',
+        ];
+        const dataFilesToCache = [];
+
+        const cacheStatic = await caches.open(staticCacheKey);
+        cacheStatic.addAll(staticFilesToCache);
+        console.log('[ServiceWorker] Cache static files.');
+
+        const cacheData = await caches.open(dataCacheKey);
+        cacheData.addAll(dataFilesToCache);
+        console.log('[ServiceWorker] Cache data files.');
+        return;
+}
+self.addEventListener('install', event => {
+        // don't wait
+        self.skipWaiting();
+        // cache static files
+        event.waitUntil(cacheResources())
+        console.log('[ServiceWorker] Install');
 });
 
-// NOTE: Activate structure and delete older cache versions
+/* ================================================================ */
-// Activates new version of service worker.
+/* NOTE: Activate: new service worker and delete old cache versions */
+/* ================================================================ */
 // No fetch or pull is called before succesfull activate event.
-self.addEventListener('activate', function(event) {
+const cacheCleanUp = async () => {
-	clients.claim();
+        const cacheKeyList = await caches.keys();
-	var cacheWhitelist = [staticCacheKey, dataCacheKey];
+    const deletions = cacheKeyList
-	event.waitUntil(
+		.filter(key => key.startsWith(appPrefix) && !allCacheKey.includes(key))
-		caches.keys().then(function(cacheKeyList) {
+        .map(key => {
-			return Promise.all(
+                        caches.delete(key)
-				cacheKeyList.map(function(key) {
+                        console.log('[ServiceWorker] Removing old cache', key);
-					if (cacheWhitelist.indexOf(key) === -1) {
+                });
-						console.log('[ServiceWorker] Removing old cache', key);
+    for (const success of deletions) {
-						return caches.delete(key);
+        await success;
-					}
+    }
-				})
+        return;
-			);
+}
-		}).then(() => {
+self.addEventListener('activate', event => {
-			console.log('[ServiceWorker] Activate');
+        event.waitUntil(cacheCleanUp());
-		})
+        clients.claim();
-	);
+        console.log('[ServiceWorker] Activate');
-
-	// Shorten activation time for initial [ServiceWorker] call.
-	//return self.clients.claim();
 });
 
+/* ========================================= */
+/* NOTE: Fetch: Update logic for cache files */
+/* ========================================= */
+self.addEventListener('fetch', event => {
+	// Provide HTTPS URL for query data.
+	//const postMsgURL = 'https://me.efi.th-nuernberg.de/om/api/createMsg';
+	//const postMsgURL = 'http://localhost:8013/api/createMsg';
 
-// NOTE: Fetch structure // TODO: Setup fetching method
+	/* We should only cache GET requests, and deal with the rest of method in the
-self.addEventListener('fetch', function(event) {
+	   client-side, by handling failed POST,PUT,PATCH,etc. requests. */
-	const dataUrl = '	localhost:8013/'; // Provide HTTPS URL for query data.
+	if (event.request.method !== 'GET') { // && event.request.url !== postMsgURL
-	// const url = new URL(event.request.url);
+		/* If we don't block the event as shown below, then the request will go to
-	console.log('[ServiceWorker] Fetch', event.request.url);
+		   the network as usual. */
+		console.log('[ServiceWorker] Fetch event ignored.', event.request.method, event.request.url);
+		return;
+	}
 
-	//if (event.request.url.indexOf(dataUrl) > -1) {
+	event.respondWith(async function update() {
-		/*
+		try {
-		 * When the request URL contains dataUrl, the app is asking for fresh
+			var requestURL = new URL(event.request.url);
-		 * 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(
+			/*if (requestURL.href === postMsgURL) {
-			caches.open(staticCacheKey).then(function(cache) {
+				console.log('New Msg created. ReqURL: ', event.request.method, event.request.url);
-				return fetch(event.request).then(function(response) {
+			}*/
-					cache.put(event.request.url, response.clone());
+
-					return response;
+			// Start the network request as soon as possible.
-				});
+			const networkPromise = fetch(requestURL);
-			})
+
-		);
+			const cachedResponse = await caches.match(event.request);
-	} else {
+
-	*/
+			const networkResponse = await networkPromise;
-		/*
+			// Check if response is valid, status is 200, response type is basic
-		 * The app is asking for app shell files. In this scenario the app uses the
+			// (indicates request is from origin, means that requests to third party
-		 * "Cache, falling back to the network" offline strategy:
+			// assets aren't cached as well.
-		 * https://jakearchibald.com/2014/offline-cookbook/#cache-falling-back-to-network
+			if (!networkResponse || networkResponse.status !== 200
-		 */
+				|| networkResponse.type !== 'basic') return networkResponse;
-		/*
+
-		// serve the cat SVG from the cache if the request is
+			const cache = await caches.open(staticCacheKey);
-		// same-origin and the path is '/dog.svg'
+			// We have to clone the response here because request bodies can only
-		if (url.origin == location.origin && url.pathname == '/dog.svg') {
+			// be read once. Placing a response in the cache counts as a read.
-			event.respondWith(caches.match('/cat.svg'));
+			cache.put(event.request, networkResponse.clone());
+
+			if (cachedResponse) return cachedResponse;
+			console.log('[ServiceWorker] Fetch', event.request);
+			return networkResponse;
+		} catch (err) {
+			// Report a lack of connectivity to the user.
+			console.log('No Network connection: ',err);
 		}
-		*/
+	}());
-
-		event.respondWith(
-			caches.match(event.request)
-			.then(function(response) {
-				if (response) {
-					return response;
-				}
-				return fetch(event.request).then(
-          			function(response) {
-						// Check if we received a valid response
-						// - Ensure the response is valid.
-						// - Check the status is 200 on the response.
-						// - Make sure the response type is basic, which indicates that it's a request from our origin.
-						//   This means that requests to third party assets aren't cached as well.
-						if(!response || response.status !== 200 || response.type !== 'basic') {
-						  return response;
-						}
-
-						// IMPORTANT: Clone the response. A response is a stream
-						// and because we want the browser to consume the response
-						// as well as the cache consuming the response, we need
-						// to clone it so we have two streams.
-						// - Reason: response is a stream and object can only consumed once
-						var responseToCache = response.clone();
-
-						caches.open(staticCacheKey)
-						  .then(function(cache) {
-							cache.put(event.request, responseToCache);
-						  });
-
-						return response;
-					}
-				);
-			})
-		);
-	//}
-	/*
-	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;
-            });
-          });
-        });
-
-})*/
 });
-

public/style/style.css

@@ -150,3 +150,15 @@ label.checkbox-inline input[type=checkbox]:checked + .checkbox-decorator .check
 .is-focused[class^=bmd-label] {
   color: #0046a0;
 }
+/*//Präsentation Styles
+.om-card {
+	font-size: 140%;
+}
+.msg-head{
+	font-size:90%;
+}
+.empty-state{
+	margin: 40px;
+	margin-top: 30%;
+	font-size:140%;
+}*/

public/style/style.less

@@ -52,6 +52,10 @@
     }
 }
 
+a.nav-item.nav-link{
+
+}
+
 //msg-Card
 .om-card{
     margin: 10px;
@@ -174,3 +178,17 @@
 .is-focused [class*="bmd-label"], .is-focused[class^=bmd-label]{
 	color: @color;
 }
+
+/*//Präsentation Styles
+.om-card {
+	font-size: 140%;
+}
+.msg-head{
+	font-size:90%;
+}
+.empty-state{
+	margin: 40px;
+	margin-top: 30%;
+	font-size:140%;
+}*/
+

server.js

@@ -93,7 +93,7 @@ const mongoose = require('mongoose');
 mongoose.Promise = global.Promise;
 
 // Connecting to the database
-mongoose.connect(dbConfig.url)
+mongoose.connect(dbConfig.url, {useNewUrlParser: true})
 .then(() => {
     console.log("Successfully connected to MongoDB.");
 }).catch(err => {
@@ -230,20 +230,23 @@ http.createServer (app) .listen (http_port, function () {
 var options;
 try {
     try {
-	// In case it's a real certificate: add CA chain cersts (TODO: use array if required)
+		// In case it's a real certificate: add CA chain cersts (TODO: use array if required)
-    var ca = fs.readFileSync ('keys/ca_cert.pem');
+    	var ca = fs.readFileSync ('keys/ca_cert.pem');
     } catch (e) {
-	ca = undefined;
+		ca = undefined;
-	console.log ("Note: Can't read CA bundle: "+e);
+		console.log ("Note: Can't read CA bundle: "+e);
     }
-    options = {
+	if (ca != null) {
-	key: fs.readFileSync  ('keys/omkey.pem'),
+
-	cert: fs.readFileSync ('keys/certificate.pem'),
+		options = {
-	ca: ca
+			key: fs.readFileSync  ('keys/omkey.pem'),
-    };
+			cert: fs.readFileSync ('keys/certificate.pem'),
-    https.createServer (options, app) .listen (https_port, function () {
+			ca: ca
-	console.log ("Express https server listening on port " + https_port);
+    	};
-    });
+		https.createServer (options, app) .listen (https_port, function () {
+			console.log ("Express https server listening on port " + https_port);
+		});
+	}
 } catch (e) {
     console.log ("Note: Can't read SSL keys/certs: "+e+"\nDisabling https server");
 }