Retail:Developers Guide/General Architecture Overview
Contents |
Web POS Architecture
Openbravo Web POS is a module of Openbravo ERP, that's why Openbravo Web POS take advantage of all of openbravo framework excluding the client side part, which has been designed to work with mobile devices and touch screens.
Here is a general view of Openbravo Web POS architecture:
|
|
Server side
As you can see in the previous image, the server side of Openbravo Web POS is an extension (using module) of Openbravo ERP. After RMP22 version of Openbravo Web POS a new layer has been included between Openbravo Web POS which is called Mobile Core Infrastructure, which provides an infrastructure to build mobile applications.
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 Openbravo Web POS 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 usefull event management tool which allow us to trigger an event to be handled by another enyo component. One of the best things of Enjojs is the capability to extend or overwrite each components, it help us to customize components using a openbravo ERP module.
- 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 importants part of Openbravo ERP. It helps to interact with database easily, 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 which allow us to communicate with server in order to send or retrieve data easily from the client side.
Hardware manager
Hardware manager is a standalone web server which is connected to the different devices (printers, scales, screens). The only requirement to install the hardware manager is to be connected with the different POS terminals. This server will receive documents or strings to be printed/showed in the different devices.
In the client side, when a print action is launched a template will be filled with the data . This filled template will be sent to the server side using jQuery ajax. Also is possible to retrieve data form server side (scales). It is done using an asynchronous call using jQuery ajax.
Hardware manager as proxy server
- Another functionality provided by hardware manager is as proxy. With this feature javascript programs can execute cross domain calls through the hardware manager. An Ajax call will be send from the JS application, HWManger will forward the info to the provided URL (as parameter)
$.ajax({
url: urlOfProxy, //hwmanager URL
data: {
url: url,
contenttype: 'text/xml;charset=utf-8',
content: dataToSend
},
dataType: 'json',
type: 'POST',
success: function (data){
//Add the payment when the confirmation is received.
//The information to save will depend on the payment provider
var paymentresult = {
TransactionID: data.Transaction.TransactionID,
ApprovedAmount: data.Transaction.ApprovedAmount,
CardNumberMasked: data.carddata.Card.MskPAN,
CardLogo: data.Card.CardLogo
//Void transaction will be excuted when the payment line is removed.
//VERY IMPORTANT TO REMOVE PAYMENTS
voidTransaction: function (callback) {
OB.ELPS.voidTransaction(this.paymentMethod, this, callback);
}
};
error: function () {
//Nothing to do
}
});
Back to Concepts