Welcome!

Welcome to the official BlackBerry Support Community Forums.

This is your resource to discuss support topics with your peers, and learn from each other.

inside custom component

Native Development

Reply
Highlighted
Developer
Posts: 111
Registered: ‎07-05-2012
My Device: none
My Carrier: MOvistar

Integrate HTML5 Localytics and BB10

Overview
I created a WebView that shows a simple HTML file index.html. In turn, this file loads Localyticsjavascript library localytics.js. In order to send info to Localytics, I call functions in index.html that communicate with this library. I can call them either from QML or from C/C++.

Step-by-Step in Qml
  1. Download Localytics javascript library from here. Extract the localytics.js file and put it in your project assets folder.
  2. Open localytics.js with an editor. Go to the jsonpSend function and add "http://" + in front of the address asigned to the src variable. So, the new line should be like this:

    src= "http://" + ref.__url__ ...

  3. Download the file index.html from here. Put it in your project assets folder, exactly in the same place where you put localytics.js.
  4. Open index.html with an editor. Change "YOUR APP KEY" string by your real app key string.
  5. Download the file LocalyticsWebView.qml file from here. Put it somewhere in your project assets folder.
  6. Open LocalyticsWebView.qml. Just check if the WebView url has the same location where you put index.html. If not, just modify the url or change the location of the html (and also .js) file.
  7. Declare a LocalyticsWebView QML component in the QML file from which you want to send info to Localyics. Do it this way:

    LocalyticsWebView 
    {
           id: localytics
    }

    If LocalyticsWebView.qml is not in the same folder where your qml file is, you would have to import the folder where LocalyticsWebView.qml is located (import "folderName").
  8. Anytime you want to open and upload a session in your QML just call this function:

    localytics.uploadSession();

    Anytime you want to tag an event in your QML just call this function:


    localytics.tagEvent("eventName", [ "attribute1", "attribute2", ... ]);
How to Do It in C/C++
You would have to do the previous steps from 1 to 4. Then you could declare a WebView or a WebPage object instance. Then make it load index.html and use evaluateJavaScript( ... ) function to call the two javascript functions (uploadSession() and tagEvent(...)) defined in index.html.

Example Project (Qml version)
You could download an example project from here. To make it work, remember to change "YOUR APP KEY" string by your real app key string in index.html.