Saturday, May 24, 2014

The first steps

Its been around a month and yes we do have made some significant progress.

To start with we basically need to follow the following basic steps for building our cordova wrapper  :

The first of these is there and the second we leave for the end.Coming to the bridging work, its foundation has already been laid by the sugar web framework.

Our aim now is to provide a common cordova api in front and the native backend support for it.We look for what are the elements required in the basic cordova.js. 
cordova.js is the javascript file that is incorporated in every cordova project on the web code front. It basically contains all the cordova libraries along with the code that interacts with the native side of each platform.This code is to be specific to each platform.Have a look here : cordova-js code.The common directory there contains all the code that is common to all the platforms.It gives a basic front layer after which we need to set up a layer which can interact with our native side.

With all the common code being in common directory and native code in the platform specific directory, a cordova.js specific to each platform is then generated by the packager tool.It basically concatenates all the code in the common directory with the platform specific code to generate a cordova.<platform>.js files.

Lets dive into some more details.Our main function that communicates with native side lies in the exec.js file under the <platform> directory in src folder of cordova-js project.We have a function in exec.js named <platform>Exec that communicates with the native side. It has the following arguments : success,fail,service,action,args. success specifies the successhandler that is executed on successful execution of the call to native while fail denotes the errorhandler for the same.Service specifies the class we need to call, for example to implement the call to the accelerometer to get the current acceleration we shall give a call out to the Accelerometer class.See the example here.So the class to which the call is made is defined by the plugin itself.action specifies the function called,like here the function start is called for the class accelerometer with no arguments.

Also apart from exec.js we have a mandatory platform.js which is kind of a MANIFEST which specifies the details regarding the platform.

So after joining the basic files of cordova and the code specific to the platform we have the cordova.js for the platform ready, here's sugar's basic implementation of cordova.js.

cordova.js will basically help us to initiate a call to the native side of the platform using an exec function like here and handle the response through the success and error handlers passed as the first and the second arguments of the exec function.

The minimal implementation of exec.js for sugar can be represented as follows :

var cordova = require('cordova'),
    utils = require('cordova/utils'),
    base64 = require('cordova/base64'),
    bus = require('cordova/sugar/bus');
function sugarExec(success, fail, service, action, args) {
    for (var i = 0; i < args.length; i++) {
        if (utils.typeName(args[i]) == 'ArrayBuffer') {
            args[i] = base64.fromArrayBuffer(args[i]);
    var callbackId = service + cordova.callbackId++,
        argsJson = JSON.stringify(args);
    if (success || fail) {
        cordova.callbacks[callbackId] = {success:success, fail:fail};
function onResponseReceived(error, result) {
if (!error ) {
} else {
console.log("Its error");
module.exports = sugarExec;

To enable cordova.js to communicate with the native environment we need the help of bus and env.js files from the sugar web framework.

As the format in which a module is defined in cordova is different from the sugar web framework one , we need to find out a way to keep both the files at single place and generate the other set from a single copy of the files.This task has been put into the TODO list as of now.

As a result of playing around with the cordova framework inside sugar , we have been able to achieve the following results :

1. We are able to communicate with the native environment using cordova api's.So that means a call to cordova exec function would now work inside a sugar web activity and respond back with the appropriate result

2.Able to integrate the common cordova.js in the sugar framework.

3.Integrate the accelerometer plugin.