From 4f8cb202eb18ff6656b7c832b60a289cf162807f Mon Sep 17 00:00:00 2001 From: Lionel MUKUNA CIOWELA Date: Tue, 5 Feb 2019 16:58:15 +0100 Subject: [PATCH 01/26] adding cookie consent package --- package-lock.json | 10 ++++++++++ package.json | 2 ++ 2 files changed, 12 insertions(+) diff --git a/package-lock.json b/package-lock.json index ef3db5a0..89203870 100644 --- a/package-lock.json +++ b/package-lock.json @@ -3872,6 +3872,11 @@ "integrity": "sha1-4wOogrNCzD7oylE6eZmXNNqzriw=", "dev": true }, + "cookieconsent": { + "version": "3.1.0", + "resolved": "https://registry.npmjs.org/cookieconsent/-/cookieconsent-3.1.0.tgz", + "integrity": "sha512-FhkOAzZdIVqg7UfPjymgJBA7ZeEjrMgO8RWh+1Z130K7TlJDNnIORMulvqmt66SPyfrUnFB3SYJ55/7EvEcSEA==" + }, "copy-concurrently": { "version": "1.0.5", "resolved": "https://registry.npmjs.org/copy-concurrently/-/copy-concurrently-1.0.5.tgz", @@ -9980,6 +9985,11 @@ "integrity": "sha1-yobR/ogoFpsBICCOPchCS524NCw=", "dev": true }, + "ngx-cookieconsent": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/ngx-cookieconsent/-/ngx-cookieconsent-2.0.0.tgz", + "integrity": "sha512-Eus6yf2BvPD4Os+mNDif2bFid8U/rqh5pureF9I8tGUVcB8nPKast0OLHF7ySUZyOFBGdrKQ49ZrZ/x6pesAKQ==" + }, "nice-try": { "version": "1.0.5", "resolved": "https://registry.npmjs.org/nice-try/-/nice-try-1.0.5.tgz", diff --git a/package.json b/package.json index 58172350..194c2e1a 100644 --- a/package.json +++ b/package.json @@ -40,6 +40,8 @@ "autoprefixer": "^9.4.7", "boosted": "4.2.2", "classlist.js": "^1.1.20150312", + "cookieconsent": "^3.1.0", + "ngx-cookieconsent": "^2.0.0", "swiper": "^4.4.1" }, "devDependencies": { From b544caa1a3a8dd33e4daf8da5820d9745199d468 Mon Sep 17 00:00:00 2001 From: Lionel MUKUNA CIOWELA Date: Tue, 5 Feb 2019 18:00:06 +0100 Subject: [PATCH 02/26] update packages #18 --- package-lock.json | 6 ++++-- package.json | 4 ++-- 2 files changed, 6 insertions(+), 4 deletions(-) diff --git a/package-lock.json b/package-lock.json index 89203870..0c58a249 100644 --- a/package-lock.json +++ b/package-lock.json @@ -3875,7 +3875,8 @@ "cookieconsent": { "version": "3.1.0", "resolved": "https://registry.npmjs.org/cookieconsent/-/cookieconsent-3.1.0.tgz", - "integrity": "sha512-FhkOAzZdIVqg7UfPjymgJBA7ZeEjrMgO8RWh+1Z130K7TlJDNnIORMulvqmt66SPyfrUnFB3SYJ55/7EvEcSEA==" + "integrity": "sha512-FhkOAzZdIVqg7UfPjymgJBA7ZeEjrMgO8RWh+1Z130K7TlJDNnIORMulvqmt66SPyfrUnFB3SYJ55/7EvEcSEA==", + "dev": true }, "copy-concurrently": { "version": "1.0.5", @@ -9988,7 +9989,8 @@ "ngx-cookieconsent": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/ngx-cookieconsent/-/ngx-cookieconsent-2.0.0.tgz", - "integrity": "sha512-Eus6yf2BvPD4Os+mNDif2bFid8U/rqh5pureF9I8tGUVcB8nPKast0OLHF7ySUZyOFBGdrKQ49ZrZ/x6pesAKQ==" + "integrity": "sha512-Eus6yf2BvPD4Os+mNDif2bFid8U/rqh5pureF9I8tGUVcB8nPKast0OLHF7ySUZyOFBGdrKQ49ZrZ/x6pesAKQ==", + "dev": true }, "nice-try": { "version": "1.0.5", diff --git a/package.json b/package.json index 194c2e1a..81d288c3 100644 --- a/package.json +++ b/package.json @@ -40,8 +40,6 @@ "autoprefixer": "^9.4.7", "boosted": "4.2.2", "classlist.js": "^1.1.20150312", - "cookieconsent": "^3.1.0", - "ngx-cookieconsent": "^2.0.0", "swiper": "^4.4.1" }, "devDependencies": { @@ -71,6 +69,7 @@ "babel-loader": "8.0.5", "codelyzer": "^4.5.0", "copy-webpack-plugin": "^4.6.0", + "cookieconsent": "^3.1.0", "core-js": "2.6.3", "cpx": "^1.5.0", "css-loader": "^2.1.0", @@ -97,6 +96,7 @@ "karma-sourcemap-loader": "^0.3.7", "karma-webpack": "^3.0.5", "markdown-loader": "^5.0.0", + "ngx-cookieconsent": "^2.0.0", "parse5": "^5.1.0", "path": "0.12.7", "postcss-loader": "^3.0.0", From 7779e5bffb426935b61a3e5be63b354bfd93542f Mon Sep 17 00:00:00 2001 From: Lionel MUKUNA CIOWELA Date: Thu, 7 Feb 2019 10:39:09 +0100 Subject: [PATCH 03/26] adding shx --- package-lock.json | 17 +++++++++++++++++ package.json | 2 ++ 2 files changed, 19 insertions(+) diff --git a/package-lock.json b/package-lock.json index 0c58a249..8ff0741f 100644 --- a/package-lock.json +++ b/package-lock.json @@ -4915,6 +4915,12 @@ "es6-symbol": "^3.1.1" } }, + "es6-object-assign": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/es6-object-assign/-/es6-object-assign-1.1.0.tgz", + "integrity": "sha1-wsNYJlYkfDnqEHyx5mUrb58kUjw=", + "dev": true + }, "es6-promise": { "version": "4.2.5", "resolved": "https://registry.npmjs.org/es6-promise/-/es6-promise-4.2.5.tgz", @@ -12568,6 +12574,17 @@ "rechoir": "^0.6.2" } }, + "shx": { + "version": "0.3.2", + "resolved": "https://registry.npmjs.org/shx/-/shx-0.3.2.tgz", + "integrity": "sha512-aS0mWtW3T2sHAenrSrip2XGv39O9dXIFUqxAEWHEOS1ePtGIBavdPJY1kE2IHl14V/4iCbUiNDPGdyYTtmhSoA==", + "dev": true, + "requires": { + "es6-object-assign": "^1.0.3", + "minimist": "^1.2.0", + "shelljs": "^0.8.1" + } + }, "signal-exit": { "version": "3.0.2", "resolved": "https://registry.npmjs.org/signal-exit/-/signal-exit-3.0.2.tgz", diff --git a/package.json b/package.json index 81d288c3..2eb9c321 100644 --- a/package.json +++ b/package.json @@ -13,6 +13,7 @@ "license": "MIT", "main": "dist/index.js", "scripts": { + "cookie-vendor": "shx mkdir -p docs/cookie/vendor/js && shx mkdir -p docs/cookie/vendor/css && shx cp node_modules/cookieconsent/build/cookieconsent.min.js docs/cookie/vendor/js && shx cp node_modules/cookieconsent/build/cookieconsent.min.css docs/cookie/vendor/css", "build:dist": "npm run clean:dist && npm run lint:dist && ngc -p tsconfig-dist.json && npm run copy:dist && npm run rimraf .tmp", "build:docs": "rimraf _gh_pages && npm run lint:docs && webpack --progress --profile --bail", "build": "npm run build:dist", @@ -109,6 +110,7 @@ "rimraf": "^2.6.3", "rxjs": "^6.4.0", "rxjs-compat": "^6.4.0", + "shx": "^0.3.2", "script-ext-html-webpack-plugin": "^2.1.3", "source-map-loader": "^0.2.4", "string-replace-loader": "^2.1.1", From 87a356cb831531598dbd14b25aa478d47e600236 Mon Sep 17 00:00:00 2001 From: Lionel MUKUNA CIOWELA Date: Thu, 7 Feb 2019 10:41:54 +0100 Subject: [PATCH 04/26] adding cookie consent config Close #18 zero cookies generated so far --- docs/app/app.component.ts | 38 +++++++++++++++++++++++++++++++++++--- docs/app/app.module.ts | 30 ++++++++++++++++++++++++++++++ docs/vendor.ts | 4 ++++ 3 files changed, 69 insertions(+), 3 deletions(-) diff --git a/docs/app/app.component.ts b/docs/app/app.component.ts index 1f2f7674..76728405 100644 --- a/docs/app/app.component.ts +++ b/docs/app/app.component.ts @@ -1,5 +1,7 @@ -import { Component } from '@angular/core'; +import { Component, OnInit, OnDestroy } from '@angular/core'; import { Globals } from './global'; +import { NgcCookieConsentService } from 'ngx-cookieconsent'; +import { Subscription } from 'rxjs/Subscription'; @Component({ selector: 'app', @@ -7,6 +9,36 @@ import { Globals } from './global'; providers: [Globals] }) -export class AppComponent { - constructor(public globals: Globals) {} +export class AppComponent implements OnInit, OnDestroy { + // keep refs to subscriptions to be able to unsubscribe later + private popupOpenSubscription: Subscription; + private popupCloseSubscription: Subscription; + private initializeSubscription: Subscription; + private statusChangeSubscription: Subscription; + private revokeChoiceSubscription: Subscription; + private noCookieLawSubscription: Subscription; + constructor(public globals: Globals, private ccService: NgcCookieConsentService) {} + + public ngOnInit() { + // subscribe to cookieconsent observables to react to main events + this.popupOpenSubscription = this.ccService.popupOpen$.subscribe( + () => { + // this.ccService.getConfig().content = this.ccService.getConfig().content || {} ; + }); + + this.popupCloseSubscription = this.ccService.popupClose$.subscribe( + () => { + // you can use this.ccService.getConfig() to do stuff... + }); + } + + public ngOnDestroy() { + // unsubscribe to cookieconsent observables to prevent memory leaks + this.popupOpenSubscription.unsubscribe(); + this.popupCloseSubscription.unsubscribe(); + this.initializeSubscription.unsubscribe(); + this.statusChangeSubscription.unsubscribe(); + this.revokeChoiceSubscription.unsubscribe(); + this.noCookieLawSubscription.unsubscribe(); + } } diff --git a/docs/app/app.module.ts b/docs/app/app.module.ts index 209d69af..f26031c3 100644 --- a/docs/app/app.module.ts +++ b/docs/app/app.module.ts @@ -4,6 +4,8 @@ import { RouterModule } from '@angular/router'; import { FormsModule } from '@angular/forms'; import { HashLocationStrategy, LocationStrategy } from '@angular/common'; +import {NgcCookieConsentModule, NgcCookieConsentConfig} from 'ngx-cookieconsent'; + import { NgbModule } from '@ng-bootstrap/ng-bootstrap'; import { NgBoostedModule } from '../../dist'; @@ -49,10 +51,38 @@ import { CodeBox } from './docs/code-box.component'; import { Globals } from './global'; +const cookieConfig: NgcCookieConsentConfig = { + cookie: { + domain: 'localhost:3030' // or 'your.domain.com' // it is mandatory to set a domain, for cookies to work properly (see https://goo.gl/S2Hy2A) + }, + palette: { + popup: { + background: '#000', + text: '#ffffff', + link: '#ffffff' + }, + button: { + background: '#f16e00', + text: '#ffffff', + border: 'transparent' + } + }, + theme: 'edgeless', + type: 'opt-out', + content: { + message: 'This website uses cookies to ensure you get the best experience on our website.', + dismiss: 'Got it!', + deny: 'Refuse cookies', + link: 'Learn more', + href: 'https://cookiesandyou.com' + } +}; + @NgModule({ imports: [ BrowserModule, FormsModule, + NgcCookieConsentModule.forRoot(cookieConfig), RouterModule.forRoot([ { path: 'home', diff --git a/docs/vendor.ts b/docs/vendor.ts index e6587421..73d97107 100644 --- a/docs/vendor.ts +++ b/docs/vendor.ts @@ -33,6 +33,10 @@ import 'boosted/dist/css/orangeHelvetica.css'; import 'boosted/dist/css/orangeIcons.css'; import 'boosted/dist/css/boosted.css'; +// Cookie Consent +import 'cookieconsent/build/cookieconsent.min.js'; +import 'cookieconsent/build/cookieconsent.min.css'; + if ('production' === process.env.ENV) { // Production From aac39b040de0315adcb1a5539d76c74d669fabad Mon Sep 17 00:00:00 2001 From: Lionel Mukuna Ciowela Date: Fri, 12 Apr 2019 17:10:30 +0200 Subject: [PATCH 05/26] fix(cookie-consent): changing text and the button text inside Cookie Panel --- docs/app/app.module.ts | 16 +++++++++------- 1 file changed, 9 insertions(+), 7 deletions(-) diff --git a/docs/app/app.module.ts b/docs/app/app.module.ts index f26031c3..b61fe444 100644 --- a/docs/app/app.module.ts +++ b/docs/app/app.module.ts @@ -4,7 +4,8 @@ import { RouterModule } from '@angular/router'; import { FormsModule } from '@angular/forms'; import { HashLocationStrategy, LocationStrategy } from '@angular/common'; -import {NgcCookieConsentModule, NgcCookieConsentConfig} from 'ngx-cookieconsent'; + +import { NgcCookieConsentModule, NgcCookieConsentConfig } from 'ngx-cookieconsent'; import { NgbModule } from '@ng-bootstrap/ng-bootstrap'; import { NgBoostedModule } from '../../dist'; @@ -55,6 +56,8 @@ const cookieConfig: NgcCookieConsentConfig = { cookie: { domain: 'localhost:3030' // or 'your.domain.com' // it is mandatory to set a domain, for cookies to work properly (see https://goo.gl/S2Hy2A) }, + position: 'bottom', + theme: 'edgeless', palette: { popup: { background: '#000', @@ -67,14 +70,13 @@ const cookieConfig: NgcCookieConsentConfig = { border: 'transparent' } }, - theme: 'edgeless', type: 'opt-out', content: { - message: 'This website uses cookies to ensure you get the best experience on our website.', - dismiss: 'Got it!', - deny: 'Refuse cookies', - link: 'Learn more', - href: 'https://cookiesandyou.com' + message: 'En poursuivant votre navigation, vous acceptez l\'utilisation de services tiers pouvant installer des cookies.', + dismiss: 'OK,tout accepter.', + deny: 'Personnaliser', + href: 'https://cookiesandyou.com', + allow: 'Autoriser les cookies' } }; From 7c624cb9eea8184bea3e55988196e7f43ff1632e Mon Sep 17 00:00:00 2001 From: Lionel Mukuna Ciowela Date: Fri, 12 Apr 2019 17:11:17 +0200 Subject: [PATCH 06/26] package json --- package-lock.json | 45 +++++++++++++++++++++++++++++++++------------ 1 file changed, 33 insertions(+), 12 deletions(-) diff --git a/package-lock.json b/package-lock.json index 8ff0741f..a072974f 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1824,6 +1824,7 @@ "resolved": "https://registry.npmjs.org/align-text/-/align-text-0.1.4.tgz", "integrity": "sha1-DNkKVhCT810KmSVsIrcGlDP60Rc=", "dev": true, + "optional": true, "requires": { "kind-of": "^3.0.2", "longest": "^1.0.1", @@ -6167,7 +6168,8 @@ "ansi-regex": { "version": "2.1.1", "bundled": true, - "dev": true + "dev": true, + "optional": true }, "aproba": { "version": "1.2.0", @@ -6188,12 +6190,14 @@ "balanced-match": { "version": "1.0.0", "bundled": true, - "dev": true + "dev": true, + "optional": true }, "brace-expansion": { "version": "1.1.11", "bundled": true, "dev": true, + "optional": true, "requires": { "balanced-match": "^1.0.0", "concat-map": "0.0.1" @@ -6208,17 +6212,20 @@ "code-point-at": { "version": "1.1.0", "bundled": true, - "dev": true + "dev": true, + "optional": true }, "concat-map": { "version": "0.0.1", "bundled": true, - "dev": true + "dev": true, + "optional": true }, "console-control-strings": { "version": "1.1.0", "bundled": true, - "dev": true + "dev": true, + "optional": true }, "core-util-is": { "version": "1.0.2", @@ -6335,7 +6342,8 @@ "inherits": { "version": "2.0.3", "bundled": true, - "dev": true + "dev": true, + "optional": true }, "ini": { "version": "1.3.5", @@ -6347,6 +6355,7 @@ "version": "1.0.0", "bundled": true, "dev": true, + "optional": true, "requires": { "number-is-nan": "^1.0.0" } @@ -6361,6 +6370,7 @@ "version": "3.0.4", "bundled": true, "dev": true, + "optional": true, "requires": { "brace-expansion": "^1.1.7" } @@ -6368,12 +6378,14 @@ "minimist": { "version": "0.0.8", "bundled": true, - "dev": true + "dev": true, + "optional": true }, "minipass": { "version": "2.2.4", "bundled": true, "dev": true, + "optional": true, "requires": { "safe-buffer": "^5.1.1", "yallist": "^3.0.0" @@ -6392,6 +6404,7 @@ "version": "0.5.1", "bundled": true, "dev": true, + "optional": true, "requires": { "minimist": "0.0.8" } @@ -6472,7 +6485,8 @@ "number-is-nan": { "version": "1.0.1", "bundled": true, - "dev": true + "dev": true, + "optional": true }, "object-assign": { "version": "4.1.1", @@ -6484,6 +6498,7 @@ "version": "1.4.0", "bundled": true, "dev": true, + "optional": true, "requires": { "wrappy": "1" } @@ -6569,7 +6584,8 @@ "safe-buffer": { "version": "5.1.1", "bundled": true, - "dev": true + "dev": true, + "optional": true }, "safer-buffer": { "version": "2.1.2", @@ -6605,6 +6621,7 @@ "version": "1.0.2", "bundled": true, "dev": true, + "optional": true, "requires": { "code-point-at": "^1.0.0", "is-fullwidth-code-point": "^1.0.0", @@ -6624,6 +6641,7 @@ "version": "3.0.1", "bundled": true, "dev": true, + "optional": true, "requires": { "ansi-regex": "^2.0.0" } @@ -6667,12 +6685,14 @@ "wrappy": { "version": "1.0.2", "bundled": true, - "dev": true + "dev": true, + "optional": true }, "yallist": { "version": "3.0.2", "bundled": true, - "dev": true + "dev": true, + "optional": true } } }, @@ -9519,7 +9539,8 @@ "version": "1.0.1", "resolved": "https://registry.npmjs.org/longest/-/longest-1.0.1.tgz", "integrity": "sha1-MKCy2jj3N3DoKUoNIuZiXtd9AJc=", - "dev": true + "dev": true, + "optional": true }, "loose-envify": { "version": "1.4.0", From cace6816b92926badb139387065368b814f1e3af Mon Sep 17 00:00:00 2001 From: Lionel Mukuna Ciowela Date: Mon, 15 Apr 2019 18:27:02 +0200 Subject: [PATCH 07/26] fix(cookie-consent): adding translation english and french json files #18 --- docs/assets/lang/en.json | 8 ++++++++ docs/assets/lang/fr.json | 8 ++++++++ 2 files changed, 16 insertions(+) create mode 100644 docs/assets/lang/en.json create mode 100644 docs/assets/lang/fr.json diff --git a/docs/assets/lang/en.json b/docs/assets/lang/en.json new file mode 100644 index 00000000..7e261b5b --- /dev/null +++ b/docs/assets/lang/en.json @@ -0,0 +1,8 @@ +{ + "cookie": { + "header": "Cookies used on Ng-Boosted!", + "message": "This website uses cookies to ensure you get the best experience on our website.", + "allow": "Allow cookies", + "deny": "Personalize" + } +} \ No newline at end of file diff --git a/docs/assets/lang/fr.json b/docs/assets/lang/fr.json new file mode 100644 index 00000000..09bfd233 --- /dev/null +++ b/docs/assets/lang/fr.json @@ -0,0 +1,8 @@ +{ + "cookie": { + "header": "Ng-Boosted utilises des Cookies", + "message": "En poursuivant votre navigation, vous acceptez l'utilisation de services tiers pouvant installer des cookies.", + "allow": "OK, tout accepter.", + "deny": "Personnaliser" + } +} \ No newline at end of file From bb01c7e60ea7e83cbf62eaa42568c238700379a1 Mon Sep 17 00:00:00 2001 From: Lionel Mukuna Ciowela Date: Mon, 15 Apr 2019 18:29:24 +0200 Subject: [PATCH 08/26] fix(cookie-consent): configure ngx-translate and ng cookie consent #18 --- docs/app/app.component.ts | 23 +++++++++++++++++++++-- docs/app/app.module.ts | 21 ++++++++++++++++++--- package-lock.json | 16 ++++++++++++++++ package.json | 2 ++ 4 files changed, 57 insertions(+), 5 deletions(-) diff --git a/docs/app/app.component.ts b/docs/app/app.component.ts index 76728405..04296e03 100644 --- a/docs/app/app.component.ts +++ b/docs/app/app.component.ts @@ -1,6 +1,7 @@ import { Component, OnInit, OnDestroy } from '@angular/core'; import { Globals } from './global'; import { NgcCookieConsentService } from 'ngx-cookieconsent'; +import { TranslateService } from '@ngx-translate/core'; import { Subscription } from 'rxjs/Subscription'; @Component({ @@ -17,9 +18,27 @@ export class AppComponent implements OnInit, OnDestroy { private statusChangeSubscription: Subscription; private revokeChoiceSubscription: Subscription; private noCookieLawSubscription: Subscription; - constructor(public globals: Globals, private ccService: NgcCookieConsentService) {} + constructor(public globals: Globals, private ccService: NgcCookieConsentService, private translateService: TranslateService) {} public ngOnInit() { + + // Support for translated cookies messages + this.translateService.addLangs(['en', 'fr']); + this.translateService.setDefaultLang('en'); + + const browserLang = this.translateService.getBrowserLang(); + this.translateService.use(browserLang.match(/en|fr/) ? browserLang : 'en'); + + this.translateService.get(['cookie.header', 'cookie.message', 'cookie.allow', 'cookie.deny']).subscribe( (data) => { + this.ccService.getConfig().content = this.ccService.getConfig().content || {} ; + // Override default messages with the translated ones + this.ccService.getConfig().content.header = data['cookie.header']; + this.ccService.getConfig().content.message = data['cookie.message']; + this.ccService.getConfig().content.allow = data['cookie.allow']; + this.ccService.getConfig().content.deny = data['cookie.deny']; + }); + + /* // subscribe to cookieconsent observables to react to main events this.popupOpenSubscription = this.ccService.popupOpen$.subscribe( () => { @@ -29,7 +48,7 @@ export class AppComponent implements OnInit, OnDestroy { this.popupCloseSubscription = this.ccService.popupClose$.subscribe( () => { // you can use this.ccService.getConfig() to do stuff... - }); + });*/ } public ngOnDestroy() { diff --git a/docs/app/app.module.ts b/docs/app/app.module.ts index b61fe444..16e9e7ec 100644 --- a/docs/app/app.module.ts +++ b/docs/app/app.module.ts @@ -4,9 +4,12 @@ import { RouterModule } from '@angular/router'; import { FormsModule } from '@angular/forms'; import { HashLocationStrategy, LocationStrategy } from '@angular/common'; - import { NgcCookieConsentModule, NgcCookieConsentConfig } from 'ngx-cookieconsent'; +import { HttpClientModule, HttpClient } from '@angular/common/http'; +import { TranslateModule, TranslateLoader } from '@ngx-translate/core'; +import { TranslateHttpLoader } from '@ngx-translate/http-loader'; + import { NgbModule } from '@ng-bootstrap/ng-bootstrap'; import { NgBoostedModule } from '../../dist'; @@ -52,6 +55,11 @@ import { CodeBox } from './docs/code-box.component'; import { Globals } from './global'; +// AoT requires an exported function for factories +export function HttpLoaderFactory(http: HttpClient) { + return new TranslateHttpLoader(http, './assets/i18n/', '.json'); +} + const cookieConfig: NgcCookieConsentConfig = { cookie: { domain: 'localhost:3030' // or 'your.domain.com' // it is mandatory to set a domain, for cookies to work properly (see https://goo.gl/S2Hy2A) @@ -73,10 +81,9 @@ const cookieConfig: NgcCookieConsentConfig = { type: 'opt-out', content: { message: 'En poursuivant votre navigation, vous acceptez l\'utilisation de services tiers pouvant installer des cookies.', - dismiss: 'OK,tout accepter.', deny: 'Personnaliser', href: 'https://cookiesandyou.com', - allow: 'Autoriser les cookies' + allow: 'OK,tout accepter.' } }; @@ -84,7 +91,15 @@ const cookieConfig: NgcCookieConsentConfig = { imports: [ BrowserModule, FormsModule, + HttpClientModule, NgcCookieConsentModule.forRoot(cookieConfig), + TranslateModule.forRoot({ + loader: { + provide: TranslateLoader, + useFactory: HttpLoaderFactory, + deps: [HttpClient] + } + }), RouterModule.forRoot([ { path: 'home', diff --git a/package-lock.json b/package-lock.json index a072974f..a6173a0e 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1491,6 +1491,22 @@ "tslib": "^1.9.0" } }, + "@ngx-translate/core": { + "version": "11.0.1", + "resolved": "https://registry.npmjs.org/@ngx-translate/core/-/core-11.0.1.tgz", + "integrity": "sha512-nBCa1ZD9fAUY/3eskP3Lql2fNg8OMrYIej1/5GRsfcutx9tG/5fZLCv9m6UCw1aS+u4uK/vXjv1ctG/FdMvaWg==", + "requires": { + "tslib": "^1.9.0" + } + }, + "@ngx-translate/http-loader": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/@ngx-translate/http-loader/-/http-loader-4.0.0.tgz", + "integrity": "sha512-x8LumqydWD7eX9yQTAVeoCM9gFUIGVTUjZqbxdAUavAA3qVnk9wCQux7iHLPXpydl8vyQmLoPQR+fFU+DUDOMA==", + "requires": { + "tslib": "^1.9.0" + } + }, "@types/anymatch": { "version": "1.3.0", "resolved": "https://registry.npmjs.org/@types/anymatch/-/anymatch-1.3.0.tgz", diff --git a/package.json b/package.json index 2eb9c321..f4cd21ea 100644 --- a/package.json +++ b/package.json @@ -56,6 +56,8 @@ "@angularclass/conventions-loader": "^1.0.13", "@angularclass/hmr": "^2.1.3", "@angularclass/hmr-loader": "^3.0.4", + "@ngx-translate/core": "^11.0.1", + "@ngx-translate/http-loader": "^4.0.0", "@babel/core": "^7.2.2", "@babel/preset-env": "^7.3.1", "@types/jasmine": "^3.3.8", From 72bd5fa04158db506105351927065faeb6747a30 Mon Sep 17 00:00:00 2001 From: Lionel Mukuna Ciowela Date: Mon, 15 Apr 2019 18:30:16 +0200 Subject: [PATCH 09/26] fix(cookie-consent): configure webpack to extract json languages files into assets/i18n #18 --- webpack.config.js | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/webpack.config.js b/webpack.config.js index 5478719c..456e156c 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -248,6 +248,11 @@ module.exports = function makeWebpackConfig() { new CopyWebpackPlugin([{ from: root('docs/assets/img'), to: 'assets/img' + }]), + + new CopyWebpackPlugin([{ + from: root('docs/assets/lang'), + to: 'assets/i18n' }]) ] } From b0a5b2576bbfcc7d82375f28a7bf4804c4d0d5df Mon Sep 17 00:00:00 2001 From: Lionel Mukuna Ciowela Date: Fri, 19 Apr 2019 14:08:54 +0200 Subject: [PATCH 10/26] fix(cookie-consent): creating function to update, create and delete a cookie #18 --- docs/app/util/cookie-utils.ts | 35 +++++++++++++++++++++++++++++++++++ 1 file changed, 35 insertions(+) create mode 100644 docs/app/util/cookie-utils.ts diff --git a/docs/app/util/cookie-utils.ts b/docs/app/util/cookie-utils.ts new file mode 100644 index 00000000..f59fa200 --- /dev/null +++ b/docs/app/util/cookie-utils.ts @@ -0,0 +1,35 @@ +/* + * General utils for managing cookies in Typescript. + */ +export class CookieManagerService { + +public setCookie(name: string, val: string) { + const date = new Date(); + const value = val; + + // Set it expire in 395 days, compliance with Cookie Laws + date.setTime(date.getTime() + (395 * 24 * 60 * 60 * 1000)); + + // Set it + document.cookie = name + ' = ' + value + '; expires=' + date.toUTCString() + '; path=/'; +} + +public getCookie(name: string) { + const value = '; ' + document.cookie; + const parts = value.split('; ' + name + '='); + if (parts.length === 2) { + return parts.pop().split(';').shift(); + } +} + +public deleteCookie(name: string) { + const date = new Date(); + + // Set it expire in -1 days + date.setTime(date.getTime() + (-1 * 24 * 60 * 60 * 1000)); + + // Set it + document.cookie = name + '=; expires=' + date.toUTCString() + '; path=/'; +} + +} From 5dc688444c8a6fc9e88fb34d89b16623b8a320aa Mon Sep 17 00:00:00 2001 From: Lionel Mukuna Ciowela Date: Fri, 19 Apr 2019 14:11:39 +0200 Subject: [PATCH 11/26] fix(cookie-consent): call the service in module #18 --- docs/app/app.component.ts | 60 +++++++++++++++++++++++++++-------- docs/app/app.module.ts | 11 ++++--- docs/app/util/cookie-utils.ts | 9 +----- 3 files changed, 53 insertions(+), 27 deletions(-) diff --git a/docs/app/app.component.ts b/docs/app/app.component.ts index 04296e03..ec0a80e1 100644 --- a/docs/app/app.component.ts +++ b/docs/app/app.component.ts @@ -3,14 +3,18 @@ import { Globals } from './global'; import { NgcCookieConsentService } from 'ngx-cookieconsent'; import { TranslateService } from '@ngx-translate/core'; import { Subscription } from 'rxjs/Subscription'; +import { CookieManagerService } from './util/cookie-utils'; +import { NgcInitializeEvent, NgcStatusChangeEvent } from 'ngx-cookieconsent'; @Component({ selector: 'app', template: require('./app.component.html'), - providers: [Globals] + providers: [Globals, CookieManagerService] }) export class AppComponent implements OnInit, OnDestroy { + private GA_COOKIE_NAMES = ['_ga', '_gat']; + private GA_ID = 'test'; // keep refs to subscriptions to be able to unsubscribe later private popupOpenSubscription: Subscription; private popupCloseSubscription: Subscription; @@ -18,14 +22,18 @@ export class AppComponent implements OnInit, OnDestroy { private statusChangeSubscription: Subscription; private revokeChoiceSubscription: Subscription; private noCookieLawSubscription: Subscription; - constructor(public globals: Globals, private ccService: NgcCookieConsentService, private translateService: TranslateService) {} + constructor(public globals: Globals, private cookiemanager: CookieManagerService, + private ccService: NgcCookieConsentService, private translateService: TranslateService) {} public ngOnInit() { + const GA_COOKIE_NAMES = ['_ga', '_gat']; // Support for translated cookies messages this.translateService.addLangs(['en', 'fr']); this.translateService.setDefaultLang('en'); + this.ccService.getConfig().autoOpen = true; + const browserLang = this.translateService.getBrowserLang(); this.translateService.use(browserLang.match(/en|fr/) ? browserLang : 'en'); @@ -36,19 +44,31 @@ export class AppComponent implements OnInit, OnDestroy { this.ccService.getConfig().content.message = data['cookie.message']; this.ccService.getConfig().content.allow = data['cookie.allow']; this.ccService.getConfig().content.deny = data['cookie.deny']; - }); - /* - // subscribe to cookieconsent observables to react to main events - this.popupOpenSubscription = this.ccService.popupOpen$.subscribe( - () => { - // this.ccService.getConfig().content = this.ccService.getConfig().content || {} ; - }); - - this.popupCloseSubscription = this.ccService.popupClose$.subscribe( - () => { - // you can use this.ccService.getConfig() to do stuff... - });*/ + this.ccService.destroy(); + this.ccService.init(this.ccService.getConfig()); + }); + this.statusChangeSubscription = this.ccService.statusChange$.subscribe( + (event: NgcStatusChangeEvent) => { + const TrackNavigator = navigator.doNotTrack; + // Check donotTrack and Cookie Consent and do nothing if those values are positive + if ( TrackNavigator === '1' || TrackNavigator === 'yes' || !TrackNavigator) { + this.rejectCookie(this.GA_ID); + return; + } + if ( !this.ccService.hasConsented().valueOf() && (TrackNavigator === '1' || TrackNavigator === 'yes' || !TrackNavigator)) { + this.rejectCookie(this.GA_ID); + return; + } + if (this.ccService.hasConsented().valueOf() && (TrackNavigator === '0' || TrackNavigator === 'no' || TrackNavigator === 'unspecified')) { + // start analytics + return; + } + if (this.ccService.hasConsented().valueOf()) { + this.rejectCookie(this.GA_ID); + return; + } + }); } public ngOnDestroy() { @@ -60,4 +80,16 @@ export class AppComponent implements OnInit, OnDestroy { this.revokeChoiceSubscription.unsubscribe(); this.noCookieLawSubscription.unsubscribe(); } + + private rejectCookie(gaId: string) { + // disable GA + this.cookiemanager.setCookie(`ga-disable-${gaId}`, 'true'); + window[`ga-disable-${gaId}`] = true; + this.cookiemanager.setCookie('cookieconsent_status', 'deny'); + this.GA_COOKIE_NAMES.forEach((cookieName) => { + this.cookiemanager.deleteCookie(cookieName); + }); + console.log('has no consented'); + } + } diff --git a/docs/app/app.module.ts b/docs/app/app.module.ts index 16e9e7ec..ff8d0928 100644 --- a/docs/app/app.module.ts +++ b/docs/app/app.module.ts @@ -54,6 +54,7 @@ import { DocOToggle } from './docs/o-toggle.component'; import { CodeBox } from './docs/code-box.component'; import { Globals } from './global'; +import { CookieManagerService } from './util/cookie-utils'; // AoT requires an exported function for factories export function HttpLoaderFactory(http: HttpClient) { @@ -62,10 +63,10 @@ export function HttpLoaderFactory(http: HttpClient) { const cookieConfig: NgcCookieConsentConfig = { cookie: { - domain: 'localhost:3030' // or 'your.domain.com' // it is mandatory to set a domain, for cookies to work properly (see https://goo.gl/S2Hy2A) + domain: 'localhost' // or 'your.domain.com' // it is mandatory to set a domain, for cookies to work properly (see https://goo.gl/S2Hy2A) }, position: 'bottom', - theme: 'edgeless', + theme: 'classic', palette: { popup: { background: '#000', @@ -81,9 +82,9 @@ const cookieConfig: NgcCookieConsentConfig = { type: 'opt-out', content: { message: 'En poursuivant votre navigation, vous acceptez l\'utilisation de services tiers pouvant installer des cookies.', - deny: 'Personnaliser', + deny: 'Refuser les cookies', href: 'https://cookiesandyou.com', - allow: 'OK,tout accepter.' + allow: 'Accepter les cookies' } }; @@ -230,7 +231,7 @@ const cookieConfig: NgcCookieConsentConfig = { DocOToggle, CodeBox ], - providers: [{provide: LocationStrategy, useClass: HashLocationStrategy}, Globals], + providers: [{provide: LocationStrategy, useClass: HashLocationStrategy}, Globals, CookieManagerService], bootstrap: [ AppComponent ] }) export class AppModule { } diff --git a/docs/app/util/cookie-utils.ts b/docs/app/util/cookie-utils.ts index f59fa200..3e91b0d8 100644 --- a/docs/app/util/cookie-utils.ts +++ b/docs/app/util/cookie-utils.ts @@ -6,11 +6,8 @@ export class CookieManagerService { public setCookie(name: string, val: string) { const date = new Date(); const value = val; - - // Set it expire in 395 days, compliance with Cookie Laws + // Set it expire in 395 days, compliance with Cookie Laws in EU date.setTime(date.getTime() + (395 * 24 * 60 * 60 * 1000)); - - // Set it document.cookie = name + ' = ' + value + '; expires=' + date.toUTCString() + '; path=/'; } @@ -24,11 +21,7 @@ public getCookie(name: string) { public deleteCookie(name: string) { const date = new Date(); - - // Set it expire in -1 days date.setTime(date.getTime() + (-1 * 24 * 60 * 60 * 1000)); - - // Set it document.cookie = name + '=; expires=' + date.toUTCString() + '; path=/'; } From 21ffbf610728224209b7dbf0aee51e6e457ee764 Mon Sep 17 00:00:00 2001 From: Lionel Mukuna Ciowela Date: Fri, 19 Apr 2019 14:13:01 +0200 Subject: [PATCH 12/26] fix(cookie-consent): creating i18n translation files for the cookie pop up #18 --- docs/assets/lang/en.json | 2 +- docs/assets/lang/fr.json | 4 ++-- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/docs/assets/lang/en.json b/docs/assets/lang/en.json index 7e261b5b..3b52e20a 100644 --- a/docs/assets/lang/en.json +++ b/docs/assets/lang/en.json @@ -3,6 +3,6 @@ "header": "Cookies used on Ng-Boosted!", "message": "This website uses cookies to ensure you get the best experience on our website.", "allow": "Allow cookies", - "deny": "Personalize" + "deny": "Decline" } } \ No newline at end of file diff --git a/docs/assets/lang/fr.json b/docs/assets/lang/fr.json index 09bfd233..ae162e1b 100644 --- a/docs/assets/lang/fr.json +++ b/docs/assets/lang/fr.json @@ -2,7 +2,7 @@ "cookie": { "header": "Ng-Boosted utilises des Cookies", "message": "En poursuivant votre navigation, vous acceptez l'utilisation de services tiers pouvant installer des cookies.", - "allow": "OK, tout accepter.", - "deny": "Personnaliser" + "allow": "Accepter les cookies", + "deny": "Refuser les cookies" } } \ No newline at end of file From fe8afa4645fbfb91d7374ed97efa3a1a59ba9786 Mon Sep 17 00:00:00 2001 From: Lionel Mukuna Ciowela Date: Thu, 25 Apr 2019 16:46:52 +0200 Subject: [PATCH 13/26] fix(cookie-consent): remove ngx cookieconsent --- package-lock.json | 14 ++------------ package.json | 2 -- 2 files changed, 2 insertions(+), 14 deletions(-) diff --git a/package-lock.json b/package-lock.json index a6173a0e..31a29a9a 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1495,6 +1495,7 @@ "version": "11.0.1", "resolved": "https://registry.npmjs.org/@ngx-translate/core/-/core-11.0.1.tgz", "integrity": "sha512-nBCa1ZD9fAUY/3eskP3Lql2fNg8OMrYIej1/5GRsfcutx9tG/5fZLCv9m6UCw1aS+u4uK/vXjv1ctG/FdMvaWg==", + "dev": true, "requires": { "tslib": "^1.9.0" } @@ -1503,6 +1504,7 @@ "version": "4.0.0", "resolved": "https://registry.npmjs.org/@ngx-translate/http-loader/-/http-loader-4.0.0.tgz", "integrity": "sha512-x8LumqydWD7eX9yQTAVeoCM9gFUIGVTUjZqbxdAUavAA3qVnk9wCQux7iHLPXpydl8vyQmLoPQR+fFU+DUDOMA==", + "dev": true, "requires": { "tslib": "^1.9.0" } @@ -3889,12 +3891,6 @@ "integrity": "sha1-4wOogrNCzD7oylE6eZmXNNqzriw=", "dev": true }, - "cookieconsent": { - "version": "3.1.0", - "resolved": "https://registry.npmjs.org/cookieconsent/-/cookieconsent-3.1.0.tgz", - "integrity": "sha512-FhkOAzZdIVqg7UfPjymgJBA7ZeEjrMgO8RWh+1Z130K7TlJDNnIORMulvqmt66SPyfrUnFB3SYJ55/7EvEcSEA==", - "dev": true - }, "copy-concurrently": { "version": "1.0.5", "resolved": "https://registry.npmjs.org/copy-concurrently/-/copy-concurrently-1.0.5.tgz", @@ -10029,12 +10025,6 @@ "integrity": "sha1-yobR/ogoFpsBICCOPchCS524NCw=", "dev": true }, - "ngx-cookieconsent": { - "version": "2.0.0", - "resolved": "https://registry.npmjs.org/ngx-cookieconsent/-/ngx-cookieconsent-2.0.0.tgz", - "integrity": "sha512-Eus6yf2BvPD4Os+mNDif2bFid8U/rqh5pureF9I8tGUVcB8nPKast0OLHF7ySUZyOFBGdrKQ49ZrZ/x6pesAKQ==", - "dev": true - }, "nice-try": { "version": "1.0.5", "resolved": "https://registry.npmjs.org/nice-try/-/nice-try-1.0.5.tgz", diff --git a/package.json b/package.json index f4cd21ea..5eb195be 100644 --- a/package.json +++ b/package.json @@ -72,7 +72,6 @@ "babel-loader": "8.0.5", "codelyzer": "^4.5.0", "copy-webpack-plugin": "^4.6.0", - "cookieconsent": "^3.1.0", "core-js": "2.6.3", "cpx": "^1.5.0", "css-loader": "^2.1.0", @@ -99,7 +98,6 @@ "karma-sourcemap-loader": "^0.3.7", "karma-webpack": "^3.0.5", "markdown-loader": "^5.0.0", - "ngx-cookieconsent": "^2.0.0", "parse5": "^5.1.0", "path": "0.12.7", "postcss-loader": "^3.0.0", From 7ce5919cdf1447342acf13270a5e8b6fb8fc5fa9 Mon Sep 17 00:00:00 2001 From: Lionel Mukuna Ciowela Date: Thu, 25 Apr 2019 18:10:30 +0200 Subject: [PATCH 14/26] fix(cookie-consent): removing ngx-cookie-consent from the app #18 --- docs/app/app.component.ts | 87 ++------------------------------------- docs/app/app.module.ts | 45 ++------------------ 2 files changed, 7 insertions(+), 125 deletions(-) diff --git a/docs/app/app.component.ts b/docs/app/app.component.ts index ec0a80e1..3c3b9a99 100644 --- a/docs/app/app.component.ts +++ b/docs/app/app.component.ts @@ -1,10 +1,6 @@ -import { Component, OnInit, OnDestroy } from '@angular/core'; +import { Component } from '@angular/core'; import { Globals } from './global'; -import { NgcCookieConsentService } from 'ngx-cookieconsent'; -import { TranslateService } from '@ngx-translate/core'; -import { Subscription } from 'rxjs/Subscription'; import { CookieManagerService } from './util/cookie-utils'; -import { NgcInitializeEvent, NgcStatusChangeEvent } from 'ngx-cookieconsent'; @Component({ selector: 'app', @@ -12,84 +8,9 @@ import { NgcInitializeEvent, NgcStatusChangeEvent } from 'ngx-cookieconsent'; providers: [Globals, CookieManagerService] }) -export class AppComponent implements OnInit, OnDestroy { - private GA_COOKIE_NAMES = ['_ga', '_gat']; - private GA_ID = 'test'; - // keep refs to subscriptions to be able to unsubscribe later - private popupOpenSubscription: Subscription; - private popupCloseSubscription: Subscription; - private initializeSubscription: Subscription; - private statusChangeSubscription: Subscription; - private revokeChoiceSubscription: Subscription; - private noCookieLawSubscription: Subscription; - constructor(public globals: Globals, private cookiemanager: CookieManagerService, - private ccService: NgcCookieConsentService, private translateService: TranslateService) {} - - public ngOnInit() { - - const GA_COOKIE_NAMES = ['_ga', '_gat']; - // Support for translated cookies messages - this.translateService.addLangs(['en', 'fr']); - this.translateService.setDefaultLang('en'); - - this.ccService.getConfig().autoOpen = true; - - const browserLang = this.translateService.getBrowserLang(); - this.translateService.use(browserLang.match(/en|fr/) ? browserLang : 'en'); +export class AppComponent { - this.translateService.get(['cookie.header', 'cookie.message', 'cookie.allow', 'cookie.deny']).subscribe( (data) => { - this.ccService.getConfig().content = this.ccService.getConfig().content || {} ; - // Override default messages with the translated ones - this.ccService.getConfig().content.header = data['cookie.header']; - this.ccService.getConfig().content.message = data['cookie.message']; - this.ccService.getConfig().content.allow = data['cookie.allow']; - this.ccService.getConfig().content.deny = data['cookie.deny']; - - this.ccService.destroy(); - this.ccService.init(this.ccService.getConfig()); - }); - this.statusChangeSubscription = this.ccService.statusChange$.subscribe( - (event: NgcStatusChangeEvent) => { - const TrackNavigator = navigator.doNotTrack; - // Check donotTrack and Cookie Consent and do nothing if those values are positive - if ( TrackNavigator === '1' || TrackNavigator === 'yes' || !TrackNavigator) { - this.rejectCookie(this.GA_ID); - return; - } - if ( !this.ccService.hasConsented().valueOf() && (TrackNavigator === '1' || TrackNavigator === 'yes' || !TrackNavigator)) { - this.rejectCookie(this.GA_ID); - return; - } - if (this.ccService.hasConsented().valueOf() && (TrackNavigator === '0' || TrackNavigator === 'no' || TrackNavigator === 'unspecified')) { - // start analytics - return; - } - if (this.ccService.hasConsented().valueOf()) { - this.rejectCookie(this.GA_ID); - return; - } - }); - } - - public ngOnDestroy() { - // unsubscribe to cookieconsent observables to prevent memory leaks - this.popupOpenSubscription.unsubscribe(); - this.popupCloseSubscription.unsubscribe(); - this.initializeSubscription.unsubscribe(); - this.statusChangeSubscription.unsubscribe(); - this.revokeChoiceSubscription.unsubscribe(); - this.noCookieLawSubscription.unsubscribe(); - } - - private rejectCookie(gaId: string) { - // disable GA - this.cookiemanager.setCookie(`ga-disable-${gaId}`, 'true'); - window[`ga-disable-${gaId}`] = true; - this.cookiemanager.setCookie('cookieconsent_status', 'deny'); - this.GA_COOKIE_NAMES.forEach((cookieName) => { - this.cookiemanager.deleteCookie(cookieName); - }); - console.log('has no consented'); - } + // keep refs to subscriptions to be able to unsubscribe later + constructor(public globals: Globals) {} } diff --git a/docs/app/app.module.ts b/docs/app/app.module.ts index ff8d0928..ce6ab43c 100644 --- a/docs/app/app.module.ts +++ b/docs/app/app.module.ts @@ -1,19 +1,15 @@ -import { NgModule, ApplicationRef } from '@angular/core'; +import { NgModule } from '@angular/core'; import { BrowserModule } from '@angular/platform-browser'; -import { RouterModule } from '@angular/router'; +import { RouterModule } from '@angular/router'; import { FormsModule } from '@angular/forms'; import { HashLocationStrategy, LocationStrategy } from '@angular/common'; - -import { NgcCookieConsentModule, NgcCookieConsentConfig } from 'ngx-cookieconsent'; - import { HttpClientModule, HttpClient } from '@angular/common/http'; -import { TranslateModule, TranslateLoader } from '@ngx-translate/core'; import { TranslateHttpLoader } from '@ngx-translate/http-loader'; import { NgbModule } from '@ng-bootstrap/ng-bootstrap'; import { NgBoostedModule } from '../../dist'; -import { AppComponent } from './app.component'; +import { AppComponent } from './app.component'; import { HomeComponent } from './home.component'; import { StartComponent } from './start.component'; import { DocsComponent } from './docs.component'; @@ -61,46 +57,11 @@ export function HttpLoaderFactory(http: HttpClient) { return new TranslateHttpLoader(http, './assets/i18n/', '.json'); } -const cookieConfig: NgcCookieConsentConfig = { - cookie: { - domain: 'localhost' // or 'your.domain.com' // it is mandatory to set a domain, for cookies to work properly (see https://goo.gl/S2Hy2A) - }, - position: 'bottom', - theme: 'classic', - palette: { - popup: { - background: '#000', - text: '#ffffff', - link: '#ffffff' - }, - button: { - background: '#f16e00', - text: '#ffffff', - border: 'transparent' - } - }, - type: 'opt-out', - content: { - message: 'En poursuivant votre navigation, vous acceptez l\'utilisation de services tiers pouvant installer des cookies.', - deny: 'Refuser les cookies', - href: 'https://cookiesandyou.com', - allow: 'Accepter les cookies' - } -}; - @NgModule({ imports: [ BrowserModule, FormsModule, HttpClientModule, - NgcCookieConsentModule.forRoot(cookieConfig), - TranslateModule.forRoot({ - loader: { - provide: TranslateLoader, - useFactory: HttpLoaderFactory, - deps: [HttpClient] - } - }), RouterModule.forRoot([ { path: 'home', From 0bf9cae9ac738b63a6467fd9bec85f6c966dc7ee Mon Sep 17 00:00:00 2001 From: Lionel Mukuna Ciowela Date: Thu, 25 Apr 2019 18:11:53 +0200 Subject: [PATCH 15/26] fix(cookie-consent): defining a function set GA to false, disable GA to track #18 --- docs/app/util/cookie-utils.ts | 14 +++++++++++++- 1 file changed, 13 insertions(+), 1 deletion(-) diff --git a/docs/app/util/cookie-utils.ts b/docs/app/util/cookie-utils.ts index 3e91b0d8..2edef715 100644 --- a/docs/app/util/cookie-utils.ts +++ b/docs/app/util/cookie-utils.ts @@ -3,7 +3,9 @@ */ export class CookieManagerService { -public setCookie(name: string, val: string) { +private GA_COOKIE_NAMES = ['_ga', '_gat']; + +public setCookie(name: string, val: boolean) { const date = new Date(); const value = val; // Set it expire in 395 days, compliance with Cookie Laws in EU @@ -25,4 +27,14 @@ public deleteCookie(name: string) { document.cookie = name + '=; expires=' + date.toUTCString() + '; path=/'; } +public rejectCookie(gaId: string) { + // disable GA + this.setCookie(`ga-disable-${gaId}`, true); + this.setCookie(`consent`, false); + window[`ga-disable-${gaId}`] = true; + this.GA_COOKIE_NAMES.forEach((cookieName) => { + this.deleteCookie(cookieName); + }); + } + } From 24e063db32d0698286abd22b3823a39ce6428070 Mon Sep 17 00:00:00 2001 From: Lionel Mukuna Ciowela Date: Fri, 26 Apr 2019 16:46:27 +0200 Subject: [PATCH 16/26] fix(cookie-consent): creating a new class and interface to show alert cookie #18 --- docs/app/cookie-interface/alert-cookie.css | 14 ++++ docs/app/cookie-interface/alert-cookie.html | 7 ++ docs/app/cookie-interface/alert-cookie.ts | 75 +++++++++++++++++++++ docs/app/cookie-interface/alert.ts | 6 ++ 4 files changed, 102 insertions(+) create mode 100644 docs/app/cookie-interface/alert-cookie.css create mode 100644 docs/app/cookie-interface/alert-cookie.html create mode 100644 docs/app/cookie-interface/alert-cookie.ts create mode 100644 docs/app/cookie-interface/alert.ts diff --git a/docs/app/cookie-interface/alert-cookie.css b/docs/app/cookie-interface/alert-cookie.css new file mode 100644 index 00000000..b7299b23 --- /dev/null +++ b/docs/app/cookie-interface/alert-cookie.css @@ -0,0 +1,14 @@ +.alert-cookie { + color: #fff; + background-color: #000; +} + +.btn-deny { + color: #fff; +} + +.btn-allow { + color: #fff; + background-color: #f16e00; + border-color: #f16e00; +} \ No newline at end of file diff --git a/docs/app/cookie-interface/alert-cookie.html b/docs/app/cookie-interface/alert-cookie.html new file mode 100644 index 00000000..c1a46b84 --- /dev/null +++ b/docs/app/cookie-interface/alert-cookie.html @@ -0,0 +1,7 @@ + +

+ {{ alert.message }} + + +

+ \ No newline at end of file diff --git a/docs/app/cookie-interface/alert-cookie.ts b/docs/app/cookie-interface/alert-cookie.ts new file mode 100644 index 00000000..bf88e150 --- /dev/null +++ b/docs/app/cookie-interface/alert-cookie.ts @@ -0,0 +1,75 @@ +import { Component, OnInit } from '@angular/core'; +import { TranslateService } from '@ngx-translate/core'; +import { CookieManagerService } from '../util/cookie-utils'; + +interface Alert { + type: string; + message: string; + deny: string; + allow: string; +} + +const ALERTS: Alert[] = [{ + type: 'success', + message: 'This is an success alert', + deny: 'Refuse Cookies', + allow: 'Accept Cookies', + }]; + +@Component({ + selector: 'alert-cookie', + templateUrl: './alert-cookie.html', + styleUrls: ['./alert-cookie.css'], + providers: [CookieManagerService] +}) +export class AlertCookie implements OnInit { + private alert: Alert; + private GA_ID = 'test'; + private showAlertCookie: boolean = true; + + constructor(private translateService: TranslateService, private cookiemanager: CookieManagerService) {} + public ngOnInit() { + this.translateService.addLangs(['en', 'fr']); + this.translateService.setDefaultLang('en'); + + const browserLang = this.translateService.getBrowserLang(); + this.translateService.use(browserLang.match(/en|fr/) ? browserLang : 'en'); + + this.translateService.get(['cookie.header', 'cookie.message', 'cookie.allow', 'cookie.deny']).subscribe((data) => { + this.alert.type = 'warning'; + this.alert.message = data['cookie.message']; + this.alert.deny = data['cookie.deny']; + this.alert.allow = data['cookie.allow']; + }); + + const TrackNavigator = navigator.doNotTrack; + // Check donotTrack and Cookie Consent and do nothing if those values are positive + if ( TrackNavigator === '1' || TrackNavigator === 'yes' || !TrackNavigator) { + this.cookiemanager.rejectCookie(this.GA_ID); + this.showAlertCookie = false; + return; + } + if ( !this.cookiemanager.getCookie('consent') && (TrackNavigator === '1' || TrackNavigator === 'yes' || !TrackNavigator)) { + this.cookiemanager.rejectCookie(this.GA_ID); + this.showAlertCookie = false; + return; + } + if (this.cookiemanager.getCookie('consent') === 'false') { + this.cookiemanager.rejectCookie(this.GA_ID); + this.showAlertCookie = false; + return; + } + } + + public deny() { + this.cookiemanager.rejectCookie(this.GA_ID); + this.showAlertCookie = false; + return; + } + + public allow() { + this.cookiemanager.setCookie('consent', true); + this.showAlertCookie = false; + return; + } +} diff --git a/docs/app/cookie-interface/alert.ts b/docs/app/cookie-interface/alert.ts new file mode 100644 index 00000000..14eea025 --- /dev/null +++ b/docs/app/cookie-interface/alert.ts @@ -0,0 +1,6 @@ +export class Alert { + public header: string; + public message: string; + public deny: string; + public allow: string; +} From 59ee575da7d8ca8f34000b49e26ce6d1746ab630 Mon Sep 17 00:00:00 2001 From: Lionel Mukuna Ciowela Date: Fri, 26 Apr 2019 17:58:47 +0200 Subject: [PATCH 17/26] fix(cookie-consent): remove script command from ng cookie consent #18 --- package.json | 1 - 1 file changed, 1 deletion(-) diff --git a/package.json b/package.json index 5eb195be..5a611a4e 100644 --- a/package.json +++ b/package.json @@ -13,7 +13,6 @@ "license": "MIT", "main": "dist/index.js", "scripts": { - "cookie-vendor": "shx mkdir -p docs/cookie/vendor/js && shx mkdir -p docs/cookie/vendor/css && shx cp node_modules/cookieconsent/build/cookieconsent.min.js docs/cookie/vendor/js && shx cp node_modules/cookieconsent/build/cookieconsent.min.css docs/cookie/vendor/css", "build:dist": "npm run clean:dist && npm run lint:dist && ngc -p tsconfig-dist.json && npm run copy:dist && npm run rimraf .tmp", "build:docs": "rimraf _gh_pages && npm run lint:docs && webpack --progress --profile --bail", "build": "npm run build:dist", From de4e3b44600d42174828494bf77c3ba11be0c82e Mon Sep 17 00:00:00 2001 From: Lionel Mukuna Ciowela Date: Fri, 26 Apr 2019 17:59:44 +0200 Subject: [PATCH 18/26] fix(cookie-consent): remove import of ng cookie consent #18 --- docs/vendor.ts | 4 ---- 1 file changed, 4 deletions(-) diff --git a/docs/vendor.ts b/docs/vendor.ts index 73d97107..e6587421 100644 --- a/docs/vendor.ts +++ b/docs/vendor.ts @@ -33,10 +33,6 @@ import 'boosted/dist/css/orangeHelvetica.css'; import 'boosted/dist/css/orangeIcons.css'; import 'boosted/dist/css/boosted.css'; -// Cookie Consent -import 'cookieconsent/build/cookieconsent.min.js'; -import 'cookieconsent/build/cookieconsent.min.css'; - if ('production' === process.env.ENV) { // Production From 5161871d33b86334036a1b47aa173f2aa1007466 Mon Sep 17 00:00:00 2001 From: Lionel Mukuna Ciowela Date: Fri, 26 Apr 2019 18:02:14 +0200 Subject: [PATCH 19/26] fix(cookie-consent): redefine and updating cookie function, css and html #18 --- docs/app/cookie-interface/alert-cookie.css | 13 ++-- docs/app/cookie-interface/alert-cookie.html | 4 +- docs/app/cookie-interface/alert-cookie.ts | 78 +++++++++++---------- 3 files changed, 49 insertions(+), 46 deletions(-) diff --git a/docs/app/cookie-interface/alert-cookie.css b/docs/app/cookie-interface/alert-cookie.css index b7299b23..db0009ba 100644 --- a/docs/app/cookie-interface/alert-cookie.css +++ b/docs/app/cookie-interface/alert-cookie.css @@ -3,12 +3,13 @@ background-color: #000; } -.btn-deny { - color: #fff; +.bottom { + bottom: 0; + left: 0; + position: fixed; + right: 0; } -.btn-allow { - color: #fff; - background-color: #f16e00; - border-color: #f16e00; +.alert { + margin-bottom: 0 !important } \ No newline at end of file diff --git a/docs/app/cookie-interface/alert-cookie.html b/docs/app/cookie-interface/alert-cookie.html index c1a46b84..d0216e31 100644 --- a/docs/app/cookie-interface/alert-cookie.html +++ b/docs/app/cookie-interface/alert-cookie.html @@ -1,7 +1,7 @@

{{ alert.message }} - - + +

\ No newline at end of file diff --git a/docs/app/cookie-interface/alert-cookie.ts b/docs/app/cookie-interface/alert-cookie.ts index bf88e150..be7c7e1c 100644 --- a/docs/app/cookie-interface/alert-cookie.ts +++ b/docs/app/cookie-interface/alert-cookie.ts @@ -1,4 +1,4 @@ -import { Component, OnInit } from '@angular/core'; +import { Component } from '@angular/core'; import { TranslateService } from '@ngx-translate/core'; import { CookieManagerService } from '../util/cookie-utils'; @@ -9,55 +9,57 @@ interface Alert { allow: string; } -const ALERTS: Alert[] = [{ - type: 'success', - message: 'This is an success alert', - deny: 'Refuse Cookies', - allow: 'Accept Cookies', - }]; - @Component({ selector: 'alert-cookie', templateUrl: './alert-cookie.html', styleUrls: ['./alert-cookie.css'], - providers: [CookieManagerService] + providers: [CookieManagerService, TranslateService] }) -export class AlertCookie implements OnInit { - private alert: Alert; +export class AlertCookieService { + + private cookieAlert: Alert = { + type: 'warning', + message: 'This is an success alert', + deny: 'Refuse Cookies', + allow: 'Accept Cookies', + }; private GA_ID = 'test'; private showAlertCookie: boolean = true; constructor(private translateService: TranslateService, private cookiemanager: CookieManagerService) {} - public ngOnInit() { - this.translateService.addLangs(['en', 'fr']); - this.translateService.setDefaultLang('en'); - const browserLang = this.translateService.getBrowserLang(); - this.translateService.use(browserLang.match(/en|fr/) ? browserLang : 'en'); + public initAlertCookieService() { + if (this.showAlertCookie) { + this.translateService.addLangs(['en', 'fr']); + this.translateService.setDefaultLang('en'); - this.translateService.get(['cookie.header', 'cookie.message', 'cookie.allow', 'cookie.deny']).subscribe((data) => { - this.alert.type = 'warning'; - this.alert.message = data['cookie.message']; - this.alert.deny = data['cookie.deny']; - this.alert.allow = data['cookie.allow']; - }); + const browserLang = this.translateService.getBrowserLang(); + this.translateService.use(browserLang.match(/en|fr/) ? browserLang : 'en'); - const TrackNavigator = navigator.doNotTrack; - // Check donotTrack and Cookie Consent and do nothing if those values are positive - if ( TrackNavigator === '1' || TrackNavigator === 'yes' || !TrackNavigator) { - this.cookiemanager.rejectCookie(this.GA_ID); - this.showAlertCookie = false; - return; - } - if ( !this.cookiemanager.getCookie('consent') && (TrackNavigator === '1' || TrackNavigator === 'yes' || !TrackNavigator)) { - this.cookiemanager.rejectCookie(this.GA_ID); - this.showAlertCookie = false; - return; - } - if (this.cookiemanager.getCookie('consent') === 'false') { - this.cookiemanager.rejectCookie(this.GA_ID); - this.showAlertCookie = false; - return; + this.translateService.get(['cookie.header', 'cookie.message', 'cookie.allow', 'cookie.deny']).subscribe((data) => { + this.cookieAlert.type = 'warning'; + this.cookieAlert.message = data['cookie.message']; + this.cookieAlert.deny = data['cookie.deny']; + this.cookieAlert.allow = data['cookie.allow']; + }); + + const TrackNavigator = navigator.doNotTrack; + // Check donotTrack and Cookie Consent and do nothing if those values are positive + if ( TrackNavigator === '1' || TrackNavigator === 'yes' || !TrackNavigator) { + this.cookiemanager.rejectCookie(this.GA_ID); + this.showAlertCookie = false; + return; + } + if ( !this.cookiemanager.getCookie('consent') && (TrackNavigator === '1' || TrackNavigator === 'yes' || !TrackNavigator)) { + this.cookiemanager.rejectCookie(this.GA_ID); + this.showAlertCookie = false; + return; + } + if (this.cookiemanager.getCookie('consent') === 'false') { + this.cookiemanager.rejectCookie(this.GA_ID); + this.showAlertCookie = false; + return; + } } } From 1134141f5b8d73af7eeedcc9b2ffa981b65c4e58 Mon Sep 17 00:00:00 2001 From: Lionel Mukuna Ciowela Date: Fri, 26 Apr 2019 18:08:03 +0200 Subject: [PATCH 20/26] fix(cookie-consent): adding alert inside app componenent, adding cookie service inside module #18 --- docs/app/app.component.html | 16 ++++++++- docs/app/app.component.ts | 72 ++++++++++++++++++++++++++++++++++--- docs/app/app.module.ts | 12 ++++++- 3 files changed, 94 insertions(+), 6 deletions(-) diff --git a/docs/app/app.component.html b/docs/app/app.component.html index 04b6a307..54c1db8e 100644 --- a/docs/app/app.component.html +++ b/docs/app/app.component.html @@ -15,7 +15,21 @@ - + +
+
+
+

+ {{ cookieAlert.message }} +

+
+
+ + +
+
+
+