CTI Integration

Integration into CTI is easy but requires a little bit of setup. Over time this process will become easier when full integration is actually supported, but right now we're using scripts to hoist the application into CTI.

The first thing you need to do is setup your application config from within CTI.

App Config

You will need to:

1. Add any custom CSS files you have in your build/css folder as stylesheets within CTI.

2. You will need to do the same for any custom scripts inside build/js that you may be using. This includes the skate.js script but you don't need to add the pouchdb.min.js script.

3. Attach any font or additional assests that your app requires.

4. Attach your boostrap script (see below).

5. Make sure your application script file is also attached, and that this is at the bottom of the app config screen (i.e. the last to be loaded).

Bootstrap Script

You will need a bootstrap script that will kick off your application on initial load inside CTI. This must also be attached via the config. A small example bootstrap script is below:

setTimeout(function () {

  var nodes = document.body.childNodes;

  for(var i = 0; i < nodes.length; i++) {

      if (nodes[i].nodeName === "DIV") {

          nodes[i].parentElement.removeChild(nodes[i]);
      }
  }

  var container = document.createElement("div");
  container.id = "body";

  document.body.appendChild(container);

  const trigger = function() {
      if (typeof MyApplicationManager === "undefined") {
          setTimeout(trigger, 200);
          return;
      }

      MyApplicationManager.triggerBootstrap();
  };

  trigger();
}, 500);

This isn't the most elegant solution but it works. Real CTI integration is a feature that will come at some point in the future.

CTI Config

You will also need to add at least one page to your CTI app. It doesn't need anything adding to it but it must exist.

Finally, you can configure your CTI App with some settings that may be required depending on your target audience.

Crosswalk

This should be enabled if you are targeting old Android devices. Specifically anything running a webview lower than Chrome 53. This is usually sub Android 5.0 devices.

Plugins

You will need to turn on any required plugins manually. For example, if your app uses the camera then you will need to enable the plugin that powers this.

Note

If you are targeting < Android 4.4 you will need to disable the Secure Settings plugin.