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  :

• Instantiate a chromeless browser. Examples include:
  • iOS WebView
  • Android WebView
  • The BlackBerry WebWorks framework instantiates its own chromeless browser
  • Windows Phone 7 WebBrowser
• Load packaged www assets (HTML/CSS/JS)
• Enable a bridge between native framework and the web view
• Integrate a new platform into the cordova-js project. This is a common API for sending messages and triggering error and success callbacks with native framework responses.
• Ensure the mobile-spec tests pass
• Update the documentation where applicable

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');

bus.listen();

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 ) {

cordova.callbackSuccess(callbackId,result);

} else {

console.log("Its error");

cordova.callbackError(callbackId,error);

}

}

  bus.sendMessage("activity.cordova",[service,action,args],onResponseReceived);

}

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.

Sugar says hello to cordova ;-)

Sugar labs - award-winning Sugar Learning Platform has been around for years now creating wonders in lives of many little ones and young, providing them with a window to a new world to explore new things. This fabulous open source community consists of some really cool and hard working people at the back end, thinking continuously about as to how to make sugar better than ever before.So here props up another idea.. why not make a cordova framework for sugar platform as android, windows and ios have ?? The obvious question that now arises in someone's mind who isnt yet familiar with cordova or phonegap would be - how is that gonna help sugar ? Well, the answer is pretty simple.All the activities and the code for sugar is currently in python because thats the language the software was made in.With cordova, all the web developers can make activities in html,css and js while not bothering about interaction with the physical hardware devices like camera etc.. the cordova wrapper would do that for you.Here's a small video explaining what phonegap/cordova is.

The cordova framework from sugar idea comes from the consistent development that has been done on the sugar web frontier which helps us to run web activities in sugar seamlessly using API in between which enable communication between python and javascript.You can check more about sugar web and its underlying architecture here.On similar yet a different front we wish to design the cordova framework.

Here's a simple view of how we want our cordova framework to look like. Though we might need to modify a bit here and there as we proceed but the basic architecture would be the same.

For the initial tasks of the project, we have decided to first build on the basic layer of cordova through which we can compile and get a basic sugar web template running. Once thats through, we can then add plugins.