From 6efb9efd7818ffe3145c5a22cce769db80e49a06 Mon Sep 17 00:00:00 2001 From: Denis Strigo Date: Wed, 31 Oct 2018 13:13:19 +0200 Subject: [PATCH] chore(app): add analytics service (#7) --- .../components/header/header.component.html | 2 +- .../components/header/header.component.ts | 8 ++++++- .../download-icon.component.html | 2 +- .../download-icon/download-icon.component.ts | 8 ++++--- .../page-container.component.ts | 6 ++++- src/app/@theme/services/analytics.service.ts | 24 +++++++++++++++++++ src/app/@theme/services/index.ts | 2 ++ 7 files changed, 45 insertions(+), 7 deletions(-) create mode 100644 src/app/@theme/services/analytics.service.ts diff --git a/src/app/@theme/components/header/header.component.html b/src/app/@theme/components/header/header.component.html index fd53656..e1cf9ca 100644 --- a/src/app/@theme/components/header/header.component.html +++ b/src/app/@theme/components/header/header.component.html @@ -45,7 +45,7 @@ Download
diff --git a/src/app/@theme/components/modals/download-icon/download-icon.component.ts b/src/app/@theme/components/modals/download-icon/download-icon.component.ts index 9c95b6f..43fc342 100644 --- a/src/app/@theme/components/modals/download-icon/download-icon.component.ts +++ b/src/app/@theme/components/modals/download-icon/download-icon.component.ts @@ -7,6 +7,7 @@ import { AfterViewInit, ChangeDetectionStrategy, ChangeDetectorRef, Component, Input } from '@angular/core'; import { UrlService } from '../../../../@core/data/service/url.service'; import { NbDialogRef } from '@nebular/theme'; +import { EvaAnalytics } from '../../../services/analytics.service'; @Component({ selector: 'eva-download-icon', @@ -24,7 +25,8 @@ export class DownloadIconComponent implements AfterViewInit { constructor(private changeDetectorRef: ChangeDetectorRef, private urlService: UrlService, - protected dialogRef: NbDialogRef) {} + protected dialogRef: NbDialogRef, + private analytics: EvaAnalytics) {} ngAfterViewInit() { this.downloadControls = @@ -37,7 +39,7 @@ export class DownloadIconComponent implements AfterViewInit { this.dialogRef.close(); } - selectFormatAndDownloadIcon(iconFormat: string) { - this.selectedFormat = iconFormat; + clickOnDownloadIcon(icon: { format: string; title: string }) { + this.analytics.trackEvent('download-icon', `${this.selectedIcon}.${icon.format}`); } } diff --git a/src/app/@theme/components/page-container/page-container.component.ts b/src/app/@theme/components/page-container/page-container.component.ts index e237eab..18e2b22 100644 --- a/src/app/@theme/components/page-container/page-container.component.ts +++ b/src/app/@theme/components/page-container/page-container.component.ts @@ -25,6 +25,7 @@ import { debounceTime, delay, mergeMap, takeWhile, tap } from 'rxjs/operators'; import { DownloadIconComponent } from '../modals/download-icon/download-icon.component'; import { DialogStateService } from '../../services/dialog-state.service'; import { EvaVersionService } from '../../services/version.service'; +import { EvaAnalytics } from '../../services/analytics.service'; @Component({ selector: 'eva-page-container', @@ -54,7 +55,8 @@ export class PageContainerComponent implements AfterViewInit, OnDestroy { private breakpointService: NbMediaBreakpointsService, private themeService: NbThemeService, private dialogStateService: DialogStateService, - private versionService: EvaVersionService) { + private versionService: EvaVersionService, + private analytics: EvaAnalytics) { this.currentVersion = this.versionService.getEvoVersion(); this.breakpoints = this.breakpointService.getBreakpointsMap(); @@ -133,6 +135,8 @@ export class PageContainerComponent implements AfterViewInit, OnDestroy { } clickIcon(icon) { + this.analytics.trackEvent('open-icon-dialog', icon); + if (this.isMobileMode) { return; } diff --git a/src/app/@theme/services/analytics.service.ts b/src/app/@theme/services/analytics.service.ts new file mode 100644 index 0000000..3012ce5 --- /dev/null +++ b/src/app/@theme/services/analytics.service.ts @@ -0,0 +1,24 @@ +/** + * @license + * Copyright Akveo. All Rights Reserved. + * Licensed under the MIT License. See License.txt in the project root for license information. + */ + +import { Injectable, Inject } from '@angular/core'; +import { NB_WINDOW } from '@nebular/theme'; +declare const ga: any; + +@Injectable() +export class EvaAnalytics { + private enabled: boolean; + + constructor(@Inject(NB_WINDOW) private window) { + this.enabled = this.window.location.href.indexOf('akveo.github.io') >= 0; + } + + trackEvent(eventName: string, eventVal: string = '') { + if (this.enabled) { + ga('send', 'event', eventName, eventVal); + } + } +} diff --git a/src/app/@theme/services/index.ts b/src/app/@theme/services/index.ts index dacfa04..b31655e 100644 --- a/src/app/@theme/services/index.ts +++ b/src/app/@theme/services/index.ts @@ -6,9 +6,11 @@ import { EvaVersionService } from './version.service'; import { DialogStateService } from './dialog-state.service'; +import { EvaAnalytics } from './analytics.service'; export const evaServices = [ EvaVersionService, DialogStateService, + EvaAnalytics, ];