Skip to content

Capacitor installation instructions

Requirements

This setup assumes you have already setup your App Key on the Dashboard

The Capacitor NPM is available here https://www.npmjs.com/package/capacitor-plugin-pointzi

Integration Steps

Step 1 - Install dependencies

Install dependencies for Pointzi plugin.

1
2
3
4
5
6
npm i com.darktalker.cordova.screenshot
npm i cordova-plugin-app-version
npm i cordova-plugin-device
npm i cordova-plugin-device-name
npm i cordova-plugin-dialogs
npm i cordova-plugin-network-information

Step 2 - Installation

Install Pointzi in your Capacitor project. Run this command in a console.

1
npm i capacitor-plugin-pointzi

Step 3 - Setup assets

You need copy asset files of plugin into your dist folder with following structure "/capacitor-plugin-pointzi/assets/". For example:

1
https://localhost/capacitor-plugin-pointzi/assets/example.png

You can do that by edit your build configuration file. Assume that you are using angular, so you put this code into assets configuration section inside angular.json:

1
2
3
4
5
{
  "glob": "**/*",
  "input": "node_modules/capacitor-plugin-pointzi/src/assets",
  "output": "./capacitor-plugin-pointzi/assets"
}

When you have done, it looks like:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
{
  "projects": {
    "app": {
      "architect": {
        "build": {
          "options": {
            "assets": [
              {
                "glob": "**/*",
                "input": "node_modules/capacitor-plugin-pointzi/src/assets",
                "output": "./capacitor-plugin-pointzi/assets"
              }
            ]
          }
        }
      }
    }
  }
}

Step 4 - Pointzi initialisation

Add this code into constructor of your root component. For example, assuming you use angular, your root component file is app.component.ts.

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
import { Plugins, StatusBarStyle } from '@capacitor/core';
import 'capacitor-plugin-pointzi';

const { Pointzi } = Plugins;

export class AppComponent {
  constructor(private platform: Platform) {
    this.initializeApp();
  }

  async initializeApp() {
    Pointzi.load().then(function () {
        // SH_CUID is optional.
        // You can set it later by sending sh_cuid tag. It is string tag.
      Pointzi.register(APP_KEY, SH_CUID).then(function () {
        // Example of sending a string Tag
        Pointzi.tag({
          key: 'first_name',
          string: 'My First Name',
        });
      });
    });
  }
}

Note

To get your APP_KEY, go to dashboard.pointzi.com, where you can see it's name at the top left of the screen. SH_CUID is the name you want to give to your install-id. This name is up to you. For more info visit the Tagging documentation. When you call register method, SH_CUID is optional, you can set it later by sending sh_cuid tag, it is a string tag.

User Tagging

You can tag users/devices from your SDK in one line of code.

The SDK looks after the details for the device, you just supply the tag key and value:

  • The tag name (key) is what you want to call it. In the example below "Plan-49" is how you will see this in the Pointzi Dashboard.
  • Pointzi supports tags of: string, numeric and datetime. In the example below, the value for "Plan-49" is "Trial-Period".

String Tags

1
2
3
let key = "Plan-49";
let value = "Trial-Period";
Pointzi.tag.string(key, value);

Numeric Tags

1
2
3
let key = "BidValue";
let value = 549;
Pointzi.tag.numeric(key, value);

Datetime Tags

1
2
3
4
5
6
7
8
9
// Tagging using predefined StreetHawk tag.
let key = "sh_registered";
let value = new Date();
Pointzi.tag.datetime(key, value);

// Tagging using custom tag.
let key = "Birthday";
let value = new Date();
Pointzi.tag.datetime(key, value);

Increment Tag Value

1
2
let key = "PageVisited";
Pointzi.tag.increment(key);