angulartics2 13.0.0 → 14.0.0

package/providers/incendium/README.md

@@ -1,100 +0,0 @@
-<img
-    src="../../../assets/svg/incendium.svg"
-    alt="Incendium analytics logo"
-    height="100px"
-    width="200px" />
-
-**homepage**: [incendium.ai](https://www.incendium.ai/)  
-**import**: `import { Angulartics2Incendium } from 'angulartics2';`
-
-## Setup
-
-1. Add tracking code provided by Incendium inside the header tag.
-
-2. [Setup Angulartics](https://github.com/angulartics/angulartics2/tree/master#installation) using `Angulartics2Incendium`
-
-   ```typescript
-   constructor(Angulartics2Incendium: Angulartics2Incendium) {
-       Angulartics2Incendium.startTracking();
-   }
-   ```
-
-3. Track Conversions, You can track conversions using Angulartics2 event tracking.
-   this can be done by adding the following to you html
-
-   ```html
-   <button
-     angulartics2On="click"
-     angularticsAction="{{ eIncendiumEventNames.ADD_CONVERION }}"
-     [angularticsProperties]="{ key: 'my_trigger_as_assigned_in_incendium' }"
-   >
-     Btn click
-   </button>
-   ```
-
-   Note that eIncendiumEventNames is a reference to IncendiumEventNames expoted from Angulartics2Incendium
-
-   Or you can fire the conversion in code for example
-
-   ```typescript
-   this.angulartics2.eventTrack.next({
-     action: IncendiumEventNames.ADD_CONVERION,
-     properties: {
-       key: 'my_trigger_as_assigned_in_incendium',
-     },
-   });
-   ```
-
-4. Incendium allows for offline tracking, to do this you must record the conversion key provided when firing a conversion.
-   A example of this would be a contact form which you later convert on the phone, incendium allows you to assign revenue next to this original conversion using this key
-
-   to do this fire a conversion off as above.
-   you can then subscribe to incendiumResponse. once the conversion has been tracked and response is returned you can use this response how ever you like.
-
-   **_Dont forget to unsubscribe_**
-
-   An Example workflow of this would be
-
-   ```typescript
-   export class Example implements OnInit {
-     private incSubscription;
-
-     constructor(
-       private angulartics2: Angulartics2,
-       private angulartics2Incendium: Angulartics2Incendium,
-     ) {}
-
-     ngOnInit(): void {
-       this.incSubscription = this.angulartics2Incendium.incendiumResponse.subscribe({
-         next: v => {
-           if (v.type === IncendiumEventNames.ADD_CONVERION) {
-             this.submit(v.value);
-           }
-         },
-         error: e => {
-           console.error(e);
-           // submit without key or handle how you like
-           this.submit();
-         },
-       });
-     }
-
-     ngOnDestroy(): void {
-       // Dont forget to unsubscribe
-       this.incSubscription.unsubscribe();
-     }
-
-     onSubmit() {
-       this.angulartics2.eventTrack.next({
-         action: IncendiumEventNames.ADD_CONVERION,
-         properties: {
-           key: 'my_trigger_as_assigned_in_incendium',
-         },
-       });
-     }
-
-     submit(incendiumKey?: string) {
-       alert(`form submitted with ${incendiumKey ? `key ${incendiumKey}` : `no key`}`);
-     }
-   }
-   ```

package/providers/intercom/README.md

@@ -1,12 +0,0 @@
-<img 
-    src="../../../assets/svg/intercom.svg" 
-    alt="Intercom logo"
-    height="100px"
-    width="200px" />
-
-# Intercom
-__homepage__: [www.intercom.com](https://www.intercom.com/)  
-__docs__: [developers.intercom.com/docs](https://developers.intercom.com/docs)  
-__import__: `import { Angulartics2Intercom } from 'angulartics2';`  
-
-## Setup

package/providers/kissmetrics/README.md

@@ -1,12 +0,0 @@
-<img 
-    src="../../../assets/svg/kissmetrics.svg" 
-    alt="Kissmetrics logo"
-    height="100px"
-    width="200px" />
-
-# Kissmetrics
-__homepage__: [kissmetrics.com/product/analyze/](https://www.kissmetrics.com/product/analyze/)  
-__docs__: [developers.kissmetrics.com/reference](https://developers.kissmetrics.com/reference)  
-__import__: `import { Angulartics2Kissmetrics } from 'angulartics2';`  
-
-## Setup

package/providers/launch/README.md

@@ -1,59 +0,0 @@
-<img 
-    src="../../../assets/svg/launch.svg" 
-    alt="Launch, by Adobe logo"
-    height="100px"
-    width="100px" />
-
-# Launch, by Adobe
-__homepage__: [Launch, by Adobe](https://www.adobe.com/experience-platform/launch.html)  
-__docs__: [developer.adobelaunch.com/](https://developer.adobelaunch.com/)  
-__import__: `import { Angulartics2LaunchByAdobe } from 'angulartics2';`  
-
-
-## Initial Setup
-
-Add your Launch embed code to the end of your head tag, as usual.
-
-You can either add just the embed code with "async", or non-async embed code in the head plus the <code>_satellite.pageBottom()</code> snippet at the end of the body.
-
-*Note: this provider works with [DTM](https://www.adobe.com/experience-platform/activation.html), too.*
-
-## Include it in your application
-
-Bootstrapping the application with ```Angulartics2``` as provider and injecting both ```Angulartics2``` and ```Angulartics2LaunchByAdobe``` (or any provider) into the root component will hook into the router and send every route change to Launch, where it can be used for Analytics tracking or a lot of other things.
-
-
-```ts
-// component
-import { Angulartics2LaunchByAdobe } from 'angulartics2';
-
-@Component({ ... })
-export class AppComponent {
-  // import Angulartics2LaunchByAdobe in root component
-  constructor(angulartics2LaunchByAdobe: Angulartics2LaunchByAdobe) {
-    angulartics2LaunchByAdobe.startTracking();
-  }
-}
-```
-
-```ts
-// bootstrap
-import { Angulartics2Module } from 'angulartics2';
-import { Angulartics2LaunchByAdobe } from 'angulartics2';
-
-@NgModule({
-  imports: [
-    ...
-    // import Angulartics2LaunchByAdobe in root ngModule    
-    Angulartics2Module.forRoot();
-  ],
-})
-```
-
-## Setting Up Tags
-
-Once set up, Angulartics [usage](https://github.com/angulartics/angulartics2#usage) is the same regardless of provider. Route changes will be tracked using a "Direct call" Event named "pageTrack", and events or activities can be tracked using a "Direct call" Event named "eventTrack".
-
-Now is the time to setup tracking in Launch.  [Here is a post](http://webanalyticsfordevelopers.com/2018/11/06/basic-tracking-remix-contains-launch/) explaining how a basic tracking setup can be done.
-
-_For detailed instructions on how to send tracking events in a component or in a template check out the documentation for [Tracking Events](https://github.com/angulartics/angulartics2/wiki/Tracking-Events)._

package/providers/matomo/README.md

@@ -1,74 +0,0 @@
-<img 
-    src="../../../assets/svg/matomo.svg" 
-    alt="Matomo logo"
-    height="100px"
-    width="200px" />
-
-# Matomo
-__homepage__: [matomo.org](https://matomo.org)  
-__docs__: [developer.matomo.org](https://developer.matomo.org)  
-__import__: `import { Angulartics2Matomo } from 'angulartics2';`  
-
-## Setup
-Add the standard matomo track code inside your index.html head tag:
-```html
-<!-- Matomo -->
-<script type="text/javascript">
-  var _paq = _paq || [];
-  /* tracker methods like "setCustomDimension" should be called before "trackPageView" */
-  // _paq.push(['trackPageView']); // DELETE THIS LINE
-  _paq.push(['enableLinkTracking']);
-  (function() {
-    var u="//matomo.YOUR-DOMAIN.com/";
-    _paq.push(['setTrackerUrl', u+'matomo.php']);
-    _paq.push(['setSiteId', '11']);
-    var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
-    g.type='text/javascript'; g.async=true; g.defer=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
-  })();
-</script>
-<!-- End Matomo Code -->
-```
-Make sure "trackPageView" line is commented or deleted. It is not needed as page tracking will be trigger by the angular module on route change.
-
-Replace YOUR-DOMAIN with your matomo domain (`//DOMAIN.innocraft.cloud` if you are using the innocraft cloud service).
-
-Pass the Matomo provider to angulartics in app.module:
-```ts
-import { Angulartics2Module } from 'angulartics2';
-import { Angulartics2Matomo } from 'angulartics2';
-@NgModule({
-  imports: [
-    Angulartics2Module.forRoot(),
-    ...
-```
-
-Inject angulartics into your root component (usually appComponent)
-```ts
-import { Angulartics2Matomo } from 'angulartics2';
-export class AppComponent {
-  // inject Angulartics2Matomo in root component and initialize it
-  constructor(private angulartics2Matomo: Angulartics2Matomo) {
-    angulartics2Matomo.startTracking();
-  }
-}
-```
-
-Tracking Custom Variables
-```ts
-angulartics2.setUserProperties.next({index: 1, name: 'John', value: 123, scope: 'visit'});
-```
-Note: To track multiple custom variables, call setUserProperties multiple times
-
-Tracking Custom Dimensions
-```ts
-angulartics2.setUserProperties.next({
-    dimension1: 'v1.2.3',
-    dimension2: 'german',
-    dimension43: 'green',
-});
-```
-Note: Custom Variables and Custom Dimensions cannot be tracked in the same call, and requires separate setUserProperties calls
-
-To track full URLs if there is a hash (#), make sure to enable `settings=>websites=>settings=>page url fragments tracking` in the Matomo dashboard.
-
-Once set up, Angulartics [usage](https://github.com/angulartics/angulartics2#usage) is the same regardless of provider

package/providers/mixpanel/README.md

@@ -1,105 +0,0 @@
-<img
-    src="../../../assets/svg/mixpanel.svg"
-    alt="Mixpanel logo"
-    height="100px"
-    width="200px" />
-
-# Mixpanel
-
-**homepage**: [mixpanel.com](https://mixpanel.com/)  
-**docs**: [mixpanel.com/help/reference/javascript](https://mixpanel.com/help/reference/javascript)  
-**import**: `import { Angulartics2Mixpanel } from 'angulartics2';`
-
-## Setup
-
-1.  Add tracking code [provided by Mixpanel](https://mixpanel.com/help/reference/javascript) to right above the header closing tag `</header>`
-2.  [Setup Angulartics](https://github.com/angulartics/angulartics2/tree/next#installation) using `Angulartics2Mixpanel`
-
-## Integrating with NgRx:
-
-You have a chance to unburden the integration process if your system is using NgRx. Specifically, we can reuse the existing actions in our application and use effects to catch and dispatch a mixpanel action accordingly.
-
-### Boilerplating:
-
-```ts
-/**
- * Action definition
- */
-export const MIXPANEL_TRACK = '[MIXPANEL] Track';
-
-export class MixpanelTrack implements Action {
-  readonly type = MIXPANEL_TRACK;
-
-  constructor(public payload: MixPanelPayload) {}
-}
-
-export interface MixPanelPayload {
-  action: string;
-  properties?: MixPanelPayloadProperties;
-}
-
-export interface MixPanelPayloadProperties {
-  // Your custom properties go here
-}
-```
-
-### Catch and dispatch a mixpanel event by an effect:
-
-```ts
-import { Injectable } from '@angular/core';
-import { Actions, Effect } from '@ngrx/effects';
-import { Angulartics2Mixpanel } from 'angulartics2';
-
-import * as mixpanel from '../actions/mixpanel';
-
-@Injectable()
-export class MixpanelEffects {
-  @Effect({ dispatch: false })
-  mixpanelActionTracking$ = this.actions$
-    .ofType(mixpanel.MIXPANEL_TRACK)
-    .do((action: mixpanel.MixpanelTrack) => {
-      // ATTENTION HERE
-      this.angulartics2Mixpanel.eventTrack(action.payload.action, {
-        ...action.payload.properties,
-      });
-    });
-
-  constructor(
-    private actions$: Actions,
-    private angulartics2Mixpanel: Angulartics2Mixpanel,
-  ) {}
-}
-```
-
-### Usage:
-
-Somewhere in our application, we might have the code to dispatch a mixpanel action:
-
-```ts
-  @Effect()
-  someEffect$ = this.actions$
-    .ofType(some.ACTION)
-    .map(action => new mixpanel.MixpanelTrack({
-      action: action.type,
-      properties: {
-        category: 'Your Category',
-        labelOrWhatever: 'LabelHere',
-      }
-    }));
-```
-
-### Common error:
-
-The custom properties object should be a **new object**, otherwise the action will not be recorded successfully. For example the code below will be ignored by the server.
-
-```ts
-@Injectable()
-export class MixpanelEffects {
-  ...
-    .do((action: mixpanel.MixpanelTrack) => {
-      // reuse the existing properties is WRONG
-      this.angulartics2Mixpanel.eventTrack(action.payload.action, action.payload.properties);
-    });
-  ...
-}
-```

package/providers/pyze/README.md

@@ -1,21 +0,0 @@
-<img 
-    src="../../../assets/svg/pyze.svg" 
-    alt="pyze analytics logo"
-    height="100px"
-    width="200px" />
-
-# Pyze 
-
-__homepage__: [pyze.com](https://www.pyze.com/)  
-__docs__: [docs.pyze.com/web.html](https://docs.pyze.com/web.html)  
-__import__: `import { Angulartics2Pyze } from 'angulartics2';`  
-
-## Setup
-
-1. Add [tracking code provided by Pyze](https://docs.pyze.com/web.html#add-code-in-your-web-or-saas-app-to-use-the-pyze-sdk) inside the header tag.
-
-2. Remember to replace `YOUR_PYZE_APP_KEY` placeholder with the [Pyze App Key](https://docs.pyze.com/web.html#get-pyze-app-key) obtained from [growth.pyze.com](https://growth.pyze.com)
-
-   Note: You don't have to use `Pyze.postPageView("PageTitle", "Page URL");` api separately as it is called by angulartics for each page transition. 
-
-3. [Setup Angulartics](https://github.com/angulartics/angulartics2/tree/master#installation) using `Angulartics2Pyze`

package/providers/segment/README.md

@@ -1,50 +0,0 @@
-<img 
-    src="../../../assets/svg/segment.svg" 
-    alt="Segment logo"
-    height="100px"
-    width="200px" />
-
-# Segment
-__homepage__: [segment.com](https://segment.com/)  
-__docs__: [segment.com/docs/sources/website/analytics.js](https://segment.com/docs/sources/website/analytics.js/)  
-__import__: `import { Angulartics2Segment } from 'angulartics2';`  
-
-## Setup
-1. Add `Angulartics2Module` to your root NgModule passing an array of providers to enable
-```ts
-import { NgModule } from '@angular/core';
-import { BrowserModule } from '@angular/platform-browser';
-import { RouterModule, Routes } from '@angular/router';
-
-import { Angulartics2Module } from 'angulartics2';
-import { Angulartics2Segment } from 'angulartics2';
-
-const ROUTES: Routes = [
-  { path: '',      component: HomeComponent },
-  { path: 'about', component: AboutComponent },
-];
-
-@NgModule({
-  imports: [
-    BrowserModule,
-    RouterModule.forRoot(ROUTES),
-
-    // added to imports
-    Angulartics2Module.forRoot([Angulartics2Segment]),
-  ],
-  declarations: [AppComponent],
-  bootstrap: [AppComponent],
-})
-```
-2. __Required__: Import your providers in the root component. This starts the tracking of route changes.
-```ts
-// component
-import { Angulartics2Segment } from 'angulartics2';
-
-@Component({  ...  })
-export class AppComponent {
-  constructor(angulartics2Segment: Angulartics2Segment) {
-    angulartics2Segment.startTracking();
-  }
-}
-```

package/providers/splunk/README.md

@@ -1,57 +0,0 @@
-<img 
-    src="../../../assets/svg/splunk.svg" 
-    alt="Splunk logo"
-    height="100px"
-    width="200px" />
-
-# Splunk
-__homepage__: [splunk.com](https://www.splunk.com/)  
-__docs__: [Splunk Collector API](https://github.com/splunk/splunk-demo-collector-for-analyticsjs#api)
-__import__: `import { Angulartics2Splunk } from 'angulartics2';`  
-
-## Setup
-1. Add tracking code [provided by Splunk](https://www.splunk.com/blog/2013/10/17/still-using-3rd-party-web-analytics-providers-build-your-own-using-splunk.html) to right above the `</head>` closing tag. 
-  ```
-  <script type="text/javascript"> var sp=sp||[];(function(){var e=["init","identify","track","trackLink","pageview"],t=function(e){return function(){sp.push([e].concat(Array.prototype.slice.call(arguments,0)))}};for(var n=0;n<e.length;n++)sp[e[n]]=t(e[n])})(),sp.load=function(e,o){sp._endpoint=e;if(o){sp.init(o)};var t=document.createElement("script");t.type="text/javascript",t.async=!0,t.src=("https:"===document.location.protocol?"https://":"http://")+"d21ey8j28ejz92.cloudfront.net/analytics/v1/sp.min.js";var n=document.getElementsByTagName("script")[0];n.parentNode.insertBefore(t,n)};
-  sp.load("https://www.example.com"); // Replace with your own collector URL
-  </script>
-  ```
-  In the last line of above script, make sure to replace https://www.example.com with the address of your data collector.
-  
-2. [Setup Angulartics](https://github.com/angulartics/angulartics2/tree/next#installation) using `Angulartics2Splunk`.
-```ts
-import { NgModule } from '@angular/core';
-import { BrowserModule } from '@angular/platform-browser';
-import { RouterModule, Routes } from '@angular/router';
-
-import { Angulartics2Module } from 'angulartics2';
-
-const ROUTES: Routes = [
-  { path: '',      component: HomeComponent },
-  { path: 'about', component: AboutComponent },
-];
-
-@NgModule({
-  imports: [
-    BrowserModule,
-    RouterModule.forRoot(ROUTES),
-
-    // added to imports
-    Angulartics2Module.forRoot(),
-  ],
-  declarations: [AppComponent],
-  bootstrap: [AppComponent],
-})
-```
-3. __Required__: Import your providers in the root component. This starts the tracking of route changes.
-```ts
-// component
-import { Angulartics2Splunk } from 'angulartics2';
-
-@Component({  ...  })
-export class AppComponent {
-  constructor(angulartics2Splunk: Angulartics2Splunk) {
-    angulartics2Splunk.startTracking();
-  }
-}
-```

package/providers/woopra/README.md

@@ -1,12 +0,0 @@
-<img 
-    src="../../../assets/svg/woopra.svg" 
-    alt="Woopra logo"
-    height="100px"
-    width="200px" />
-
-# Woopra
-__homepage__: [woopra.com](https://www.woopra.com/)  
-__docs__: [woopra.com/docs/setup/javascript-tracking/](https://www.woopra.com/docs/setup/javascript-tracking/)  
-__import__: `import { Angulartics2Woopra } from 'angulartics2';`  
-
-## Setup