inhabit-module-base

inhabit-module-base

A base module for building an InHabit Module.

Installation

npm install --save-dev inhabit-module-base

Usage ES5

var InhabitModuleBase = require('inhabit-module-base');

function MyModule(configuration, dependencies) {
    InhabitModuleBase.call(this, configuration, dependencies);
    
    ...
}

MyModule.prototype = Object.create(InhabitModuleBase.prototype);
MyModule.prototype.constructor = MyModule;
...

InhabitModuleBase.publish(MyModule);

You have access to next features of Inhabit through base class:

JQuery

    this.$;

Handlebars

    this.handlebars;

Semantic service

    this.textClassificationService; 

AB tests

    this.abTestManager;

AB test manager allows you to extend your object properties and add AB test support for them For example you have property:

    var myTitle = this.configuration.title;

that you recieve from json configuration delivered by Inhabit platform

    {
      "modules": [
        {
          "id": "myModule",
          "title":"My Title"
        }
      ]
    }

If you want to AB test this property, simply change you json to this

  {
      "modules": [
        {
          "id": "myModule",
          "title":{
          // id of abTest should be gloabally unique, it is good to 
          // name it according to what you test and add date when you added test
            "abTest":"testTitle-01/21/2017", 
            // experiment explanation, contains array of arrays with desired values and probability of their appearence for the use. 
            // at this case 50% time you will see "Click me" and another 50% "My Title"
            "experiment":[
              ["Click me!",0.5],
              ["My title",0.5]
            ],
            // if referesh property set to true, user will see new result each time he refresh the page. I false, 
            // user will always see value that he seen at first time. For example if he seen "Click me!" title he will 
            // see this title all the time during the test.
            "refresh":true
          }
        }
      ]
  }

And then at your code:

    var myTitle = this.abTestManager.getSetting(this.configuration.title);

That's it now AB test will automatically set proper value based on you weights If you will reveret your configration to the previous one without AB test in it, there no need to change code, it will still work properly. So next time you will need to run abTest, you will need just change configuration.

You can use ABTest manager for any javascript object if you want;

Logger

    this.logger;

Logger - built-in logger can be enabled in production through specific configuration, allows you debug your application in production. Logger logs to browser console and enabled by default in dev environment, while disabled in production. Using this logger allow you to keep all your logging code and be silent in production environment

Usage:

    this.logger("simple console log");
    this.logger({h: "header", c:'r', type: 'error'}, "console log with header");
    this.logger({h: "header", c:'r', type: 'error'}, "console log with header","some additional details can be provided here");

Events

    this.events

Ready

Call this method when interactive loaded all required resources and ready to be displayed to the user

    this.events.ready(message)

message[optional] - if you need any message attached to the ready event, this message can be later used in analytics dashboard for example

Error

Call this method if any error appears in your application. This will help to track them down and make your application better

    this.events.error(message)

message[optional] - if you need any message attached to the error event, this message can be later used in analytics dashboard for example

InteractionStart

Call this method when user performs first interaction with application. This event should be called once per application lifetime

    this.events.interactionStart(message)

message[optional] - if you need any message attached to the interactionStart event, this message can be later used in analytics dashboard for example

CycleStart

Call this method when user starts iteration/cycle/sequence of logic in your application

    this.events.cycleStart(message)

message[optional] - if you need any message attached to the cycleStart event, this message can be later used in analytics dashboard for example

CycleEnd

Call this method when user end iteration/cycle/sequence of logic in your application

    this.events.cycleEnd(message)

message[optional] - if you need any message attached to the cycleEnd event, this message can be later used in analytics dashboard for example

Custom

You can use this event to propagate any custom messages for analytics purposes

    this.events.custom(name, message)

name - name of the event message[optional] - if you need any message attached to the custom event, this message can be later used in analytics dashboard for example

Run method this.events.refreshAd() on user click if you want to refresh ad block inside the InHabit, it will fire event:

this.events.refreshAd

ModalPopup

    this.modalPopup

Open popup window with your custom url, use method:

this.modalPopup.open('your url')

Open terms of service popup window, use method:

this.modalPopup.openTermsOfService()