[Sugar-devel] Sugar Activity template for HTML5/Enyo

lionel at olpc-france.org lionel at olpc-france.org
Sat Aug 25 16:50:17 EDT 2012


 

Hi all,

 

I've enhanced the work of Manuel Quinones to create an activity template
using Enyo JavaScript Framework.

 

My objective was to provide a template to write a Sugar activity using HTML5
but without losing advantage of the Sugar integration. Plus, I didn't want
using a HTTP Server integrated into the activity like in the Wikipedia
activity.

 

Finally, using some WebKit tips & tricks (calling a JavaScript in the
current page and console message handling), I finally conceived a simple
framework that allow bi-directional communication between Python code and
JavaScript code (using Enyo Framework). You could find the resulting source
code from this framework here [1] for Python and here [2] for JavaScript.

 

To test this framework, I wrote a sample activity (downloadable here [3])
with a part of the activity wrote in HTML5 and the other part wrote in
Python. I've illustrated the power of this framework with few features:

- Sending basic type or full python object to JavaScript,

- Sending basic type or full JavaScript object to Python,

- JavaScript Enyo controls (Checkbox and Slider) synchronized with matching
Gtk control,

- Passing of Sugar context (buddy nickname and color) to JavaScript,

- Using Sugar toolbar to launch JavaScript event,

- Handling a HTML5 canvas (a small Logo Turtle ;-) from Gtk button.

A screen capture of the activity is visible here [4].

 

I think it's a good start to show what we could hope from this sort of
integration and finally, to have more HTML5 developers writing or adapting
activities to Sugar.

 

Lot of thing could be done to enhance this basic framework. I hope to have
time to write a real activity to work on some other interesting stuff:

- Read/Write from Sugar Journal from JavaScript

- Use POT localization for HTML5 resource

- Using Sugar presence from JavaScript

- ...

 

Hope that some of you could be interested by this.

 

Best regards from France.

 

                   Lionel.

 

 

[1]
<http://git.sugarlabs.org/enyo-activity/enyo-activity/blobs/master/enyo.py>
http://git.sugarlabs.org/enyo-activity/enyo-activity/blobs/master/enyo.py

[2]
<http://git.sugarlabs.org/enyo-activity/enyo-activity/blobs/master/html/suga
r.js>
http://git.sugarlabs.org/enyo-activity/enyo-activity/blobs/master/html/sugar
.js

[3]  <http://olpc-france.org/download/enyo-1.xo>
http://olpc-france.org/download/enyo-1.xo

[4]  <http://olpc-france.org/download/enyo-1_capture.png>
http://olpc-france.org/download/enyo-1_capture.png

 

-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.sugarlabs.org/archive/sugar-devel/attachments/20120825/6a177147/attachment.html>


More information about the Sugar-devel mailing list