inhabit-module-base

inhabit-module-base

A base module for building an InHabit Module.

###TOC

• Installation
• Usage
• JQuery
• Handlebars
• Semantic service
  • Taxonomy
  • Entities
  • Keywords
• AB tests
• Logger
• Events
  • Ready
  • Error
  • InteractionStart
  • CycleStart
  • CycleEnd
  • Custom
• Modal popup
• Resources root

Installation

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

Usage

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

    dependencies.$;

Handlebars

    dependencies.handlebars;

Semantic service

This service allows you to grab contextual information about your page for later use.

    dependencies.textClassificationService; 

Taxonomy

getTaxonomy method returns promise that results into the array of taxonomy information about this page.

    dependencies.textClassificationService.getTaxonomy().then(function(taxonomy){
        
    })

where "taxonomy" is array:

[
    {
        "values": [
            "sports",
            "football"
        ],
        "score": 0.990101
    },
    {
        "values":[
            "business and industrial",
            "logistics",
            "freight train"
        ],
        "score":0.36197
    }
    ...
]

vales in this case are dependent from each other, you should read them like this sports->football; business and industrial->logistics->freight train For full list of available taxonomy please look this document Taxonomy reference

Entities

getEntities - method returns promise that results into array of entities relevant to this page.

    dependencies.textClassificationService.getEntities().then(function(entities){
        
    })

where "entities" is array:

    {
        "values": [
            "Matt Jones"
        ],
        "score": 0.82653,
        "type": "Person"
    },
    {
        "values": [
            "Coach Jay Gruden"
        ],
        "score": 0.668899,
        "type": "Person",
        "misc": {
            "subType": [
                "FootballPlayer",
                "SportsOfficial"
            ],
            "name": "Jay Gruden"
        }
    }

List of available types and sub types

Keywords

getKeywords - method returns promise that results into array of keywords, keywords are broader view of text than entities and taxonomy based on words that could be used to describe meaning of the text

    dependencies.textClassificationService.getKeywords().then(function(keywords){
        
    })

where "keywords" is array:

[
    {
        "values": [
            "Monday night"
        ],
        "score": 0.926018
    },
    {
        "values": [
            "Coach Jay Gruden"
        ],
        "score": 0.746022
    }
]

AB tests

    dependencies.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 = configuration.title;

that you receive 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 = dependencies.abTestManager.getSetting(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

     dependencies.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:

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

don't forget to enable DevMode as well

<script async="" ... data-ark-log="true" src="//widgetapi-inhabit.as.arkadiumhosted.com/Widget/v1"></script>

Events

    dependencies.events

Ready

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

    dependencies.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

    dependencies.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

    dependencies.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

    dependencies.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

    dependencies.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

    dependencies.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

    dependencies.modalPopup

Open popup window with your custom url, use method:

dependencies.modalPopup.open('your url')

Open terms of service popup window, use method:

dependencies.modalPopup.openTermsOfService()

Resources root

Provides absolute url to your resources root. Use this to reference all images and other resources you will use in your code

dependencies.resourcesRoot;