Added a few more screens

bzr revid: fva@openerp.com-20120503162746-lo7m3qno48jcanyz
This commit is contained in:
Frédéric van der Essen 2012-05-03 18:27:46 +02:00
parent 54152c805d
commit 05535cf4e9
5 changed files with 102 additions and 325 deletions

View File

@ -87,6 +87,7 @@ Main features :
'static/src/js/pos_models.js',
'static/src/js/pos_widgets.js',
'static/src/js/pos_devices.js',
'static/src/js/pos_screens.js',
'static/src/js/pos_main.js'
],
'css': ['static/src/css/pos.css'],

View File

@ -1,72 +1,97 @@
function openerp_pos_devices(module, instance){ //module is instance.point_of_sale
// this module interfaces with the local proxy to communicate to the various hardware devices
window.debug_devices = new (instance.web.Class.extend({
payment_status: 'waiting_for_payment',
weight: 0,
accept_payment: function(){ this.payment_status = 'payment_accepted'; },
reject_payment: function(){ this.payment_status = 'payment_rejected'; },
delay_payment: function(){ this.payment_status = 'waiting_for_payment'; },
}))();
// this object interfaces with the local proxy to communicate to the various hardware devices
// connected to the Point of Sale. As the communication only goes from the POS to the proxy,
// methods are used both to signal an event, and to fetch information.
module.ProxyDevice = instance.web.Class.extend({
//a product has been scanned and recognized with success
scan_item_succes: function(){
console.log('PROXY: scan item success');
},
//a product has been scanned but not recognized
scan_item_error_unrecognized: function(){
console.log('PROXY: scan item error');
},
//the client is asking for help
help_needed: function(){
console.log('PROXY: help needed');
},
//the client does not need help anymore
help_canceled: function(){
console.log('PROXY: help canceled');
},
//the client is starting to weight
weighting_start: function(){
console.log('PROXY: weighting start');
},
//returns the weight on the scale.
// is called at regular interval (up to 10x/sec) between a weighting_start()
// and a weighting_end()
weighting_read_kg: function(){
return Math.random() + 0.1;
console.log('PROXY: weighting read');
//return Math.random() + 0.1;
return window.debug_devices.weight;
},
// the client has finished weighting products
weighting_end: function(){
console.log('PROXY: weighting end');
},
// the pos asks the client to pay 'price' units
// method: 'mastercard' | 'cash' | ... ? TBD
// info: 'extra information to display on the payment terminal' ... ? TBD
payment_request: function(price, method, info){
console.log('PROXY: payment request:',price,method,info);
},
// is called at regular interval after a payment request to see if the client
// has paid the required money
// returns 'waiting_for_payment' | 'payment_accepted' | 'payment_rejected'
is_payment_accepted: function(){
return 'waiting_for_payment'; // 'payment_accepted' | 'payment_rejected'
console.log('PROXY: is payment accepted ?');
//return 'waiting_for_payment'; // 'payment_accepted' | 'payment_rejected'
return window.debug_devices.payment_status;
},
// the client cancels his payment
payment_canceled: function(){
console.log('PROXY: payment canceled by client');
},
// called when the client logs in or starts to scan product
transation_start: function(){
console.log('PROXY: transaction start');
},
// called when the clients has finished his interaction with the machine
transaction_end: function(){
console.log('PROXY: transaction end');
},
// called when the POS turns to cashier mode
cashier_mode_activated: function(){
console.log('PROXY:');
},
// called when the POS turns to client mode
cashier_mode_deactivated: function(){
console.log('PROXY:');
},
});

View File

@ -6,6 +6,8 @@ openerp.point_of_sale = function(instance) {
var module = instance.point_of_sale;
openerp_pos_models(module,instance); // import pos_models.js
openerp_pos_screens(module,instance); // import pos_screens.js
openerp_pos_widgets(module,instance); // import pos_widgets.js

View File

@ -357,278 +357,27 @@ function openerp_pos_widgets(module, instance){ //module is instance.point_of_sa
template:'pos-actionbar',
init: function(parent, options){
this._super(parent,options);
this.left_button_list = [];
this.right_button_list = [];
this.button_list = [];
},
start: function(){
window.actionbarwidget = this;
},
destroyButtons:function(position){
var button_list;
if(position === 'left'){
button_list = this.left_button_list;
this.left_button_list = [];
}else if (position === 'right'){
button_list = this.right_button_list;
this.right_button_list = [];
}else{
return this;
}
for(var i = 0; i < button_list.length; i++){
button_list[i].destroy();
destroy_buttons:function(){
for(var i = 0; i < this.button_list.length; i++){
this.button_list[i].destroy();
}
this.button_list = [];
return this;
},
addNewButton: function(position,button_options){
if(arguments.length == 2){
var button_list;
var $button_list;
if(position === 'left'){
button_list = this.left_button_list;
$button_list = $('.pos-actionbar-left-region');
}else if(position === 'right'){
button_list = this.right_button_list;
$button_list = $('.pos-actionbar-right-region');
}
add_new_button: function(button_options){
if(arguments.length == 1){
var button = new module.ActionButtonWidget(this,button_options);
button_list.push(button);
button.appendTo($button_list);
this.button_list.push(button);
button.appendTo($('.pos-actionbar-right-region'));
}else{
for(var i = 1; i < arguments.length; i++){
this.addNewButton(position,arguments[i]);
for(var i = 0; i < arguments.length; i++){
this.add_new_button(arguments[i]);
}
}
return this;
}
/*
renderElement: function() {
//this.$element.html(this.template_fct());
},*/
});
// ---------- Screens Widgets ----------
module.ScreenWidget = instance.web.Widget.extend({
init: function(parent, options){
this._super(parent, options);
},
show: function(){
if(this.$element){
this.$element.show();
}
},
hide: function(){
if(this.$element){
this.$element.hide();
}
},
});
module.ScreenSelector = instance.web.Class.extend({
init: function(options){
this.pos = options.pos;
this.screen_set = options.screen_set || {};
this.current_screen = options.current_screen ? this.screen_set[options.current_screen] : undefined;
this.default_screen = options.default_screen;
var current = null;
for(screen_name in this.screen_set){
var screen = this.screen_set[screen_name];
if(screen === this.current_screen){
current = screen;
}else{
screen.hide();
}
}
if(current){
current.show();
}
this.selected_order = this.pos.get('selectedOrder');
this.pos.bind('change:selectedOrder', this.load_saved_screen, this);
},
add_screen: function(screen_name, screen){
screen.hide();
this.screen_set[screen_name] = screen;
return this;
},
load_saved_screen: function(){
if(this.selected_order != this.pos.get('selectedOrder')){
var screen = this.pos.get('selectedOrder').get('screen') || this.default_screen;
this.selected_order = this.pos.get('selectedOrder');
this.set_current_screen(screen);
}
},
set_current_screen: function(screen_name){
var screen = this.screen_set[screen_name];
this.pos.get('selectedOrder').set({'screen':screen_name});
console.log('Set Current Screen: '+screen_name+' :',screen,'old:',this.current_screen);
if(screen && screen !== this.current_screen){
if(this.current_screen){
this.current_screen.hide();
}
this.current_screen = screen;
this.current_screen.show();
}
},
});
module.PaymentScreenWidget = module.ScreenWidget.extend({
template_fct: qweb_template('PaymentScreenWidget'),
init: function(parent, options) {
this._super(parent);
this.model = options.model;
this.pos = options.pos;
this.pos_widget = options.pos_widget;
this.pos.bind('change:selectedOrder', this.changeSelectedOrder, this);
this.bindPaymentLineEvents();
this.bindOrderLineEvents();
},
show: function(){
this._super();
this.setNumpadState(this.pos_widget.numpadView.state);
},
hide: function(){
this._super();
this.pos_widget.orderView.setNumpadState(null);
this.pos_widget.payment_screen.setNumpadState(null);
},
paymentLineList: function() {
return this.$element.find('#paymentlines');
},
back: function() {
console.log('back');
this.pos.screen_selector.set_current_screen('products');
},
validateCurrentOrder: function() {
var callback, currentOrder;
currentOrder = this.pos.get('selectedOrder');
$('button#validate-order', this.$element).attr('disabled', 'disabled');
this.pos.push_order(currentOrder.exportAsJSON()).then(_.bind(function() {
$('button#validate-order', this.$element).removeAttr('disabled');
return currentOrder.set({
validated: true
});
}, this));
},
bindPaymentLineEvents: function() {
this.currentPaymentLines = (this.pos.get('selectedOrder')).get('paymentLines');
this.currentPaymentLines.bind('add', this.addPaymentLine, this);
this.currentPaymentLines.bind('remove', this.renderElement, this);
this.currentPaymentLines.bind('all', this.updatePaymentSummary, this);
},
bindOrderLineEvents: function() {
this.currentOrderLines = (this.pos.get('selectedOrder')).get('orderLines');
this.currentOrderLines.bind('all', this.updatePaymentSummary, this);
},
changeSelectedOrder: function() {
this.currentPaymentLines.unbind();
this.bindPaymentLineEvents();
this.currentOrderLines.unbind();
this.bindOrderLineEvents();
this.renderElement();
},
addPaymentLine: function(newPaymentLine) {
var x = new module.PaymentlineWidget(null, {
model: newPaymentLine
});
x.on_delete.add(_.bind(this.deleteLine, this, x));
x.appendTo(this.paymentLineList());
},
renderElement: function() {
this._super();
this.$element.html(this.template_fct());
this.paymentLineList().empty();
this.currentPaymentLines.each(_.bind( function(paymentLine) {
this.addPaymentLine(paymentLine);
}, this));
this.updatePaymentSummary();
$('button#validate-order', this.$element).click(_.bind(this.validateCurrentOrder, this));
$('.oe-back-to-products', this.$element).click(_.bind(this.back, this));
},
deleteLine: function(lineWidget) {
this.currentPaymentLines.remove([lineWidget.model]);
},
updatePaymentSummary: function() {
var currentOrder, dueTotal, paidTotal, remaining, remainingAmount;
currentOrder = this.pos.get('selectedOrder');
paidTotal = currentOrder.getPaidTotal();
dueTotal = currentOrder.getTotal();
this.$element.find('#payment-due-total').html(dueTotal.toFixed(2));
this.$element.find('#payment-paid-total').html(paidTotal.toFixed(2));
remainingAmount = dueTotal - paidTotal;
remaining = remainingAmount > 0 ? 0 : (-remainingAmount).toFixed(2);
$('#payment-remaining').html(remaining);
},
setNumpadState: function(numpadState) {
if (this.numpadState) {
this.numpadState.unbind('setValue', this.setValue);
this.numpadState.unbind('change:mode', this.setNumpadMode);
}
this.numpadState = numpadState;
if (this.numpadState) {
this.numpadState.bind('setValue', this.setValue, this);
this.numpadState.bind('change:mode', this.setNumpadMode, this);
this.numpadState.reset();
this.setNumpadMode();
}
},
setNumpadMode: function() {
this.numpadState.set({mode: 'payment'});
},
setValue: function(val) {
this.currentPaymentLines.last().set({amount: val});
},
});
module.ReceiptScreenWidget = module.ScreenWidget.extend({
template: 'ReceiptScreenWidget',
init: function(parent, options) {
this._super(parent);
this.model = options.model;
this.pos = options.pos;
this.pos = options.pos;
this.user = this.pos.get('user');
this.company = this.pos.get('company');
this.shop_obj = this.pos.get('shop');
},
start: function() {
this.pos.bind('change:selectedOrder', this.changeSelectedOrder, this);
this.changeSelectedOrder();
$('button#pos-finish-order', this.$element).click(_.bind(this.finishOrder, this));
$('button#print-the-ticket', this.$element).click(_.bind(this.print, this));
},
print: function() {
window.print();
},
finishOrder: function() {
this.pos.get('selectedOrder').destroy();
},
changeSelectedOrder: function() {
if (this.currentOrderLines)
this.currentOrderLines.unbind();
this.currentOrderLines = (this.pos.get('selectedOrder')).get('orderLines');
this.currentOrderLines.bind('add', this.refresh, this);
this.currentOrderLines.bind('change', this.refresh, this);
this.currentOrderLines.bind('remove', this.refresh, this);
if (this.currentPaymentLines)
this.currentPaymentLines.unbind();
this.currentPaymentLines = (this.pos.get('selectedOrder')).get('paymentLines');
this.currentPaymentLines.bind('all', this.refresh, this);
this.refresh();
},
refresh: function() {
this.currentOrder = this.pos.get('selectedOrder');
$('.pos-receipt-container', this.$element).html(qweb_template('pos-ticket')({widget:this}));
},
});
module.WelcomeScreenWidget = module.ScreenWidget.extend({
});
module.ScanProductScreenWidget = module.ScreenWidget.extend({
});
module.ProductCategoriesWidget = instance.web.Widget.extend({
@ -743,45 +492,6 @@ function openerp_pos_widgets(module, instance){ //module is instance.point_of_sa
},
});
module.SearchProductScreenWidget = module.ScreenWidget.extend({
template:'SearchProductScreenWidget',
init: function(parent, options){
this._super(parent,options);
options = options || {};
this.pos = options.pos;
this.pos_widget = options.pos_widget;
},
start: function(){
this.product_categories_widget = new module.ProductCategoriesWidget(null,{
pos:this.pos,
});
this.product_categories_widget.replace($('.placeholder-ProductCategoriesWidget'));
this.product_list_widget = new module.ProductListWidget(null,{
pos:this.pos,
});
this.product_list_widget.replace($('.placeholder-ProductListWidget'));
},
show: function(){
this._super();
this.pos_widget.orderView.setNumpadState(this.pos_widget.numpadView.state);
},
hide: function(){
this._super();
this.pos_widget.orderView.setNumpadState(null);
this.pos_widget.payment_screen.setNumpadState(null);
},
});
module.ScaleInviteScreenWidget = module.ScreenWidget.extend({
});
module.ScaleProductSelectionScreenWidget = module.ScreenWidget.extend({
});
module.AskForMoneyScreenWidget = module.ScreenWidget.extend({
});
// ---------- PopUp Widgets ----------
@ -799,6 +509,8 @@ function openerp_pos_widgets(module, instance){ //module is instance.point_of_sa
module.TicketOrInvoicePopUp = module.PopUp.extend({
});
// ---------- OnScreen Keyboard Widget ----------
// A Widget that displays an onscreen keyboard.
// There are two options when creating the widget :
//
@ -994,6 +706,8 @@ function openerp_pos_widgets(module, instance){ //module is instance.point_of_sa
},
});
// ---------- Main Point of Sale Widget ----------
module.SynchNotification = instance.web.OldWidget.extend({
template: "pos-synch-notification",
init: function() {
@ -1061,6 +775,11 @@ function openerp_pos_widgets(module, instance){ //module is instance.point_of_sa
});
this.search_product_screen.appendTo($('#rightpane'));
this.scan_product_screen = new module.ScanProductScreenWidget(this,{
pos: this.pos,
pos_widget: this,
});
this.scan_product_screen.appendTo($('#rightpane'));
this.receipt_screen = new module.ReceiptScreenWidget(this, {
pos: this.pos,
@ -1068,13 +787,30 @@ function openerp_pos_widgets(module, instance){ //module is instance.point_of_sa
});
this.receipt_screen.appendTo($('#rightpane'));
this.payment_screen = new module.PaymentScreenWidget(this, {
pos: this.pos,
pos_widget: this,
});
this.payment_screen.appendTo($('#rightpane'));
this.welcome_screen = new module.WelcomeScreenWidget(this,{
pos:this.pos,
pos_widget: this,
});
this.welcome_screen.appendTo($('#rightpane'));
this.client_payment_screen = new module.ClientPaymentScreenWidget(this, {
pos: this.pos,
pos_widget: this,
});
this.client_payment_screen.appendTo($('#rightpane'));
this.scale_invite_screen = new module.ScaleInviteScreenWidget(this, {
pos: this.pos,
pos_widget: this,
});
this.scale_invite_screen.appendTo($('#rightpane'));
this.paypadView = new module.PaypadWidget(null, {
pos: this.pos
});
@ -1089,29 +825,28 @@ function openerp_pos_widgets(module, instance){ //module is instance.point_of_sa
});
this.orderView.$element = $('#current-order-content');
this.orderView.start();
this.action_bar = new module.ActionbarWidget(null);
this.action_bar.appendTo($(".point-of-sale #content"));
this.onscreen_keyboard = new module.OnscreenKeyboardWidget(null, {
'keyboard_model': 'simple'
});
this.onscreen_keyboard.appendTo($(".point-of-sale #content"));
this.pos.screen_selector = new module.ScreenSelector({
pos: this.pos,
screen_set:{
'products': this.search_product_screen,
'scan': this.scan_product_screen,
'payment' : this.payment_screen,
'client_payment' : this.client_payment_screen,
'scale_invite' : this.scale_invite_screen,
'receipt' : this.receipt_screen,
'welcome' : this.welcome_screen,
},
current_screen: 'products',
default_screen: 'products',
});
this.onscreenKeyboard = new module.OnscreenKeyboardWidget(null, {
'keyboard_model': 'simple'
});
this.onscreenKeyboard.appendTo($(".point-of-sale #content"));
this.action_bar = new module.ActionbarWidget(null);
this.action_bar.appendTo($(".point-of-sale #content"));
this.action_bar.addNewButton('left',{
label : 'Hello World',
icon : '/point_of_sale/static/src/img/icons/png48/face-monkey.png',
click : function(){ console.log("Hello World!"); }
current_screen: 'welcome',
default_screen: 'welcome',
});
this.pos.barcode_reader.connect();

View File

@ -218,26 +218,40 @@
</div>
</t>
<!-- ************ WELCOME SCREEN ************ -->
<t t-name="WelcomeScreenWidget">
<div class="welcome-screen">
<div class="welcome-screen step-screen">
<header><h2>WELCUM</h2></header>
<p> plz scan ur card or thingie </p>
</div>
</t>
<t t-name="AskForMoneyScreenWidget">
<div class="askformoney-screen">
<t t-name="ScanProductScreenWidget">
<div class="scan-product-screen step-screen">
<header><h2>SCAN YOUR PRODUCT</h2></header>
<p> please scan another product ! fun !</p>
</div>
</t>
<t t-name="ClientPaymentScreenWidget">
<div class="scan-product-screen step-screen">
<header><h2>GIMME UR MONEY!!!11</h2></header>
<p> It's a rubbery </p>
</div>
</t>
<t t-name="ScaleInviteScreenWidget">
<div class="scale-invite-screen">
<div class="scale-invite-screen step-screen">
<header><h2>Put ur loot on the scale</h2></header>
<p> Is it worth a ton ? </p>
</div>
</t>
<t t-name="ScaleProductSelectionScreenWidget">
<div class="scale-product-selection-screen">
<span class="placeholder-ProductCategoriesWidget" />
<span class="placeholder-ProductListWidget" />
</div>
</t>