PWA

.gitignore

@@ -3,6 +3,7 @@
 # CAVALLIUM SPECIFIC
 *.generated.html
 angular.json
+**/package-lock.json
 
 # compiled output
 /dist

buildconfig.json

@@ -30,6 +30,7 @@
 							"tsConfig": "src/tsconfig.app.json",
 							"assets": [
 								"src/favicon.ico",
+								"src/manifest.json",
 								"src/assets",
 								"src/documents"
 							],
@@ -38,7 +39,7 @@
 								"src/styles-fonts.scss"
 							],
 							"scripts": [],
-							"es5BrowserSupport": true,
+							"es5BrowserSupport": false,
 							"i18nFormat": "xlf",
 							"i18nMissingTranslation": "error"
 						},
@@ -56,6 +57,7 @@
 								"extractCss": true,
 								"namedChunks": false,
 								"aot": true,
+								"serviceWorker": true,
 								"extractLicenses": true,
 								"vendorChunk": false,
 								"buildOptimizer": true,
@@ -116,6 +118,7 @@
 							"scripts": [],
 							"assets": [
 								"src/favicon.ico",
+								"src/manifest.json",
 								"src/assets",
 								"src/documents"
 							]

ngsw-config.json

@@ -0,0 +1,29 @@
+{
+  "$schema": "./node_modules/@angular/service-worker/config/schema.json",
+  "index": "/index.html",
+  "assetGroups": [
+    {
+      "name": "app",
+      "installMode": "prefetch",
+      "resources": {
+        "files": [
+          "/favicon.ico",
+          "/index.html",
+          "/*.css",
+          "/*.js"
+        ]
+      }
+    }, {
+      "name": "assets",
+      "installMode": "lazy",
+      "updateMode": "prefetch",
+      "resources": {
+        "files": [
+          "/assets/**",
+          "/documents/**",
+          "/*.(eot|svg|cur|jpg|png|webp|gif|otf|ttf|woff|woff2|ani)"
+        ]
+      }
+    }
+  ]
+}

package.json

@@ -12,40 +12,45 @@
   },
   "private": true,
   "dependencies": {
-    "@angular/animations": "~7.2.0",
-    "@angular/common": "~7.2.0",
-    "@angular/compiler": "~7.2.0",
-    "@angular/core": "~7.2.0",
-    "@angular/forms": "~7.2.0",
-    "@angular/http": "~7.2.0",
-    "@angular/platform-browser": "~7.2.0",
-    "@angular/platform-browser-dynamic": "~7.2.0",
-    "@angular/router": "~7.2.0",
-    "core-js": "^2.5.4",
+    "@angular/animations": "^8.0.0-beta.12",
+    "@angular/common": "^8.0.0-beta.12",
+    "@angular/compiler": "^8.0.0-beta.12",
+    "@angular/core": "^8.0.0-beta.12",
+    "@angular/forms": "^8.0.0-beta.12",
+    "@angular/platform-browser": "^8.0.0-beta.12",
+    "@angular/platform-browser-dynamic": "^8.0.0-beta.12",
+    "@angular/platform-server": "^8.0.0-beta.12",
+    "@angular/pwa": "^0.12.4",
+    "@angular/router": "^8.0.0-beta.12",
+    "@angular/service-worker": "^8.0.0-beta.12",
+    "core-js": "^3.0.1",
     "ngx-markdown": "^7.1.5",
-    "rxjs": "~6.3.3",
+    "rxjs": "^6.4.0",
     "tslib": "^1.9.0",
-    "zone.js": "~0.8.26"
+    "zone.js": "^0.9.0"
   },
   "devDependencies": {
-    "@angular-devkit/build-angular": "~0.13.0",
-    "@angular/cli": "~7.3.8",
-    "@angular/compiler-cli": "~7.2.0",
-    "@angular/language-service": "~7.2.0",
-    "@types/node": "~8.9.4",
-    "@types/jasmine": "~2.8.8",
+    "@angular-devkit/build-angular": "^0.800.0-beta.13",
+    "@angular/cli": "^8.0.0-beta.13",
+    "@angular/compiler-cli": "^8.0.0-beta.12",
+    "@angular/language-service": "^8.0.0-beta.12",
+    "@types/jasmine": "^3.3.12",
     "@types/jasminewd2": "~2.0.3",
-    "codelyzer": "~4.5.0",
-    "jasmine-core": "~2.99.1",
-    "jasmine-spec-reporter": "~4.2.1",
-    "karma": "~4.0.0",
-    "karma-chrome-launcher": "~2.2.0",
+    "@types/node": "^11.13.4",
+    "codelyzer": "^5.0.0",
+    "jasmine-core": "^3.4.0",
+    "jasmine-spec-reporter": "^4.2.1",
+    "karma": "^4.0.1",
+    "karma-chrome-launcher": "^2.2.0",
+    "karma-cli": "^2.0.0",
     "karma-coverage-istanbul-reporter": "~2.0.1",
-    "karma-jasmine": "~1.1.2",
-    "karma-jasmine-html-reporter": "^0.2.2",
-    "protractor": "~5.4.0",
+    "karma-jasmine": "^2.0.1",
+    "karma-jasmine-html-reporter": "^1.4.0",
+    "protractor": "^5.4.2",
+    "rxjs-tslint": "^0.1.7",
     "ts-node": "~7.0.0",
-    "tslint": "~5.11.0",
-    "typescript": "~3.2.2"
+    "tslint": "^5.15.0",
+    "typescript": "^3.4",
+    "webpack": "^4.30.0"
   }
 }

src/app/app.module.ts

@@ -11,6 +11,8 @@ import { RouterEmptyComponent } from "./gui/router-empty/router-empty.component"
 import {HttpClientModule} from "@angular/common/http";
 import { MarkdownModule, MarkedOptions, MarkedRenderer, MarkdownComponent } from "ngx-markdown";
 import { BigLogoComponent } from './gui/big-logo/big-logo.component';
+import { ServiceWorkerModule } from '@angular/service-worker';
+import { environment } from '../environments/environment';
 
 @NgModule({
 	declarations: [
@@ -32,6 +34,7 @@ import { BigLogoComponent } from './gui/big-logo/big-logo.component';
 				useFactory: markedOptionsFactory,
 			},
 		}),
+		ServiceWorkerModule.register('ngsw-worker.js', { enabled: environment.production }),
 	],
 	providers: [],
 	bootstrap: [AppComponent]

src/index.html

@@ -7,8 +7,11 @@
 
   <meta name="viewport" content="width=device-width, initial-scale=1">
   <link rel="icon" type="image/x-icon" href="favicon.ico">
+  <link rel="manifest" href="manifest.json">
+  <meta name="theme-color" content="#1976d2">
 </head>
 <body>
   <app-root></app-root>
+  <noscript>Please enable JavaScript to continue using this application.</noscript>
 </body>
 </html>

src/manifest.json

@@ -0,0 +1,51 @@
+{
+  "name": "cavallium-website",
+  "short_name": "cavallium-website",
+  "theme_color": "#1976d2",
+  "background_color": "#fafafa",
+  "display": "standalone",
+  "scope": "/",
+  "start_url": "/",
+  "icons": [
+    {
+      "src": "assets/icons/icon-72x72.png",
+      "sizes": "72x72",
+      "type": "image/png"
+    },
+    {
+      "src": "assets/icons/icon-96x96.png",
+      "sizes": "96x96",
+      "type": "image/png"
+    },
+    {
+      "src": "assets/icons/icon-128x128.png",
+      "sizes": "128x128",
+      "type": "image/png"
+    },
+    {
+      "src": "assets/icons/icon-144x144.png",
+      "sizes": "144x144",
+      "type": "image/png"
+    },
+    {
+      "src": "assets/icons/icon-152x152.png",
+      "sizes": "152x152",
+      "type": "image/png"
+    },
+    {
+      "src": "assets/icons/icon-192x192.png",
+      "sizes": "192x192",
+      "type": "image/png"
+    },
+    {
+      "src": "assets/icons/icon-384x384.png",
+      "sizes": "384x384",
+      "type": "image/png"
+    },
+    {
+      "src": "assets/icons/icon-512x512.png",
+      "sizes": "512x512",
+      "type": "image/png"
+    }
+  ]
+}

src/styles-fonts.scss

@@ -1,6 +1,7 @@
 /* latin-ext */
 @font-face {
   font-family: 'Muli-custom';
+  font-display: optional;
   font-style: italic;
   font-weight: 600;
   src: local('Muli SemiBold Italic'), local('Muli-SemiBoldItalic'), url(/assets/Muli-600i-latinext.woff2) format('woff2');
@@ -9,6 +10,7 @@
 /* latin */
 @font-face {
   font-family: 'Muli-custom';
+  font-display: optional;
   font-style: italic;
   font-weight: 600;
   src: local('Muli SemiBold Italic'), local('Muli-SemiBoldItalic'), url(/assets/Muli-600i-latin.woff2) format('woff2');
@@ -18,6 +20,7 @@
 /* latin-ext */
 @font-face {
   font-family: 'Muli-custom';
+  font-display: optional;
   font-style: italic;
   font-weight: 800;
   src: local('Muli ExtraBold Italic'), local('Muli-ExtraBoldItalic'), url(/assets/Muli-800i-latinext.woff2) format('woff2');
@@ -26,6 +29,7 @@
 /* latin */
 @font-face {
   font-family: 'Muli-custom';
+  font-display: optional;
   font-style: italic;
   font-weight: 800;
   src: local('Muli ExtraBold Italic'), local('Muli-ExtraBoldItalic'), url(/assets/Muli-800i-latin.woff2) format('woff2');
@@ -35,6 +39,7 @@
 /* latin-ext */
 @font-face {
   font-family: 'Muli-custom';
+  font-display: optional;
   font-style: normal;
   font-weight: 600;
   src: local('Muli SemiBold'), local('Muli-SemiBold'), url(/assets/Muli-600r-latinext.woff2) format('woff2');
@@ -43,6 +48,7 @@
 /* latin */
 @font-face {
   font-family: 'Muli-custom';
+  font-display: optional;
   font-style: normal;
   font-weight: 600;
   src: local('Muli SemiBold'), local('Muli-SemiBold'), url(/assets/Muli-600r-latin.woff2) format('woff2');
@@ -52,6 +58,7 @@
 /* latin-ext */
 @font-face {
   font-family: 'Muli-custom';
+  font-display: optional;
   font-style: normal;
   font-weight: 800;
   src: local('Muli ExtraBold'), local('Muli-ExtraBold'), url(/assets/Muli-800r-latinext.woff2) format('woff2');
@@ -60,6 +67,7 @@
 /* latin */
 @font-face {
   font-family: 'Muli-custom';
+  font-display: optional;
   font-style: normal;
   font-weight: 800;
   src: local('Muli ExtraBold'), local('Muli-ExtraBold'), url(/assets/Muli-800r-latin.woff2) format('woff2');