diff --git a/src/app/app.component.ts b/src/app/app.component.ts index 10cda90755..1ef5c868a6 100644 --- a/src/app/app.component.ts +++ b/src/app/app.component.ts @@ -33,6 +33,7 @@ import { models } from './core/core.module'; import { LocaleService } from './core/locale/locale.service'; import { hasValue } from './shared/empty.util'; import { KlaroService } from './shared/cookies/klaro.service'; +import {GoogleAnalyticsService} from './statistics/google-analytics.service'; @Component({ selector: 'ds-app', @@ -70,7 +71,8 @@ export class AppComponent implements OnInit, AfterViewInit { private menuService: MenuService, private windowService: HostWindowService, private localeService: LocaleService, - @Optional() private cookiesService: KlaroService + @Optional() private cookiesService: KlaroService, + @Optional() private googleAnalyticsService: GoogleAnalyticsService, ) { /* Use models object so all decorators are actually called */ @@ -84,7 +86,10 @@ export class AppComponent implements OnInit, AfterViewInit { // set the current language code this.localeService.setCurrentLanguageCode(); - angulartics2GoogleAnalytics.startTracking(); + // analytics + if (hasValue(googleAnalyticsService)) { + googleAnalyticsService.addTrackingIdToPage(); + } angulartics2DSpace.startTracking(); metadata.listenForRouteChange(); diff --git a/src/app/statistics/google-analytics.service.spec.ts b/src/app/statistics/google-analytics.service.spec.ts new file mode 100644 index 0000000000..3329024a18 --- /dev/null +++ b/src/app/statistics/google-analytics.service.spec.ts @@ -0,0 +1,16 @@ +import { TestBed } from '@angular/core/testing'; + +import { GoogleAnalyticsService } from './google-analytics.service'; + +describe('GoogleAnalyticsService', () => { + let service: GoogleAnalyticsService; + + beforeEach(() => { + TestBed.configureTestingModule({}); + service = TestBed.inject(GoogleAnalyticsService); + }); + + it('should be created', () => { + expect(service).toBeTruthy(); + }); +}); diff --git a/src/app/statistics/google-analytics.service.ts b/src/app/statistics/google-analytics.service.ts new file mode 100644 index 0000000000..ec780bda2b --- /dev/null +++ b/src/app/statistics/google-analytics.service.ts @@ -0,0 +1,40 @@ +import { Injectable } from '@angular/core'; +import {Angulartics2GoogleAnalytics} from 'angulartics2/ga'; +import {ConfigurationDataService} from '../core/data/configuration-data.service'; +import {getFirstCompletedRemoteData} from '../core/shared/operators'; +import {isEmpty, isNotEmpty} from '../shared/empty.util'; + +@Injectable() +export class GoogleAnalyticsService { + + constructor( + private angulartics: Angulartics2GoogleAnalytics, + private configService: ConfigurationDataService, + ) { } + + addTrackingIdToPage() { + this.configService.findByPropertyName('google.analytics.key').pipe( + getFirstCompletedRemoteData(), + ).subscribe((remoteData) => { + // make sure we got a success response from the backend + if (!remoteData.hasSucceeded) { return; } + + const trackingId = remoteData.payload.values[0]; + + // make sure we received a tracking id + if (isEmpty(trackingId)) { return; } + + // add trackingId snippet to page + const keyScript = document.createElement('script'); + keyScript.innerHTML = `(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){ + (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o), + m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m) + })(window,document,'script','https://www.google-analytics.com/analytics.js','ga'); + 'ga('create', '${trackingId}', 'auto');`; + document.body.appendChild(keyScript); + + // start tracking + this.angulartics.startTracking(); + }); + } +} diff --git a/src/config/global-config.interface.ts b/src/config/global-config.interface.ts index 0bc3d5eec4..5c6e56babb 100644 --- a/src/config/global-config.interface.ts +++ b/src/config/global-config.interface.ts @@ -23,7 +23,6 @@ export interface GlobalConfig extends Config { notifications: INotificationBoardOptions; submission: SubmissionConfig; universal: UniversalConfig; - gaTrackingId: string; logDirectory: string; debug: boolean; defaultLanguage: string; diff --git a/src/environments/environment.common.ts b/src/environments/environment.common.ts index d47c3cfcef..a0fe851cb4 100644 --- a/src/environments/environment.common.ts +++ b/src/environments/environment.common.ts @@ -132,8 +132,6 @@ export const environment: GlobalConfig = { async: true, time: false }, - // Google Analytics tracking id - gaTrackingId: '', // Log directory logDirectory: '.', // NOTE: will log all redux actions and transfers in console diff --git a/src/environments/mock-environment.ts b/src/environments/mock-environment.ts index b220c46083..ef3eb86cc2 100644 --- a/src/environments/mock-environment.ts +++ b/src/environments/mock-environment.ts @@ -110,8 +110,6 @@ export const environment: Partial = { async: true, time: false }, - // Google Analytics tracking id - gaTrackingId: '', // Log directory logDirectory: '.', // NOTE: will log all redux actions and transfers in console diff --git a/src/main.browser.ts b/src/main.browser.ts index 5149014d88..6e3a7ad602 100644 --- a/src/main.browser.ts +++ b/src/main.browser.ts @@ -25,25 +25,9 @@ export function main() { } }); - addGoogleAnalytics(); - return platformBrowserDynamic().bootstrapModule(BrowserAppModule, {preserveWhitespaces:true}); } -function addGoogleAnalytics() { - // Add google analytics if key is present in config - const trackingId = environment.gaTrackingId; - if (isNotEmpty(trackingId)) { - const keyScript = document.createElement('script'); - keyScript.innerHTML = `(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){ - (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o), - m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m) - })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');` - + 'ga(\'create\', \'' + environment.gaTrackingId + '\', \'auto\');'; - document.body.appendChild(keyScript); - } -} - // support async tag or hmr if (hasValue(environment.universal) && environment.universal.preboot === false) { bootloader(main); diff --git a/src/modules/app/browser-app.module.ts b/src/modules/app/browser-app.module.ts index 3aa6bf244b..e0bd7b5ca1 100644 --- a/src/modules/app/browser-app.module.ts +++ b/src/modules/app/browser-app.module.ts @@ -30,6 +30,7 @@ import { LocationToken } from '../../app/core/services/browser-hard-redirect.service'; import { LocaleService } from '../../app/core/locale/locale.service'; +import {GoogleAnalyticsService} from '../../app/statistics/google-analytics.service'; export const REQ_KEY = makeStateKey('req'); @@ -99,6 +100,10 @@ export function getRequest(transferState: TransferState): any { provide: HardRedirectService, useClass: BrowserHardRedirectService, }, + { + provide: GoogleAnalyticsService, + useClass: GoogleAnalyticsService, + }, { provide: LocationToken, useFactory: locationProvider,