[PPI-993] Adding the 'skipFirstPageView' setting in PiwikProRoutingMo…

…dule (#22)

README.md

@@ -107,7 +107,7 @@ export class AppModule {}
 
 ### Advanced setup for the Routing Module
 
-You can customize some rules to include/exclude routes on `NgxPiwikProRouterModule`. The include/exclude settings allow:
+#### You can customize some rules to include/exclude routes on `NgxPiwikProRouterModule`. The include/exclude settings allow:
 * Simple route matching: `{ include: [ '/full-uri-match' ] }`;
 * Wildcard route matching: `{ include: [ '*/public/*' ] }`;
 * Regular Expression route matching: `{ include: [ /^\/public\/.*/ ] }`;
@@ -128,6 +128,32 @@ import { NgxPiwikProModule, NgxPiwikProRouterModule } from '@piwikpro/ngx-piwik-
 export class AppModule {}  
 ```
 
+
+#### Track of PageViews from the first visit to the site.
+
+The default 'Data Collection' settings assume that the 'Track page views in a single-page application' option is set to true. You will find an iformation that if this option is enabled, we will record every change in the state of the browser history on the page and report it as a page view in the reports. You need to know that this option should be disabled if you want to use the ngx-piwik-pro library.
+
+This setting can be found in:
+`Administration -> Sites & Apps -> (choose your site or apps ) -> Data Collection -> Track page views in a single-page application`
+
+In order to work according to the default Data Collection settings, the library skips the first PageViews so as not to cause duplicate entries. However, if you have taken care to disable the above settings, you should also pass the following settings to the library.
+
+```ts  
+import { NgxPiwikProModule, NgxPiwikProRouterModule } from '@piwikpro/ngx-piwik-pro';  
+...  
+
+@NgModule({  
+  ...  
+  imports: [  
+    ...  
+    NgxPiwikProModule.forRoot('container-id'),  
+    NgxPiwikProRouterModule.forRoot({ skipFirstPageView: false })  
+//  ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^  
+  ]  
+})  
+export class AppModule {}  
+```
+
 ## Piwik PRO Services
 
 ### Send Custom Events

projects/ngx-piwik-pro/README.md

@@ -107,7 +107,7 @@ export class AppModule {}
 
 ### Advanced setup for the Routing Module
 
-You can customize some rules to include/exclude routes on `NgxPiwikProRouterModule`. The include/exclude settings allow:
+#### You can customize some rules to include/exclude routes on `NgxPiwikProRouterModule`. The include/exclude settings allow:
 * Simple route matching: `{ include: [ '/full-uri-match' ] }`;
 * Wildcard route matching: `{ include: [ '*/public/*' ] }`;
 * Regular Expression route matching: `{ include: [ /^\/public\/.*/ ] }`;
@@ -128,7 +128,31 @@ import { NgxPiwikProModule, NgxPiwikProRouterModule } from '@piwikpro/ngx-piwik-
 export class AppModule {}  
 ```
 
-## Piwik PRO Services
+
+#### Track of PageViews from the first visit to the site.
+
+The default 'Data Collection' settings assume that the 'Track page views in a single-page application' option is set to true. You will find an iformation that if this option is enabled, we will record every change in the state of the browser history on the page and report it as a page view in the reports. You need to know that this option should be disabled if you want to use the ngx-piwik-pro library.
+
+This setting can be found in: 
+`Administration -> Sites & Apps -> (choose your site or apps ) -> Data Collection -> Track page views in a single-page application`
+
+In order to work according to the default Data Collection settings, the library skips the first PageViews so as not to cause duplicate entries. However, if you have taken care to disable the above settings, you should also pass the following settings to the library.
+
+```ts  
+import { NgxPiwikProModule, NgxPiwikProRouterModule } from '@piwikpro/ngx-piwik-pro';  
+...  
+
+@NgModule({  
+  ...  
+  imports: [  
+    ...  
+    NgxPiwikProModule.forRoot('container-id'),  
+    NgxPiwikProRouterModule.forRoot({ skipFirstPageView: false })  
+//  ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^  
+  ]  
+})  
+export class AppModule {}  
+```
 
 ### Send Custom Events
 

projects/ngx-piwik-pro/src/lib/initializers/piwik-pro-router.initializer.ts

@@ -2,7 +2,7 @@ import { APP_BOOTSTRAP_LISTENER, ComponentRef, Provider } from '@angular/core';
 import { NGX_PIWIK_PRO_ROUTING_SETTINGS_TOKEN } from '../tokens/ngx-piwik-pro-router-settings.token';
 import { PiwikProRoutingSettings } from '../interfaces/piwik-pro-router-settings.interface';
 import { NavigationEnd, Router } from '@angular/router';
-import { filter, skip } from 'rxjs/operators';
+import { filter, skipWhile } from 'rxjs/operators';
 import { Title } from '@angular/platform-browser';
 import { PageViewsService } from '../services/page-views/page-views.service';
 
@@ -24,14 +24,21 @@ export function PiwikProRouterInitializer(
 ) {
   return async (c: ComponentRef<any>) => {
     const router = c.injector.get(Router);
-    const { include = [], exclude = [] } = settings ?? {};
+    const { include = [], exclude = [], skipFirstPageView } = settings ?? {};
     const includeRules = normalizePathRules(include);
     const excludeRules = normalizePathRules(exclude);
     const subs = router
       .events
       .pipe(
         filter((event: any) => event instanceof NavigationEnd),
-        skip(1), // Prevend double views on the first tigger (because PiwikPro Already send one ping on setup)
+
+        skipWhile((_, index) => {
+          // Preventing double views on the first trigger (because PiwikPro Already send one ping on setup by default)
+          if (skipFirstPageView) {
+            return index === 0;
+          }
+          return false;
+        }),
         filter(event => includeRules.length > 0
           ? includeRules.some(rule => rule.test(event.urlAfterRedirects))
           : true),

projects/ngx-piwik-pro/src/lib/initializers/piwik-pro.initializer.ts

@@ -17,6 +17,7 @@ export function PiwikProInitializer(
   settings: PiwikProSettings,
   document: Document
 ) {
+  window._paq = window._paq || [];
   return async () => {
     if (!settings.containerId) {
       if (!isDevMode()) {

projects/ngx-piwik-pro/src/lib/interfaces/piwik-pro-router-settings.interface.ts

@@ -1,4 +1,5 @@
 export interface PiwikProRoutingSettings {
+  skipFirstPageView?: boolean;
   exclude?: Array<string | RegExp>;
   include?: Array<string | RegExp>;
 }

projects/ngx-piwik-pro/src/lib/modules/ngx-piwik-pro-router.module.ts

@@ -22,7 +22,9 @@ export class NgxPiwikProRouterModule {
       providers: [
         {
           provide: NGX_PIWIK_PRO_ROUTING_SETTINGS_TOKEN,
-          useValue: settings ?? {}
+          useValue: settings ?? {
+            skipFirstPageView: true,
+          }
         },
       ]
     };

projects/ngx-piwik-pro/src/lib/ngx-piwik-pro.module.ts

@@ -3,6 +3,11 @@ import { NGX_PIWIK_PRO_SETTINGS_TOKEN } from './tokens/ngx-piwik-pro-settings.to
 import { PiwikProSettings } from './interfaces/piwik-pro-settings.interface';
 import { NGX_PIWIK_PRO_INITIALIZER_PROVIDER } from './initializers/piwik-pro.initializer';
 
+declare global {
+  interface Window {
+    _paq?: any[];
+  }
+}
 
 @NgModule({
   declarations: [