Git Product home page Git Product logo

nwjs-analytics's Introduction

nwjs-analytics

Node-Webkit Google Analytics integration

Simple integration of Google Analytics Application (named Analytics for Mobile Apps) into Node-Webkit application

Installation

include analytics.js in your index.html file

<script src="analytics.js"></script>

Setup

Set your tracking ID, application name and application version in analytics.js file

var analytics = {
    trackID: 'UA-XXXXXX-X', //tracking id
    appName: 'appname',  //application name
    appVersion: '1.0.0',
    ...

If you are using a User-ID traking set userID

var analytics = {
    ...
    userID: 'john-smith',
    ...

or at runtime process

analytics.userID = 'john-smith';

otherwise will be generate a random client id

If you want to change clientID you can use this:

var analytics = {
    ...
    clientID: 'mac-01',
    ...

or at runtime process

analytics.clientID = 'mac01';

Usage

Screen View

analytics.screenView('login');

Event

analytics.event('category', 'action', 'label', 'value');

Exception

analytics.event('NotFoundError', 0); //second parameters is fatal flag

Timing

var startTime = new Date().getTime();
...
var endTime = new Date().getTime();
var timeSpent = endTime - startTime;
analytics.timing('category', 'variable', timeSpent, 'label');

Ecommerce

Currency setup

var analytics = {
    ...
    currency: "USD",
    ...

or at runtime process

analytics.currency = "USD";

To send ecommerce data

var order_id = "O145KL";
var total = 15.20;
var item = [
    {id: 40,name: "item1", price: 15.00, qty: 1},
    {id: 12,name: "item2", price: 0.20, qty: 1}
]
ecommerce.transactionID = "O145KL"; //optional, if is not set a random id will be generate
ecommerce.transaction(total, items)

Custom API

Check Working with the Measurement Protocol page

var data = {
    't' : 'event',
	'ec' : 'category',
	'ea' : 'action'
}
analytics.custom(data);

Extra

Debug Mode

You can set debug property true in analytics.js file to check hit parsing

var analytics = {
    ...
	debug: true,   
	...

output example

{
  "hitParsingResult": [ {
    "valid": true,
    "parserMessage": [ ],
    "hit": "/debug/collect?v=1\u0026tid=UA-XXXXXX-X\u0026cid=M1RWD\u0026an=application\u0026av=1.0.0\u0026t=screenview\u0026cd=login"
  } ],
  "parserMessage": [ {
    "messageType": "INFO",
    "description": "Found 1 hit in the request."
  } ]
}

Note: data will be not collect in debug mode

Performance Tracking

You can set performanceTracking property true in analytics.js file to automatically send load page timing

var analytics = {
    ...
	performanceTracking: true,   
	...

enabled by default

Error Tracking

You can set errorTracking property true in analytics.js file to automatically send exception

var analytics = {
    ...
	errorTracking: true,   
	...

enabled by default

AngularJS ui-router integration

App.run(['$rootScope', function($rootScope) {
    $rootScope.$on('$stateChangeSuccess', function(event, toState, toParams, fromState, fromParams){
        analytics.screenView(toState.name);
    })
}]);

AngularJS ngRoute integration

App.config(['$routeProvider', function($routeProvider) {
    $routeProvider
        .when('/', {
            title: "Dashboard", //set view title
            templateUrl: './views/dashboard.html',
            controller: 'dashboardCtrl'
        })
}]);
App.run(['$rootScope', function($rootScope, $route) {
    $rootScope.$on('$routeChangeSuccess', function() {
        if($route.current.title) analytics.screenView($route.current.title); //screenView value is Dashboard
    });
}]);

Useful Links

Google Analytics Collect API: Working with the Measurement Protocol

Hit builder and testing tool: Hit Builder

License

MIT

nwjs-analytics's People

Contributors

daaru00 avatar divineomega avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.