From ffdf39a7501df27c92e5658c458a8dcc6e1f5da1 Mon Sep 17 00:00:00 2001 From: Daniel Habenicht Date: Fri, 12 Jul 2019 11:13:06 +0200 Subject: [PATCH 01/12] fix(service-worker): remove service worker --- Phonebook.Frontend/angular.json | 12 +- Phonebook.Frontend/src/app/app.component.ts | 120 ++++++++++---------- Phonebook.Frontend/src/app/app.module.ts | 4 - Phonebook.Frontend/src/index.html | 2 - Phonebook.Frontend/src/manifest.json | 51 --------- Phonebook.Frontend/src/ngsw-config.de.json | 32 ------ Phonebook.Frontend/src/ngsw-config.en.json | 32 ------ Phonebook.Frontend/src/ngsw-config.json | 32 ------ 8 files changed, 65 insertions(+), 220 deletions(-) delete mode 100644 Phonebook.Frontend/src/manifest.json delete mode 100644 Phonebook.Frontend/src/ngsw-config.de.json delete mode 100644 Phonebook.Frontend/src/ngsw-config.en.json delete mode 100644 Phonebook.Frontend/src/ngsw-config.json diff --git a/Phonebook.Frontend/angular.json b/Phonebook.Frontend/angular.json index 6e56b8a54..8f2fff467 100644 --- a/Phonebook.Frontend/angular.json +++ b/Phonebook.Frontend/angular.json @@ -20,7 +20,6 @@ "src/assets", "src/favicon.ico", "src/services", - "src/manifest.json", "src/changelog.md" ], "styles": [ @@ -43,8 +42,7 @@ "aot": true, "extractLicenses": true, "vendorChunk": false, - "buildOptimizer": false, - "serviceWorker": true + "buildOptimizer": false }, "configurations": { "en": { @@ -88,7 +86,6 @@ "src/assets", "src/favicon.ico", "src/services", - "src/manifest.json", "src/changelog.md" ], "styles": [ @@ -112,7 +109,6 @@ "extractLicenses": true, "vendorChunk": false, "buildOptimizer": true, - "serviceWorker": true, "fileReplacements": [ { "replace": "src/environments/environment.ts", @@ -144,8 +140,7 @@ "i18nFormat": "xlf", "i18nLocale": "de", "i18nMissingTranslation": "error", - "outputPath": "dist/", - "serviceWorker": false + "outputPath": "dist/" } } }, @@ -192,8 +187,7 @@ "assets": [ "src/assets", "src/favicon.ico", - "src/services", - "src/manifest.json" + "src/services" ], "stylePreprocessorOptions": { "includePaths": [ diff --git a/Phonebook.Frontend/src/app/app.component.ts b/Phonebook.Frontend/src/app/app.component.ts index a80735a4f..2a311672b 100644 --- a/Phonebook.Frontend/src/app/app.component.ts +++ b/Phonebook.Frontend/src/app/app.component.ts @@ -26,7 +26,9 @@ export class AppComponent implements OnInit { private snackBar: MatSnackBar, private releaseMigrationService: ReleaseInfoService, private store: Store, - private swUpdates: SwUpdate, + // Commented as long as serviceWorker is reinstalled + // Issue: https://github.com/T-Systems-MMS/phonebook/issues/87 + // private swUpdates: SwUpdate, private matDialog: MatDialog, private i18n: I18n, private platform: Platform @@ -34,64 +36,66 @@ export class AppComponent implements OnInit { public ngOnInit() { this.store.dispatch(new InitTheme()); - // Checking if the Service Worker was installed correctly. - if (!this.store.selectSnapshot(AppState.serviceWorkerNotificationDisplayed)) { - if ('serviceWorker' in navigator) { - this.swUpdates.activated.subscribe(active => { - if (active.current) { - this.snackBar.open( - this.i18n({ - value: 'Hurray! You can use this Website offline.', - description: 'Message indicating the service worker was successfully installed', - id: 'AppComponentServiceWorkerSuccessMessage', - meaning: 'AppComponent' - }), - '', - { duration: 3000 } - ); - this.store.dispatch(new ServiceWorkerNotificationDisplayed()); - } - }); - } else { - this.snackBar.open( - this.i18n({ - value: 'Your Browser does not support Offline Apps!', - description: 'Message indicating the service worker was not installed', - id: 'AppComponentServiceWorkerErrorMessage', - meaning: 'AppComponent' - }), - '', - { - duration: 3000 - } - ); - this.store.dispatch(new ServiceWorkerNotificationDisplayed()); - } - } + // Commented as long as serviceWorker is reinstalled + // Issue: https://github.com/T-Systems-MMS/phonebook/issues/87 + // //Checking if the Service Worker was installed correctly. + // if (!this.store.selectSnapshot(AppState.serviceWorkerNotificationDisplayed)) { + // if ('serviceWorker' in navigator) { + // this.swUpdates.activated.subscribe(active => { + // if (active.current) { + // this.snackBar.open( + // this.i18n({ + // value: 'Hurray! You can use this Website offline.', + // description: 'Message indicating the service worker was successfully installed', + // id: 'AppComponentServiceWorkerSuccessMessage', + // meaning: 'AppComponent' + // }), + // '', + // { duration: 3000 } + // ); + // this.store.dispatch(new ServiceWorkerNotificationDisplayed()); + // } + // }); + // } else { + // this.snackBar.open( + // this.i18n({ + // value: 'Your Browser does not support Offline Apps!', + // description: 'Message indicating the service worker was not installed', + // id: 'AppComponentServiceWorkerErrorMessage', + // meaning: 'AppComponent' + // }), + // '', + // { + // duration: 3000 + // } + // ); + // this.store.dispatch(new ServiceWorkerNotificationDisplayed()); + // } + // } - // Check if a new Update for the Service worker is available - if (this.swUpdates.isEnabled) { - this.swUpdates.available.subscribe(() => { - const updateNotification = this.snackBar.open( - this.i18n({ - value: 'A newer version is available. Do you want to update straight away?', - description: 'Message indicating the app can be updated and question if it should be updated', - id: 'AppComponentServiceWorkerUpdateMessage', - meaning: 'AppComponent' - }), - this.i18n({ - value: 'Update!', - description: 'Button Text for updating the app', - id: 'AppComponentServiceWorkerUpdateButtonMessage', - meaning: 'AppComponent' - }), - { duration: 4000 } - ); - updateNotification.onAction().subscribe(onAction => { - window.location.reload(); - }); - }); - } + // // Check if a new Update for the Service worker is available + // if (this.swUpdates.isEnabled) { + // this.swUpdates.available.subscribe(() => { + // const updateNotification = this.snackBar.open( + // this.i18n({ + // value: 'A newer version is available. Do you want to update straight away?', + // description: 'Message indicating the app can be updated and question if it should be updated', + // id: 'AppComponentServiceWorkerUpdateMessage', + // meaning: 'AppComponent' + // }), + // this.i18n({ + // value: 'Update!', + // description: 'Button Text for updating the app', + // id: 'AppComponentServiceWorkerUpdateButtonMessage', + // meaning: 'AppComponent' + // }), + // { duration: 4000 } + // ); + // updateNotification.onAction().subscribe(onAction => { + // window.location.reload(); + // }); + // }); + // } // Ask for Permission to send Bug reports const test = this.store.selectSnapshot(AppState.sendFeedback); diff --git a/Phonebook.Frontend/src/app/app.module.ts b/Phonebook.Frontend/src/app/app.module.ts index a58588f81..5e0ca1411 100644 --- a/Phonebook.Frontend/src/app/app.module.ts +++ b/Phonebook.Frontend/src/app/app.module.ts @@ -1,7 +1,6 @@ //Angular Imports import { BrowserModule } from '@angular/platform-browser'; import { NgModule, ErrorHandler, TRANSLATIONS, LOCALE_ID } from '@angular/core'; -import { ServiceWorkerModule } from '@angular/service-worker'; import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; import { HttpClientModule } from '@angular/common/http'; import { environment } from 'src/environments/environment'; @@ -107,9 +106,6 @@ declare const require; FeatureFlagModule, NotImplementedModule, FeedbackDrawerModule, - ServiceWorkerModule.register('./ngsw-worker.js', { - enabled: environment.production - }), NgxsModule.forRoot([AppState, BookmarksState, LastPersonsState, CommonPersonsState, SearchState, TableState]), NgxsStoragePluginModule.forRoot({ key: ['appstate', 'bookmarks', 'commonpersons', 'lastpersons', 'tablestate'] diff --git a/Phonebook.Frontend/src/index.html b/Phonebook.Frontend/src/index.html index 085e47bfd..1830ddfd1 100644 --- a/Phonebook.Frontend/src/index.html +++ b/Phonebook.Frontend/src/index.html @@ -24,8 +24,6 @@ - - diff --git a/Phonebook.Frontend/src/manifest.json b/Phonebook.Frontend/src/manifest.json deleted file mode 100644 index c91563b13..000000000 --- a/Phonebook.Frontend/src/manifest.json +++ /dev/null @@ -1,51 +0,0 @@ -{ - "name": "Phonebook", - "short_name": "Phonebook", - "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" - } - ] -} diff --git a/Phonebook.Frontend/src/ngsw-config.de.json b/Phonebook.Frontend/src/ngsw-config.de.json deleted file mode 100644 index 5830f2766..000000000 --- a/Phonebook.Frontend/src/ngsw-config.de.json +++ /dev/null @@ -1,32 +0,0 @@ -{ - "index": "/index.html", - "assetGroups": [ - { - "name": "app", - "installMode": "prefetch", - "resources": { - "files": ["/favicon.ico", "/index.html", "/*.css", "/*.js", "/*.woff2", "/*.woff", "/*.svg", "/*.ttf", "/*.eot"] - } - }, - { - "name": "assets", - "installMode": "lazy", - "updateMode": "prefetch", - "resources": { - "files": ["/assets/**"] - } - } - ], - "dataGroups": [ - { - "name": "data", - "urls": ["/api/**"], - "cacheConfig": { - "strategy": "performance", - "maxSize": 1, - "maxAge": "1d" - } - } - ], - "navigationUrls": ["/de/**", "!/**/*.*", "! /**/*__*", "! /**/*__*/**"] -} diff --git a/Phonebook.Frontend/src/ngsw-config.en.json b/Phonebook.Frontend/src/ngsw-config.en.json deleted file mode 100644 index e1cd1a751..000000000 --- a/Phonebook.Frontend/src/ngsw-config.en.json +++ /dev/null @@ -1,32 +0,0 @@ -{ - "index": "/index.html", - "assetGroups": [ - { - "name": "app", - "installMode": "prefetch", - "resources": { - "files": ["/favicon.ico", "/index.html", "/*.css", "/*.js", "/*.woff2", "/*.woff", "/*.svg", "/*.ttf", "/*.eot"] - } - }, - { - "name": "assets", - "installMode": "lazy", - "updateMode": "prefetch", - "resources": { - "files": ["/assets/**"] - } - } - ], - "dataGroups": [ - { - "name": "data", - "urls": ["/api/**"], - "cacheConfig": { - "strategy": "performance", - "maxSize": 1, - "maxAge": "1d" - } - } - ], - "navigationUrls": ["/en/**", "!/**/*.*", "! /**/*__*", "! /**/*__*/**"] -} diff --git a/Phonebook.Frontend/src/ngsw-config.json b/Phonebook.Frontend/src/ngsw-config.json deleted file mode 100644 index 4615fd7f4..000000000 --- a/Phonebook.Frontend/src/ngsw-config.json +++ /dev/null @@ -1,32 +0,0 @@ -{ - "index": "/index.html", - "assetGroups": [ - { - "name": "app", - "installMode": "prefetch", - "resources": { - "files": ["/favicon.ico", "/index.html", "/*.css", "/*.js", "/*.woff2", "/*.woff", "/*.svg", "/*.ttf", "/*.eot"] - } - }, - { - "name": "assets", - "installMode": "lazy", - "updateMode": "prefetch", - "resources": { - "files": ["/assets/**"] - } - } - ], - "dataGroups": [ - { - "name": "data", - "urls": ["/api/**"], - "cacheConfig": { - "strategy": "performance", - "maxSize": 1, - "maxAge": "1d" - } - } - ], - "navigationUrls": ["/**", "!/**/*.*", "! /**/*__*", "! /**/*__*/**"] -} From 88007b9b453854231acdf04b1e2ab3869e3d1fbf Mon Sep 17 00:00:00 2001 From: Daniel Habenicht Date: Fri, 12 Jul 2019 11:14:24 +0200 Subject: [PATCH 02/12] chore(angular): remove unneeded copy files --- Phonebook.Frontend/angular.json | 5 +---- 1 file changed, 1 insertion(+), 4 deletions(-) diff --git a/Phonebook.Frontend/angular.json b/Phonebook.Frontend/angular.json index 8f2fff467..f7f6ddda2 100644 --- a/Phonebook.Frontend/angular.json +++ b/Phonebook.Frontend/angular.json @@ -19,7 +19,6 @@ "assets": [ "src/assets", "src/favicon.ico", - "src/services", "src/changelog.md" ], "styles": [ @@ -85,7 +84,6 @@ "assets": [ "src/assets", "src/favicon.ico", - "src/services", "src/changelog.md" ], "styles": [ @@ -186,8 +184,7 @@ ], "assets": [ "src/assets", - "src/favicon.ico", - "src/services" + "src/favicon.ico" ], "stylePreprocessorOptions": { "includePaths": [ From 506f0e1597d38499c653f5b38b494777f2775b1d Mon Sep 17 00:00:00 2001 From: Daniel Habenicht Date: Fri, 12 Jul 2019 11:40:04 +0200 Subject: [PATCH 03/12] fix(service-worker): readd manifest with angular 8 --- Phonebook.Frontend/angular.json | 9 ++-- Phonebook.Frontend/src/index.html | 2 + Phonebook.Frontend/src/manifest.webmanifest | 51 +++++++++++++++++++++ 3 files changed, 59 insertions(+), 3 deletions(-) create mode 100644 Phonebook.Frontend/src/manifest.webmanifest diff --git a/Phonebook.Frontend/angular.json b/Phonebook.Frontend/angular.json index f7f6ddda2..e8517ae8c 100644 --- a/Phonebook.Frontend/angular.json +++ b/Phonebook.Frontend/angular.json @@ -19,7 +19,8 @@ "assets": [ "src/assets", "src/favicon.ico", - "src/changelog.md" + "src/changelog.md", + "src/manifest.webmanifest" ], "styles": [ "src/styles.scss", @@ -84,7 +85,8 @@ "assets": [ "src/assets", "src/favicon.ico", - "src/changelog.md" + "src/changelog.md", + "src/manifest.webmanifest" ], "styles": [ "src/styles.scss", @@ -184,7 +186,8 @@ ], "assets": [ "src/assets", - "src/favicon.ico" + "src/favicon.ico", + "src/manifest.webmanifest" ], "stylePreprocessorOptions": { "includePaths": [ diff --git a/Phonebook.Frontend/src/index.html b/Phonebook.Frontend/src/index.html index 1830ddfd1..27a86979e 100644 --- a/Phonebook.Frontend/src/index.html +++ b/Phonebook.Frontend/src/index.html @@ -22,6 +22,8 @@ + + diff --git a/Phonebook.Frontend/src/manifest.webmanifest b/Phonebook.Frontend/src/manifest.webmanifest new file mode 100644 index 000000000..741c54daa --- /dev/null +++ b/Phonebook.Frontend/src/manifest.webmanifest @@ -0,0 +1,51 @@ +{ + "name": "Phonebook", + "short_name": "Phonebook", + "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" + } + ] +} \ No newline at end of file From 1c3342359c78bec57b6b837182a28fdbbf7e1a0a Mon Sep 17 00:00:00 2001 From: Daniel Habenicht Date: Fri, 12 Jul 2019 11:41:16 +0200 Subject: [PATCH 04/12] fix(service-worker): remove ngsw paths --- Phonebook.Frontend/angular.json | 8 ++------ 1 file changed, 2 insertions(+), 6 deletions(-) diff --git a/Phonebook.Frontend/angular.json b/Phonebook.Frontend/angular.json index e8517ae8c..ca8b01674 100644 --- a/Phonebook.Frontend/angular.json +++ b/Phonebook.Frontend/angular.json @@ -28,7 +28,6 @@ "src/fonts/materialicons/material-icons.css" ], "scripts": [], - "ngswConfigPath": "src/ngsw-config.json", "stylePreprocessorOptions": { "includePaths": [ "src/styles" @@ -99,7 +98,6 @@ "src/styles" ] }, - "ngswConfigPath": "src/ngsw-config.json", "optimization": true, "outputHashing": "all", "sourceMap": false, @@ -123,8 +121,7 @@ "i18nLocale": "en", "i18nMissingTranslation": "error", "outputPath": "dist/en", - "baseHref": "/en/", - "ngswConfigPath": "src/ngsw-config.en.json" + "baseHref": "/en/" }, "de": { "i18nFile": "src/i18n/messages.de.xlf", @@ -132,8 +129,7 @@ "i18nLocale": "de", "i18nMissingTranslation": "error", "outputPath": "dist/de", - "baseHref": "/de/", - "ngswConfigPath": "src/ngsw-config.de.json" + "baseHref": "/de/" }, "preview": { "i18nFile": "src/i18n/messages.de.xlf", From 0f96060bc1557e8a1381be579bb1c566843fd723 Mon Sep 17 00:00:00 2001 From: Daniel Habenicht Date: Fri, 12 Jul 2019 15:01:02 +0200 Subject: [PATCH 05/12] wip --- Phonebook.Frontend/angular.json | 32 +++-- Phonebook.Frontend/ngsw-config.json | 60 +++++++++ Phonebook.Frontend/package.json | 4 +- Phonebook.Frontend/src/app/app.component.ts | 120 +++++++++--------- Phonebook.Frontend/src/app/app.module.ts | 2 + .../src/manifest.de.webmanifest | 51 ++++++++ .../src/manifest.en.webmanifest | 51 ++++++++ 7 files changed, 248 insertions(+), 72 deletions(-) create mode 100644 Phonebook.Frontend/ngsw-config.json create mode 100644 Phonebook.Frontend/src/manifest.de.webmanifest create mode 100644 Phonebook.Frontend/src/manifest.en.webmanifest diff --git a/Phonebook.Frontend/angular.json b/Phonebook.Frontend/angular.json index ca8b01674..81cd992ce 100644 --- a/Phonebook.Frontend/angular.json +++ b/Phonebook.Frontend/angular.json @@ -107,12 +107,8 @@ "extractLicenses": true, "vendorChunk": false, "buildOptimizer": true, - "fileReplacements": [ - { - "replace": "src/environments/environment.ts", - "with": "src/environments/environment.prod.ts" - } - ] + "serviceWorker": true, + "ngswConfigPath": "ngsw-config.json" }, "configurations": { "en": { @@ -121,7 +117,17 @@ "i18nLocale": "en", "i18nMissingTranslation": "error", "outputPath": "dist/en", - "baseHref": "/en/" + "baseHref": "/en/", + "fileReplacements": [ + { + "replace": "src/manifest.webmanifest", + "with": "src/manifest.en.webmanifest" + }, + { + "replace": "src/environments/environment.ts", + "with": "src/environments/environment.prod.ts" + } + ] }, "de": { "i18nFile": "src/i18n/messages.de.xlf", @@ -129,7 +135,17 @@ "i18nLocale": "de", "i18nMissingTranslation": "error", "outputPath": "dist/de", - "baseHref": "/de/" + "baseHref": "/de/", + "fileReplacements": [ + { + "replace": "src/manifest.webmanifest", + "with": "src/manifest.de.webmanifest" + }, + { + "replace": "src/environments/environment.ts", + "with": "src/environments/environment.prod.ts" + } + ] }, "preview": { "i18nFile": "src/i18n/messages.de.xlf", diff --git a/Phonebook.Frontend/ngsw-config.json b/Phonebook.Frontend/ngsw-config.json new file mode 100644 index 000000000..d98e09d5a --- /dev/null +++ b/Phonebook.Frontend/ngsw-config.json @@ -0,0 +1,60 @@ +{ + "$schema": "./node_modules/@angular/service-worker/config/schema.json", + "index": "/index.html", + "assetGroups": [ + { + "name": "app", + "installMode": "prefetch", + "resources": { + "files": [ + "/favicon.ico", + "/index.html", + "/manifest.webmanifest", + "/*.css", + "/*.js", + "/*.woff2", + "/*.woff", + "/*.svg", + "/*.ttf", + "/*.eot" + ] + } + }, + { + "name": "assets", + "installMode": "prefetch", + "updateMode": "prefetch", + "resources": { + "files": [ + "/assets/**", + "/*.(eot|svg|cur|jpg|png|webp|gif|otf|ttf|woff|woff2|ani)" + ] + } + } + ], + "dataGroups": [ + { + "name": "api", + "urls": [ + "/api/**" + ], + "cacheConfig": { + "strategy": "performance", + "maxSize": 1, + "maxAge": "1h" + } + }, + { + "name": "pictures", + "urls": [ + "*.(jpg|png|webp|gif|svg)" + ], + "cacheConfig": { + "strategy": "freshness", + "timeout": "4s", + "maxSize": 1, + "maxAge": "1h" + } + } + ] +} \ No newline at end of file diff --git a/Phonebook.Frontend/package.json b/Phonebook.Frontend/package.json index 4dea6fc66..720d662c4 100644 --- a/Phonebook.Frontend/package.json +++ b/Phonebook.Frontend/package.json @@ -4,7 +4,7 @@ "license": "MIT", "scripts": { "ng": "ng", - "start": "ng serve --ssl --host=0.0.0.0 --poll 1000 --proxy-config proxy.conf.json", + "start": "ng serve --host=0.0.0.0 --poll 1000 --proxy-config proxy.conf.json", "start:en": "npm run start -- --configuration en", "start:de": "npm run start -- --configuration de", "start:test": "npm run start -- --configuration test", @@ -116,4 +116,4 @@ "path": "Phonebook.Frontend/node_modules/cz-customizable" } } -} +} \ No newline at end of file diff --git a/Phonebook.Frontend/src/app/app.component.ts b/Phonebook.Frontend/src/app/app.component.ts index 2a311672b..45a240e0a 100644 --- a/Phonebook.Frontend/src/app/app.component.ts +++ b/Phonebook.Frontend/src/app/app.component.ts @@ -26,9 +26,7 @@ export class AppComponent implements OnInit { private snackBar: MatSnackBar, private releaseMigrationService: ReleaseInfoService, private store: Store, - // Commented as long as serviceWorker is reinstalled - // Issue: https://github.com/T-Systems-MMS/phonebook/issues/87 - // private swUpdates: SwUpdate, + private swUpdates: SwUpdate, private matDialog: MatDialog, private i18n: I18n, private platform: Platform @@ -36,66 +34,64 @@ export class AppComponent implements OnInit { public ngOnInit() { this.store.dispatch(new InitTheme()); - // Commented as long as serviceWorker is reinstalled - // Issue: https://github.com/T-Systems-MMS/phonebook/issues/87 - // //Checking if the Service Worker was installed correctly. - // if (!this.store.selectSnapshot(AppState.serviceWorkerNotificationDisplayed)) { - // if ('serviceWorker' in navigator) { - // this.swUpdates.activated.subscribe(active => { - // if (active.current) { - // this.snackBar.open( - // this.i18n({ - // value: 'Hurray! You can use this Website offline.', - // description: 'Message indicating the service worker was successfully installed', - // id: 'AppComponentServiceWorkerSuccessMessage', - // meaning: 'AppComponent' - // }), - // '', - // { duration: 3000 } - // ); - // this.store.dispatch(new ServiceWorkerNotificationDisplayed()); - // } - // }); - // } else { - // this.snackBar.open( - // this.i18n({ - // value: 'Your Browser does not support Offline Apps!', - // description: 'Message indicating the service worker was not installed', - // id: 'AppComponentServiceWorkerErrorMessage', - // meaning: 'AppComponent' - // }), - // '', - // { - // duration: 3000 - // } - // ); - // this.store.dispatch(new ServiceWorkerNotificationDisplayed()); - // } - // } + //Checking if the Service Worker was installed correctly. + if (!this.store.selectSnapshot(AppState.serviceWorkerNotificationDisplayed)) { + if ('serviceWorker' in navigator) { + this.swUpdates.activated.subscribe(active => { + if (active.current) { + this.snackBar.open( + this.i18n({ + value: 'Hurray! You can use this Website offline.', + description: 'Message indicating the service worker was successfully installed', + id: 'AppComponentServiceWorkerSuccessMessage', + meaning: 'AppComponent' + }), + '', + { duration: 3000 } + ); + this.store.dispatch(new ServiceWorkerNotificationDisplayed()); + } + }); + } else { + this.snackBar.open( + this.i18n({ + value: 'Your Browser does not support Offline Apps!', + description: 'Message indicating the service worker was not installed', + id: 'AppComponentServiceWorkerErrorMessage', + meaning: 'AppComponent' + }), + '', + { + duration: 3000 + } + ); + this.store.dispatch(new ServiceWorkerNotificationDisplayed()); + } + } - // // Check if a new Update for the Service worker is available - // if (this.swUpdates.isEnabled) { - // this.swUpdates.available.subscribe(() => { - // const updateNotification = this.snackBar.open( - // this.i18n({ - // value: 'A newer version is available. Do you want to update straight away?', - // description: 'Message indicating the app can be updated and question if it should be updated', - // id: 'AppComponentServiceWorkerUpdateMessage', - // meaning: 'AppComponent' - // }), - // this.i18n({ - // value: 'Update!', - // description: 'Button Text for updating the app', - // id: 'AppComponentServiceWorkerUpdateButtonMessage', - // meaning: 'AppComponent' - // }), - // { duration: 4000 } - // ); - // updateNotification.onAction().subscribe(onAction => { - // window.location.reload(); - // }); - // }); - // } + // Check if a new Update for the Service worker is available + if (this.swUpdates.isEnabled) { + this.swUpdates.available.subscribe(() => { + const updateNotification = this.snackBar.open( + this.i18n({ + value: 'A newer version is available. Do you want to update straight away?', + description: 'Message indicating the app can be updated and question if it should be updated', + id: 'AppComponentServiceWorkerUpdateMessage', + meaning: 'AppComponent' + }), + this.i18n({ + value: 'Update!', + description: 'Button Text for updating the app', + id: 'AppComponentServiceWorkerUpdateButtonMessage', + meaning: 'AppComponent' + }), + { duration: 4000 } + ); + updateNotification.onAction().subscribe(onAction => { + window.location.reload(); + }); + }); + } // Ask for Permission to send Bug reports const test = this.store.selectSnapshot(AppState.sendFeedback); diff --git a/Phonebook.Frontend/src/app/app.module.ts b/Phonebook.Frontend/src/app/app.module.ts index 5e0ca1411..57a964836 100644 --- a/Phonebook.Frontend/src/app/app.module.ts +++ b/Phonebook.Frontend/src/app/app.module.ts @@ -89,6 +89,7 @@ import { FeedbackDrawerModule } from 'src/app/shared/directives/feedback-drawer/ import { IeWarningModule } from 'src/app/shared/dialogs/ie-warning/ie-warning.module'; import { PlatformModule } from '@angular/cdk/platform'; import { UserDetailPageModule } from 'src/app/pages/user-detail-page/user-detail-page.module'; +import { ServiceWorkerModule } from '@angular/service-worker'; declare const require; @NgModule({ @@ -96,6 +97,7 @@ declare const require; imports: [ BrowserModule, AppRoutingModule, + ServiceWorkerModule.register('ngsw-worker.js', { enabled: environment.production }), BrowserAnimationsModule, HttpClientModule, MaterialModule, diff --git a/Phonebook.Frontend/src/manifest.de.webmanifest b/Phonebook.Frontend/src/manifest.de.webmanifest new file mode 100644 index 000000000..b6c33990c --- /dev/null +++ b/Phonebook.Frontend/src/manifest.de.webmanifest @@ -0,0 +1,51 @@ +{ + "name": "Phonebook - Deutsch", + "short_name": "Phonebook", + "theme_color": "#1976d2", + "background_color": "#fafafa", + "display": "standalone", + "scope": "/de/", + "start_url": "/de/", + "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" + } + ] +} \ No newline at end of file diff --git a/Phonebook.Frontend/src/manifest.en.webmanifest b/Phonebook.Frontend/src/manifest.en.webmanifest new file mode 100644 index 000000000..fb1676804 --- /dev/null +++ b/Phonebook.Frontend/src/manifest.en.webmanifest @@ -0,0 +1,51 @@ +{ + "name": "Phonebook - English", + "short_name": "Phonebook", + "theme_color": "#1976d2", + "background_color": "#fafafa", + "display": "standalone", + "scope": "/en/", + "start_url": "/en/", + "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" + } + ] +} \ No newline at end of file From a55e01bd4e31cdb48ec834cc6a2772cde2603093 Mon Sep 17 00:00:00 2001 From: Daniel Habenicht Date: Mon, 2 Dec 2019 12:20:34 +0100 Subject: [PATCH 06/12] chore(docker): update dockerignore --- Phonebook.Frontend/.dockerignore | 3 ++- Phonebook.Frontend/package-lock.json | 30 ++++++++-------------------- Phonebook.Frontend/package.json | 2 +- 3 files changed, 11 insertions(+), 24 deletions(-) diff --git a/Phonebook.Frontend/.dockerignore b/Phonebook.Frontend/.dockerignore index 045d816fd..33ee44a4e 100644 --- a/Phonebook.Frontend/.dockerignore +++ b/Phonebook.Frontend/.dockerignore @@ -13,4 +13,5 @@ !substitute_variables.sh !globals.js !version.js -!opensearch.xml \ No newline at end of file +!opensearch.xml +!ngsw-config.json \ No newline at end of file diff --git a/Phonebook.Frontend/package-lock.json b/Phonebook.Frontend/package-lock.json index 7a5ef7d7c..6a3792fd9 100644 --- a/Phonebook.Frontend/package-lock.json +++ b/Phonebook.Frontend/package-lock.json @@ -9311,8 +9311,7 @@ "ansi-regex": { "version": "2.1.1", "bundled": true, - "dev": true, - "optional": true + "dev": true }, "aproba": { "version": "1.2.0", @@ -9355,8 +9354,7 @@ "code-point-at": { "version": "1.1.0", "bundled": true, - "dev": true, - "optional": true + "dev": true }, "concat-map": { "version": "0.0.1", @@ -9367,8 +9365,7 @@ "console-control-strings": { "version": "1.1.0", "bundled": true, - "dev": true, - "optional": true + "dev": true }, "core-util-is": { "version": "1.0.2", @@ -9485,8 +9482,7 @@ "inherits": { "version": "2.0.3", "bundled": true, - "dev": true, - "optional": true + "dev": true }, "ini": { "version": "1.3.5", @@ -9498,7 +9494,6 @@ "version": "1.0.0", "bundled": true, "dev": true, - "optional": true, "requires": { "number-is-nan": "^1.0.0" } @@ -9528,7 +9523,6 @@ "version": "2.3.5", "bundled": true, "dev": true, - "optional": true, "requires": { "safe-buffer": "^5.1.2", "yallist": "^3.0.0" @@ -9547,7 +9541,6 @@ "version": "0.5.1", "bundled": true, "dev": true, - "optional": true, "requires": { "minimist": "0.0.8" } @@ -9641,7 +9634,6 @@ "version": "1.4.0", "bundled": true, "dev": true, - "optional": true, "requires": { "wrappy": "1" } @@ -9727,8 +9719,7 @@ "safe-buffer": { "version": "5.1.2", "bundled": true, - "dev": true, - "optional": true + "dev": true }, "safer-buffer": { "version": "2.1.2", @@ -9764,7 +9755,6 @@ "version": "1.0.2", "bundled": true, "dev": true, - "optional": true, "requires": { "code-point-at": "^1.0.0", "is-fullwidth-code-point": "^1.0.0", @@ -9784,7 +9774,6 @@ "version": "3.0.1", "bundled": true, "dev": true, - "optional": true, "requires": { "ansi-regex": "^2.0.0" } @@ -9828,14 +9817,12 @@ "wrappy": { "version": "1.0.2", "bundled": true, - "dev": true, - "optional": true + "dev": true }, "yallist": { "version": "3.0.3", "bundled": true, - "dev": true, - "optional": true + "dev": true } } }, @@ -16872,8 +16859,7 @@ "version": "3.1.0", "resolved": "https://registry.npmjs.org/callsites/-/callsites-3.1.0.tgz", "integrity": "sha512-P8BjAsXvZS+VIDUI11hHCQEv74YT67YUi5JJFNWIqL235sBmjX4+qx9Muvls5ivyNENctx46xQLQ3aTuE7ssaQ==", - "dev": true, - "optional": true + "dev": true } } }, diff --git a/Phonebook.Frontend/package.json b/Phonebook.Frontend/package.json index 4d1817860..aa380b01a 100644 --- a/Phonebook.Frontend/package.json +++ b/Phonebook.Frontend/package.json @@ -115,4 +115,4 @@ "path": "Phonebook.Frontend/node_modules/cz-customizable" } } -} \ No newline at end of file +} From f3d4d9c105f036119e67016d5c1a5eba44d564a5 Mon Sep 17 00:00:00 2001 From: Daniel Habenicht Date: Mon, 2 Dec 2019 12:22:03 +0100 Subject: [PATCH 07/12] fix(nginx): remove 404 paths --- Phonebook.Frontend/nginx/nginx.conf | 12 ------------ 1 file changed, 12 deletions(-) diff --git a/Phonebook.Frontend/nginx/nginx.conf b/Phonebook.Frontend/nginx/nginx.conf index bbec8c1ba..43293ca72 100644 --- a/Phonebook.Frontend/nginx/nginx.conf +++ b/Phonebook.Frontend/nginx/nginx.conf @@ -73,18 +73,6 @@ http { alias /usr/share/nginx/html/opensearch.xml; } - location = /ngsw.json { - return 404; - } - - location = /de/ngsw.json { - return 404; - } - - location = /en/ngsw.json { - return 404; - } - location /de/ { alias /usr/share/nginx/html/de/; add_header Set-Cookie "lang=de;Domain=$host;Path=/;Max-Age=31536000"; From a9e53f70100dc8cc1a67fd52478ac40adbc2f603 Mon Sep 17 00:00:00 2001 From: Daniel Habenicht Date: Mon, 2 Dec 2019 13:07:42 +0100 Subject: [PATCH 08/12] fix(docker): add ngsw-config.json --- Phonebook.Frontend/Dockerfile | 1 + 1 file changed, 1 insertion(+) diff --git a/Phonebook.Frontend/Dockerfile b/Phonebook.Frontend/Dockerfile index 494ed65ac..8c3e3020b 100644 --- a/Phonebook.Frontend/Dockerfile +++ b/Phonebook.Frontend/Dockerfile @@ -11,6 +11,7 @@ COPY ./package.json /usr/local/app/package.json RUN npm ci # Because: https://stackoverflow.com/questions/37715224/copy-multiple-directories-with-one-command COPY ./src/ ./src/ +COPY ./ngsw-config.json /usr/local/app/ngsw-config.json COPY ["angular.json", "tsconfig.json", "tslint.json", "./"] RUN npm run build:de From b3a0ad2ae9b96de0e0a129504adb25a9de7a0593 Mon Sep 17 00:00:00 2001 From: Daniel Habenicht Date: Mon, 2 Dec 2019 13:46:17 +0100 Subject: [PATCH 09/12] fix(angular): service worker Service worker is not working correctly if schema is in it https://stackoverflow.com/questions/56520967/angular-service-worker-offline-caching-is-not-working-when-ive-deployed-in-serv --- Phonebook.Frontend/ngsw-config.json | 1 - 1 file changed, 1 deletion(-) diff --git a/Phonebook.Frontend/ngsw-config.json b/Phonebook.Frontend/ngsw-config.json index d98e09d5a..933d5811b 100644 --- a/Phonebook.Frontend/ngsw-config.json +++ b/Phonebook.Frontend/ngsw-config.json @@ -1,5 +1,4 @@ { - "$schema": "./node_modules/@angular/service-worker/config/schema.json", "index": "/index.html", "assetGroups": [ { From d4e2b180d6f6674759465ec68ce7d8dbfe161228 Mon Sep 17 00:00:00 2001 From: Daniel Habenicht Date: Tue, 3 Dec 2019 14:27:03 +0100 Subject: [PATCH 10/12] fix(service-worker): update hashes in ngsw.json This makes the service-worker work. Without it index.html would not be cached by the service worker --- Phonebook.Frontend/.dockerignore | 1 + Phonebook.Frontend/Dockerfile | 5 ++++- Phonebook.Frontend/index_rehash.sh | 34 ++++++++++++++++++++++++++++++ 3 files changed, 39 insertions(+), 1 deletion(-) create mode 100644 Phonebook.Frontend/index_rehash.sh diff --git a/Phonebook.Frontend/.dockerignore b/Phonebook.Frontend/.dockerignore index 33ee44a4e..54c04e4a5 100644 --- a/Phonebook.Frontend/.dockerignore +++ b/Phonebook.Frontend/.dockerignore @@ -11,6 +11,7 @@ !tslint.json !nginx !substitute_variables.sh +!index_rehash.sh !globals.js !version.js !opensearch.xml diff --git a/Phonebook.Frontend/Dockerfile b/Phonebook.Frontend/Dockerfile index 8c3e3020b..26a25bf12 100644 --- a/Phonebook.Frontend/Dockerfile +++ b/Phonebook.Frontend/Dockerfile @@ -39,9 +39,12 @@ COPY ./nginx/ ./ COPY ./substitute_variables.sh ./substitute_variables.sh RUN chmod +x ./substitute_variables.sh +COPY ./index_rehash.sh ./index_rehash.sh +RUN chmod +x ./index_rehash.sh + RUN rm /usr/share/nginx/html/index.html COPY --from=builder /usr/local/app/dist /usr/share/nginx/html COPY ./opensearch.xml /usr/share/nginx/html/opensearch.xml -ENTRYPOINT ["./substitute_variables.sh", "/usr/share/nginx/html", "./substitute_variables.sh", "/etc/nginx"] +ENTRYPOINT ["./substitute_variables.sh", "/usr/share/nginx/html", "./substitute_variables.sh", "/etc/nginx", "./index_rehash.sh", "/usr/share/nginx/html"] CMD ["nginx"] \ No newline at end of file diff --git a/Phonebook.Frontend/index_rehash.sh b/Phonebook.Frontend/index_rehash.sh new file mode 100644 index 000000000..118cd190c --- /dev/null +++ b/Phonebook.Frontend/index_rehash.sh @@ -0,0 +1,34 @@ +#!/bin/bash + +# This updates the hash of the index.html in the corresponding ngsw.json +# Execute it after replacing the environment variables + +# Paths to folders containing the index.html files (where the hash should be recalculated) +paths=( "de" "en") + +# The first parameter has to be the path to the directory with the language folders +if [[ -z $1 ]]; then + echo 'ERROR: No target file or directory given.' + exit 1 +fi + + + +# Go to all folders containing index.html and ngsw.json +for i in "${paths[@]}" +do + # Calculate hash of index.html + replaceString=($(sha1sum $1/$i/index.html)) + + if [ "$DEBUG" = true ] + then + # If DEBUG=true in order to log the replaced files + sed -i "s|\"\/de\/index\.html\":\s\"\(.*\)\"|\"/""$i""/index.html\": \"""$replaceString""\"|Ig;w /dev/stdout" "$1/$i/ngsw.json" + else + # If DEBUG=false do it without logging + sed -i "s|""\/de\/index\.html"":\s""\(.*\)""|""/$i/index.html"": $replaceString""|Ig" "$1/$i/ngsw.json" + fi +done + +# Execute all other parameters +exec "${@:2}" From 3b48b8bc77a14fe8958ebecd119e07bf23865669 Mon Sep 17 00:00:00 2001 From: Daniel Habenicht Date: Tue, 3 Dec 2019 15:02:48 +0100 Subject: [PATCH 11/12] fix(service-worker): fix replace string in non debug case --- Phonebook.Frontend/index_rehash.sh | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/Phonebook.Frontend/index_rehash.sh b/Phonebook.Frontend/index_rehash.sh index 118cd190c..01a00ca6b 100644 --- a/Phonebook.Frontend/index_rehash.sh +++ b/Phonebook.Frontend/index_rehash.sh @@ -26,7 +26,7 @@ do sed -i "s|\"\/de\/index\.html\":\s\"\(.*\)\"|\"/""$i""/index.html\": \"""$replaceString""\"|Ig;w /dev/stdout" "$1/$i/ngsw.json" else # If DEBUG=false do it without logging - sed -i "s|""\/de\/index\.html"":\s""\(.*\)""|""/$i/index.html"": $replaceString""|Ig" "$1/$i/ngsw.json" + sed -i "s|\"\/de\/index\.html\":\s\"\(.*\)\"|\"/""$i""/index.html\": \"""$replaceString""\"|Ig" "$1/$i/ngsw.json" fi done From 36fe4cb547b02deb0db7304a6acd8c1c13d3d511 Mon Sep 17 00:00:00 2001 From: Daniel Habenicht Date: Tue, 3 Dec 2019 15:35:51 +0100 Subject: [PATCH 12/12] fix(service-worker): make it path agnostic --- Phonebook.Frontend/index_rehash.sh | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/Phonebook.Frontend/index_rehash.sh b/Phonebook.Frontend/index_rehash.sh index 01a00ca6b..4fe589114 100644 --- a/Phonebook.Frontend/index_rehash.sh +++ b/Phonebook.Frontend/index_rehash.sh @@ -23,10 +23,10 @@ do if [ "$DEBUG" = true ] then # If DEBUG=true in order to log the replaced files - sed -i "s|\"\/de\/index\.html\":\s\"\(.*\)\"|\"/""$i""/index.html\": \"""$replaceString""\"|Ig;w /dev/stdout" "$1/$i/ngsw.json" + sed -i "s|\"\/$i\/index\.html\":\s\"\(.*\)\"|\"/""$i""/index.html\": \"""$replaceString""\"|Ig;w /dev/stdout" "$1/$i/ngsw.json" else # If DEBUG=false do it without logging - sed -i "s|\"\/de\/index\.html\":\s\"\(.*\)\"|\"/""$i""/index.html\": \"""$replaceString""\"|Ig" "$1/$i/ngsw.json" + sed -i "s|\"\/$i\/index\.html\":\s\"\(.*\)\"|\"/""$i""/index.html\": \"""$replaceString""\"|Ig" "$1/$i/ngsw.json" fi done