Mobile Architecture Overview
Contents |
Mobile Architecture
Openbravo Core Mobile Infrastructure is an Openbravo module which extends the Openbravo Platform with HTML5-based mobile UI capabilities.
It provides an infrastructure that allows for the development of mobile web applications on top of Openbravo. Openbravo mobile web applications are optimized for mobile devices and touch screens, and can be offline-capable.
Here is a general view of the architecture:
Mobile Core Infrastructure
It is the module that provides, on top of Openbravo 3, all the infrastructure required to build mobile applications.
Server side
As you can see in the previous image, the server side of Mobile Core is an extension (using module) of Openbravo ERP. We have included some components to provide data and resources to the client side.
- Component provider
- Takes the responsability to serve resources to the client side. It can be extended by other modules.
- Datasource
- This components provides data to the client parts and process the data which come from client side to be included in the ERP.
Client side
We will explain the different technologies that we have used to build Mobile Core and what is the proposal of each one.
- enyojs - http://www.enyojs.com
- enyojs is a javascript application framework sponsored by HP. Using it we have created the components which conforms the windows of Openbravo Web POS. Enyojs also provides a useful event management tool which allow us to trigger an event to be handled by another enyo component. One of the best things of Enyojs is the capability to extend or overwrite each components, it help us to customize components using an Openbravo ERP module.
- onyx
- onys is a toolbox of UI enyo components. We use some of them to build our layout.
- UI Components
- based on the two libraries explained in the previous sections, we have created a set of common ui components (such as buttons, menus, keyboard, etc.) to be reused by different applications
- Layout
- using onyx's Panels, we have created a multicolumn layout. Depending on the device resolution it shows multi column or single column in this way the applications are usable even in small devices.
- Backbone - http://backbonejs.org/
- Backbone.js is a JavaScript framework that allows you to structure your JavaScript code in an MVC(Model, View, Controller) paradigm. In our particular case we have used backbone to work with data (models and collections). A model provide functionality for managing changes using its own methods and event handlers.
- Underscore - http://underscorejs.org/
- Backbone depends on underscore. This library provides interesting tools to work with collections.
- WebSQL - http://www.w3.org/TR/webdatabase/
- This technology allow us to store big data in the client side and access to it easily and faster. This data will be retrieved from server (thanks to datasource) and stored in WEBSQL database. When the data is saved we can read it using dal.
- Client DAL
- DAL is one of the most important parts of Openbravo ERP. It helps to easily interact with database, in fact, it is used in the server side components. To access to WEBSQL stored data a client side DAL has been created. It allow us to manage WEBSQL database easily.
- Client Datasource
- Datasource is a concept which involves the tools that allow us to communicate with the server in order to send or retrieve data easily from the client side.
Mobile Application
On top of Mobile Core Infrastructure module, mobile applications can be built.