Sugarizer is fully written in HTML5 and JavaScript.
Sugarizer is composed of three components:
Component | Description |
---|---|
Sugarizer Core | It implements the main Sugarizer UI (Home view, List view, Journal view, Neighborhood view) and is the launcher for all activities. |
Sugar-Web | It contains JavaScript libraries and CSS styles that expose UI and functions to handle Journal, collaboration and controls. |
Activities | It is the set of Pedagogic Activities included in Sugarizer. |
Component | Description(Detailed) |
---|---|
Sugarizer Core | It is independent of activities. Sugarizer Core has it's own index.html and redirects the browser to the index.html for activities when an activity is launched. The UI of Sugarizer Core uses the Enyo Framework and, like activities, rely on Sugar-Web to handle Journal and collaboration. |
Sugar-Web | It uses localStorage and IndexedDB features of the browser to store Journal content. localStorage is used to store metadata entries, IndexedDB is used to store data entries. localStorage also contains user settings. Sugar-Web uses Web Sockets for real-time communication (presence) with the server and XmlHttpRequest calls on the server REST API to handle remote Journal. Sugar-Web relies on require.js to handle JavaScript libraries dependencies. |
Activities | They must use Sugar-Web but could be written using any existing JavaScript framework. Most activities are written without any framework (vanilla JS ), some are written using ReactJS , Vue.js , Enyo or other frameworks. When an activity is called by Sugarizer Core, the QUERY_STRING contains a calling context. See the dedicated tutorial for more about activity development. |
The main conception rule of Sugarizer is that all platforms must share the same source code.
So Sugarizer runs the same JavaScript/HTML5 code whatever device used :
- Web
- Mobile
- Computer
To do that, the JavaScript/HTML5 code used for the web application is encapsulated into a container to be packaged as an application.
See below how it works ⬇️.
On Mobile Platforms such as Android or iOS, Sugarizer relies on Cordova to package the source code as a native application.
On Android, it's possible to build Sugarizer as a launcher to be able to run native applications directly from the Home view.
This feature is implemented in a dedicated Cordova plugin named cordova-plugin-sugarizeros.
On Desktop Platforms such as GNU Linux, Mac OS or Windows, Sugarizer relies on electron to package the source code as a native application.