[WIP] point_of_sale, pos_restaurant: continued refactor

 - this time it's the restaurant module that has been refactored
 - the point of sale extensions points have been reviewed to be more
   constistent and allow conditional extensions.
 - the chrome subwidgets are instanciated before screens, so that
   screens can manipulate them if needed.

10 files changed, 156 insertions, 165 deletions

diff --git a/addons/point_of_sale/static/src/js/chrome.js b/addons/point_of_sale/static/src/js/chrome.js
index 7daa2999fb0..cec8ed3bb3a 100644
--- a/addons/point_of_sale/static/src/js/chrome.js
+++ b/addons/point_of_sale/static/src/js/chrome.js
@@ -534,7 +534,7 @@ openerp.point_of_sale.load_chrome = function load_chrome(instance, module){ //mo
                 'name':   'proxy_status',
                 'widget': module.ProxyStatusWidget,
                 'append':  '.pos-rightheader',
-                'condition': function(self){ return self.pos.config.use_proxy },
+                'condition': function(){ return this.pos.config.use_proxy },
             },{
                 'name':   'notification',
                 'widget': module.SynchNotificationWidget,
@@ -573,7 +573,7 @@ openerp.point_of_sale.load_chrome = function load_chrome(instance, module){ //mo
                 'name':  'debug',
                 'widget': module.DebugWidget,
                 'append': '.pos-content',
-                'condition': function(self){ return self.pos.debug },
+                'condition': function(){ return this.pos.debug },
             },
         ],
 
@@ -581,21 +581,9 @@ openerp.point_of_sale.load_chrome = function load_chrome(instance, module){ //mo
         build_widgets: function() {
             var self = this;
 
-            for (var name in this.gui.screen_classes) {
-                var screen = new this.gui.screen_classes[name](this,{});
-                    screen.appendTo(this.$('.screens'));
-                this.gui.add_screen(name, screen);
-            }
-
-            for (var name in this.gui.popup_classes) {
-                var popup = new this.gui.popup_classes[name](this,{});
-                    popup.appendTo(this.$('.popups')); 
-                this.gui.add_popup(name, popup);
-            }
-
             for (var i = 0; i < this.widgets.length; i++) {
                 var def = this.widgets[i];
-                if ( !def.condition || def.condition(this) ) {
+                if ( !def.condition || def.condition.call(this) ) {
                     var args = typeof def.args === 'function' ? def.args(this) : def.args;
                     var w = new def.widget(this, args || {});
                     if (def.replace) {
@@ -611,6 +599,28 @@ openerp.point_of_sale.load_chrome = function load_chrome(instance, module){ //mo
                 }
             }
 
+            this.screens = {};
+            for (var i = 0; i < this.gui.screen_classes.length; i++) {
+                var classe = this.gui.screen_classes[i];
+                if (!classe.condition || classe.condition.call(this)) {
+                    var screen = new classe.widget(this,{});
+                        screen.appendTo(this.$('.screens'));
+                    this.screens[classe.name] = screen;
+                    this.gui.add_screen(classe.name, screen);
+                }
+            }
+
+            this.popups = {};
+            for (var i = 0; i < this.gui.popup_classes.length; i++) {
+                var classe = this.gui.popup_classes[i];
+                if (!classe.condition || classe.condition.call(this)) {
+                    var popup = new classe.widget(this,{});
+                        popup.appendTo(this.$('.popups'));
+                    this.popups[classe.name] = popup;
+                    this.gui.add_popup(classe.name, popup);
+                }
+            }
+
             this.gui.set_startup_screen('products');
             this.gui.set_default_screen('products');
 
diff --git a/addons/point_of_sale/static/src/js/gui.js b/addons/point_of_sale/static/src/js/gui.js
index 1c0b6c8db21..4627abab60b 100644
--- a/addons/point_of_sale/static/src/js/gui.js
+++ b/addons/point_of_sale/static/src/js/gui.js
@@ -12,8 +12,8 @@ openerp.point_of_sale.load_gui = function load_gui(instance, module) {
     var _t = instance.web._t;
 
     module.Gui = instance.web.Class.extend({
-        screen_classes: {},
-        popup_classes:  {},
+        screen_classes: [],
+        popup_classes:  [],
         init: function(options){
             var self = this;
             this.pos            = options.pos;
@@ -117,7 +117,7 @@ openerp.point_of_sale.load_gui = function load_gui(instance, module) {
         
         // returns the current screen.
         get_current_screen: function() {
-            return this.pos.get_order().get_screen_data('screen') || this.default_screen;
+            return this.pos.get_order() ? ( this.pos.get_order().get_screen_data('screen') || this.default_screen ) : this.startup_screen;
         },
 
         // goes to the previous screen (as specified in the order). The history only
@@ -131,8 +131,12 @@ openerp.point_of_sale.load_gui = function load_gui(instance, module) {
 
         // returns the parameter specified when this screen was displayed
         get_current_screen_param: function(param) {
-            var params = this.pos.get_order().get_screen_data('params');
-            return params ? params[param] : undefined;
+            if (this.pos.get_order()) {
+                var params = this.pos.get_order().get_screen_data('params');
+                return params ? params[param] : undefined;
+            } else {
+                return undefined;
+            }
         },
 
         /* ---- Gui: POPUP MANIPULATION ---- */
@@ -325,12 +329,12 @@ openerp.point_of_sale.load_gui = function load_gui(instance, module) {
         },
     });
 
-    module.Gui.define_screen = function (name, classe) {
-        module.Gui.prototype.screen_classes[name] = classe;
+    module.Gui.define_screen = function (classe) {
+        module.Gui.prototype.screen_classes.push(classe);
     };
 
-    module.Gui.define_popup = function (name, classe) {
-        module.Gui.prototype.popup_classes[name] = classe;
+    module.Gui.define_popup = function (classe) {
+        module.Gui.prototype.popup_classes.push(classe);
     };
 }; 
 
diff --git a/addons/point_of_sale/static/src/js/popups.js b/addons/point_of_sale/static/src/js/popups.js
index 7a6d5f55c24..e52d9be9669 100644
--- a/addons/point_of_sale/static/src/js/popups.js
+++ b/addons/point_of_sale/static/src/js/popups.js
@@ -92,13 +92,13 @@ openerp.point_of_sale.load_popups = function load_popups(instance, module) {
 
         },
     });
-    module.Gui.define_popup('error', module.ErrorPopupWidget);
+    module.Gui.define_popup({name:'error', widget:module.ErrorPopupWidget});
 
 
     module.ErrorTracebackPopupWidget = module.ErrorPopupWidget.extend({
         template:'ErrorTracebackPopupWidget',
     });
-    module.Gui.define_popup('error-traceback', module.ErrorTracebackPopupWidget);
+    module.Gui.define_popup({name:'error-traceback', widget:module.ErrorTracebackPopupWidget});
 
 
     module.ErrorBarcodePopupWidget = module.ErrorPopupWidget.extend({
@@ -107,13 +107,13 @@ openerp.point_of_sale.load_popups = function load_popups(instance, module) {
             this._super({barcode: barcode});
         },
     });
-    module.Gui.define_popup('error-barcode', module.ErrorBarcodePopupWidget);
+    module.Gui.define_popup({name:'error-barcode', widget:module.ErrorBarcodePopupWidget});
 
 
     module.ConfirmPopupWidget = module.PopupWidget.extend({
         template: 'ConfirmPopupWidget',
     });
-    module.Gui.define_popup('confirm', module.ConfirmPopupWidget);
+    module.Gui.define_popup({name:'confirm', widget:module.ConfirmPopupWidget});
 
     /**
      * A popup that allows the user to select one item from a list. 
@@ -159,7 +159,7 @@ openerp.point_of_sale.load_popups = function load_popups(instance, module) {
             }
         }
     });
-    module.Gui.define_popup('selection', module.SelectionPopupWidget);
+    module.Gui.define_popup({name:'selection', widget:module.SelectionPopupWidget});
 
 
     module.TextInputPopupWidget = module.PopupWidget.extend({
@@ -183,13 +183,13 @@ openerp.point_of_sale.load_popups = function load_popups(instance, module) {
             }
         },
     });
-    module.Gui.define_popup('textinput', module.TextInputPopupWidget);
+    module.Gui.define_popup({name:'textinput', widget:module.TextInputPopupWidget});
 
 
     module.TextAreaPopupWidget = module.TextInputPopupWidget.extend({
         template: 'TextAreaPopupWidget',
     });
-    module.Gui.define_popup('textarea', module.TextAreaPopupWidget);
+    module.Gui.define_popup({name:'textarea', widget:module.TextAreaPopupWidget});
 
 
     module.NumberPopupWidget = module.PopupWidget.extend({
@@ -223,24 +223,24 @@ openerp.point_of_sale.load_popups = function load_popups(instance, module) {
             }
         },
     });
-    module.Gui.define_popup('number', module.NumberPopupWidget);
+    module.Gui.define_popup({name:'number', widget:module.NumberPopupWidget});
 
     module.PasswordPopupWidget = module.NumberPopupWidget.extend({
         renderElement: function(){
             this._super();
-            this.$('.popup').addClass('popup-password');    // WHY NOT ?!
+            this.$('.popup').addClass('popup-password');
         },
     });
-    module.Gui.define_popup('password', module.PasswordPopupWidget);
+    module.Gui.define_popup({name:'password', widget:module.PasswordPopupWidget});
 
     module.UnsentOrdersPopupWidget = module.ConfirmPopupWidget.extend({
         template: 'UnsentOrdersPopupWidget',
     });
-    module.Gui.define_popup('unsent-orders', module.UnsentOrdersPopupWidget);
+    module.Gui.define_popup({name:'unsent-orders', widget:module.UnsentOrdersPopupWidget});
 
     module.UnpaidOrdersPopupWidget = module.ConfirmPopupWidget.extend({
         template: 'UnpaidOrdersPopupWidget',
     });
-    module.Gui.define_popup('unpaid-orders', module.UnpaidOrdersPopupWidget);
+    module.Gui.define_popup({name:'unpaid-orders', widget:module.UnpaidOrdersPopupWidget});
 };
 
diff --git a/addons/point_of_sale/static/src/js/screens.js b/addons/point_of_sale/static/src/js/screens.js
index ab52d1a3edd..82fe865d1d2 100644
--- a/addons/point_of_sale/static/src/js/screens.js
+++ b/addons/point_of_sale/static/src/js/screens.js
@@ -308,7 +308,7 @@ openerp.point_of_sale.load_screens = function load_screens(instance, module){ //
             this.pos.proxy_queue.clear();
         },
     });
-    module.Gui.define_screen('scale', module.ScaleScreenWidget);
+    module.Gui.define_screen({name: 'scale', widget: module.ScaleScreenWidget});
 
     /*--------------------------------------*\
      |         THE PRODUCT SCREEN           |
@@ -404,10 +404,6 @@ openerp.point_of_sale.load_screens = function load_screens(instance, module){ //
                 self.numpad_state.reset();
             };
 
-            this.client_change_handler = function(event){
-                self.update_summary();
-            }
-
             if (this.pos.get_order()) {
                 this.bind_order_events();
             }
@@ -448,8 +444,10 @@ openerp.point_of_sale.load_screens = function load_screens(instance, module){ //
         },
         bind_order_events: function() {
             var order = this.pos.get_order();
-                order.unbind('change:client', this.client_change_handler);
-                order.bind('change:client', this.client_change_handler);
+                order.unbind('change:client', this.update_summary, this);
+                order.bind('change:client',   this.update_summary, this);
+                order.unbind('change',        this.update_summary, this);
+                order.bind('change',          this.update_summary, this);
 
             var lines = order.orderlines;
                 lines.unbind('add',     this.orderline_add,    this);
@@ -904,7 +902,7 @@ openerp.point_of_sale.load_screens = function load_screens(instance, module){ //
             }
         },
     });
-    module.Gui.define_screen('products', module.ProductScreenWidget);
+    module.Gui.define_screen({name:'products', widget:module.ProductScreenWidget});
 
     /*--------------------------------------*\
      |         THE CLIENT LIST              |
@@ -1290,7 +1288,7 @@ openerp.point_of_sale.load_screens = function load_screens(instance, module){ //
             this._super();
         },
     });
-    module.Gui.define_screen('clientlist', module.ClientListScreenWidget);
+    module.Gui.define_screen({name:'clientlist', widget: module.ClientListScreenWidget});
 
     /*--------------------------------------*\
      |         THE RECEIPT SCREEN           |
@@ -1374,7 +1372,7 @@ openerp.point_of_sale.load_screens = function load_screens(instance, module){ //
                 }));
         },
     });
-    module.Gui.define_screen('receipt', module.ReceiptScreenWidget);
+    module.Gui.define_screen({name:'receipt', widget:module.ReceiptScreenWidget});
 
     /*--------------------------------------*\
      |         THE PAYMENT SCREEN           |
@@ -1704,7 +1702,7 @@ openerp.point_of_sale.load_screens = function load_screens(instance, module){ //
             }
         },
     });
-    module.Gui.define_screen('payment', module.PaymentScreenWidget);
+    module.Gui.define_screen({name:'payment', widget:module.PaymentScreenWidget});
 
 };
 
diff --git a/addons/pos_discount/static/src/js/discount.js b/addons/pos_discount/static/src/js/discount.js
index df55ea9dbc6..b98c649fe66 100644
--- a/addons/pos_discount/static/src/js/discount.js
+++ b/addons/pos_discount/static/src/js/discount.js
@@ -24,5 +24,6 @@ openerp.pos_discount = function(instance){
             return this.pos.config.discount_product_id;
         },
     });
+
 };
 
diff --git a/addons/pos_restaurant/static/src/js/floors.js b/addons/pos_restaurant/static/src/js/floors.js
index 686593eb887..d6d694578a9 100644
--- a/addons/pos_restaurant/static/src/js/floors.js
+++ b/addons/pos_restaurant/static/src/js/floors.js
@@ -3,7 +3,7 @@ function openerp_restaurant_floors(instance,module){
     var _t = instance.web._t;
 
     // At POS Startup, load the floors, and add them to the pos model
-    module.PosModel.prototype.models.push({
+    module.load_models({
         model: 'restaurant.floor',
         fields: ['name','background_image','table_ids','sequence'],
         domain: function(self){ return [['pos_config_id','=',self.config.id]] },
@@ -25,7 +25,7 @@ function openerp_restaurant_floors(instance,module){
 
     // At POS Startup, after the floors are loaded, load the tables, and associate
     // them with their floor. 
-    module.PosModel.prototype.models.push({
+    module.load_models({
         model: 'restaurant.table',
         fields: ['name','width','height','position_h','position_v','shape','floor_id','color'],
         loaded: function(self,tables){
@@ -324,11 +324,11 @@ function openerp_restaurant_floors(instance,module){
             if (this.editing) { 
                 this.toggle_editing();
             }
-            this.pos_widget.order_selector.show();
+            this.chrome.widget.order_selector.show();
         },
         show: function(){
             this._super();
-            this.pos_widget.order_selector.hide();
+            this.chrome.widget.order_selector.hide();
             for (var i = 0; i < this.table_widgets.length; i++) { 
                 this.table_widgets[i].renderElement();
             }
@@ -393,8 +393,8 @@ function openerp_restaurant_floors(instance,module){
         tool_rename_table: function(){
             var self = this;
             if (this.selected_table) {
-                this.pos_widget.screen_selector.show_popup('textinput',{
-                    'message':_t('Table Name ?'),
+                this.gui.show_popup('textinput',{
+                    'title':_t('Table Name ?'),
                     'value': this.selected_table.table.name,
                     'confirm': function(value) {
                         self.selected_table.set_table_name(value);
@@ -441,8 +441,8 @@ function openerp_restaurant_floors(instance,module){
         tool_trash_table: function(){
             var self = this;
             if (this.selected_table) {
-                this.pos_widget.screen_selector.show_popup('confirm',{
-                    'message':_t('Are you sure ?'),
+                this.gui.show_popup('confirm',{
+                    'title':  _t('Are you sure ?'),
                     'comment':_t('Removing a table cannot be undone'),
                     'confirm': function(){
                         self.selected_table.trash();
@@ -562,36 +562,21 @@ function openerp_restaurant_floors(instance,module){
         },
     });
 
+    module.Gui.define_screen({
+        'name': 'floors',
+        'widget': module.FloorScreenWidget,
+        'condition': function(){
+            return this.pos.config.iface_floorplan;
+        },
+    });
+
     // Add the FloorScreen to the GUI, and set it as the default screen
-    module.PosWidget.include({
+    module.Chrome.include({
         build_widgets: function(){
             var self = this;
             this._super();
             if (this.pos.config.iface_floorplan) {
-                this.floors_screen = new module.FloorScreenWidget(this,{});
-                this.floors_screen.appendTo(this.$('.screens'));
-                this.screen_selector.add_screen('floors',this.floors_screen);
-                this.screen_selector.change_default_screen('floors');
-            }
-        },
-    });
-
-    // when the floor plan is activated, we need to go back to the floor plan
-    // when an order is completed. Usually on order completion, a new order is
-    // set as the current one. Now, we set the new order to null. 
-    // load_saved_screen() is called whenever the current order is changed, and 
-    // will detect this, and set the current screen to the default_screen, 
-    // which is the floor plan.
-    module.ScreenSelector.include({
-        load_saved_screen: function(){
-            if (this.pos.config.iface_floorplan) {
-                if (!this.pos.get_order()) {
-                    this.set_current_screen(this.default_screen,null,'refresh');
-                } else {
-                    this._super({default_screen:'products'});
-                }
-            } else {
-                this._super.apply(this,arguments);
+                this.gui.set_startup_screen('floors');
             }
         },
     });
diff --git a/addons/pos_restaurant/static/src/js/multiprint.js b/addons/pos_restaurant/static/src/js/multiprint.js
index c2d4461c3ae..0ca4695768b 100644
--- a/addons/pos_restaurant/static/src/js/multiprint.js
+++ b/addons/pos_restaurant/static/src/js/multiprint.js
@@ -33,7 +33,7 @@ function openerp_restaurant_multiprint(instance,module){
         },
     });
 
-    module.PosModel.prototype.models.push({
+    module.load_models({
         model: 'restaurant.printer',
         fields: ['name','proxy_ip','product_categories_ids'],
         domain: null,
@@ -220,39 +220,39 @@ function openerp_restaurant_multiprint(instance,module){
         },
     });
 
-    module.PosWidget.include({
-        build_widgets: function(){
-            var self = this;
-            this._super();
-
-            if(this.pos.printers.length){
-                var submitorder = $(QWeb.render('SubmitOrderButton'));
-
-                submitorder.click(function(){
-                    var order = self.pos.get('selectedOrder');
-                    if(order.hasChangesToPrint()){
-                        order.printChanges();
-                        order.saveChanges();
-                        self.pos_widget.order_widget.update_summary();
-                    }
-                });
-                
-                submitorder.appendTo(this.$('.control-buttons'));
-                this.$('.control-buttons').removeClass('oe_hidden');
+    module.SubmitOrderButton = module.ActionButtonWidget.extend({
+        'template': 'SubmitOrderButton',
+        button_click: function(){
+            var order = this.pos.get_order();
+            if(order.hasChangesToPrint()){
+                order.printChanges();
+                order.saveChanges();
+            }
+        },
+        hilight: function(hi){
+            if (hi) {
+                this.$el.addClass('highlight');
+            } else {
+                this.$el.removeClass('highlight');
             }
         },
-        
+    });
+
+    module.define_action_button({
+        'name': 'submit_order',
+        'widget': module.SubmitOrderButton,
+        'condition': function() {
+            return this.pos.printers.length;
+        },
     });
 
     module.OrderWidget.include({
         update_summary: function(){
             this._super();
-            var order = this.pos.get('selectedOrder');
-
-            if(order.hasChangesToPrint()){
-                this.pos_widget.$('.order-submit').addClass('highlight');
-            }else{
-                this.pos_widget.$('.order-submit').removeClass('highlight');
+            var changes = this.pos.get_order().hasChangesToPrint();
+            if (this.getParent().action_buttons && 
+                this.getParent().action_buttons.submit_order) {
+                this.getParent().action_buttons.submit_order.highlight(changes);
             }
         },
     });
diff --git a/addons/pos_restaurant/static/src/js/notes.js b/addons/pos_restaurant/static/src/js/notes.js
index 1e4c9489f22..ef33552b8ee 100644
--- a/addons/pos_restaurant/static/src/js/notes.js
+++ b/addons/pos_restaurant/static/src/js/notes.js
@@ -41,13 +41,12 @@ function openerp_restaurant_notes(instance,module){
         },
     });
 
-    module.PosWidget.include({
-        orderline_note_click: function(){
-            var self = this;
+    module.OrderlineNoteButton = module.ActionButtonWidget.extend({
+        template: 'OrderlineNoteButton',
+        button_click: function(){
             var line = this.pos.get_order().get_selected_orderline();
-
             if (line) {
-                this.screen_selector.show_popup('textarea',{
+                this.gui.show_popup('textarea',{
                     message: _t('Orderline Note'),
                     value:   line.get_note(),
                     confirm: function(note) {
@@ -56,16 +55,13 @@ function openerp_restaurant_notes(instance,module){
                 });
             }
         },
-        build_widgets: function(){
-            var self = this;
-            this._super();
+    });
 
-            if (this.pos.config.iface_orderline_notes) {
-                var button = $(QWeb.render('OrderlineNoteButton'));
-                button.click(function(){ self.orderline_note_click(); });
-                button.appendTo(this.$('.control-buttons'));
-                this.$('.control-buttons').removeClass('oe_hidden');
-            }
+    module.define_action_button({
+        'name': 'orderline_note',
+        'widget': module.OrderlineNoteButton,
+        'condition': function(){
+            return this.pos.config.iface_orderline_notes;
         },
     });
 }
diff --git a/addons/pos_restaurant/static/src/js/printbill.js b/addons/pos_restaurant/static/src/js/printbill.js
index c8bfc8ec93e..3ea879e5b92 100644
--- a/addons/pos_restaurant/static/src/js/printbill.js
+++ b/addons/pos_restaurant/static/src/js/printbill.js
@@ -2,28 +2,26 @@ function openerp_restaurant_printbill(instance,module){
     var QWeb = instance.web.qweb;
 	var _t = instance.web._t;
 
-    module.PosWidget.include({
-        build_widgets: function(){
-            var self = this;
-            this._super();
-
-            if(this.pos.config.iface_printbill){
-                var printbill = $(QWeb.render('PrintBillButton'));
-
-                printbill.click(function(){
-                    var order = self.pos.get('selectedOrder');
-                    if(order.get_orderlines().length > 0){
-                        var receipt = order.export_for_printing();
-                            receipt.bill = true;
-                        self.pos.proxy.print_receipt(QWeb.render('BillReceipt',{
-                            receipt: receipt, widget: self, pos: self.pos, order: order,
-                        }));
-                    }
-                });
-
-                printbill.appendTo(this.$('.control-buttons'));
-                this.$('.control-buttons').removeClass('oe_hidden');
+    module.PrintBillButton = module.ActionButtonWidget.extend({
+        template: 'PrintBillButton',
+        button_click: function(){
+            var order = this.pos.get('selectedOrder');
+            if(order.get_orderlines().length > 0){
+                var receipt = order.export_for_printing();
+                receipt.bill = true;
+                this.pos.proxy.print_receipt(QWeb.render('BillReceipt',{
+                    receipt: receipt, widget: this, pos: this.pos, order: order,
+                }));
             }
         },
     });
+
+    module.define_action_button({
+        'name': 'print_bill',
+        'widget': module.PrintBillButton,
+        'condition': function(){ 
+            return this.pos.config.iface_printbill;
+        },
+    });
 }
+
diff --git a/addons/pos_restaurant/static/src/js/splitbill.js b/addons/pos_restaurant/static/src/js/splitbill.js
index f58f77eedc8..06d03705d5f 100644
--- a/addons/pos_restaurant/static/src/js/splitbill.js
+++ b/addons/pos_restaurant/static/src/js/splitbill.js
@@ -1,11 +1,9 @@
 function openerp_restaurant_splitbill(instance, module){
     var QWeb = instance.web.qweb;
-	var _t = instance.web._t;
 
     module.SplitbillScreenWidget = module.ScreenWidget.extend({
         template: 'SplitbillScreenWidget',
 
-        show_leftpane:   false,
         previous_screen: 'products',
 
         renderElement: function(){
@@ -29,7 +27,7 @@ function openerp_restaurant_splitbill(instance, module){
                 this.$('.orderlines').append(linewidget);
             }
             this.$('.back').click(function(){
-                self.pos_widget.screen_selector.set_current_screen(self.previous_screen);
+                self.gui.show_screen(self.previous_screen);
             });
         },
 
@@ -102,7 +100,7 @@ function openerp_restaurant_splitbill(instance, module){
 
 
             if(full){
-                this.pos_widget.screen_selector.set_current_screen('payment');
+                this.gui.show_screen('payment');
             }else{
                 for(var id in splitlines){
                     var split = splitlines[id];
@@ -157,27 +155,28 @@ function openerp_restaurant_splitbill(instance, module){
         },
     });
 
-    module.PosWidget.include({
-        build_widgets: function(){
-            var self = this;
-            this._super();
-
-            if(this.pos.config.iface_splitbill){
-                this.splitbill_screen = new module.SplitbillScreenWidget(this,{});
-                this.splitbill_screen.appendTo(this.$('.screens'));
-                this.screen_selector.add_screen('splitbill',this.splitbill_screen);
-
-                var splitbill = $(QWeb.render('SplitbillButton'));
+    module.Gui.define_screen({
+        'name': 'splitbill', 
+        'widget': module.SplitbillScreenWidget,
+        'condition': function(){ 
+            return this.pos.config.iface_splitbill;
+        },
+    });
 
-                splitbill.click(function(){
-                    if(self.pos.get_order().get_orderlines().length > 0){
-                        self.pos_widget.screen_selector.set_current_screen('splitbill');
-                    }
-                });
-                
-                splitbill.appendTo(this.$('.control-buttons'));
-                this.$('.control-buttons').removeClass('oe_hidden');
+    module.SplitbillButton = module.ActionButtonWidget.extend({
+        template: 'SplitbillButton',
+        button_click: function(){
+            if(this.pos.get_order().get_orderlines().length > 0){
+                self.gui.show_screen('splitbill');
             }
         },
     });
+
+    module.define_action_button({
+        'name': 'splitbill',
+        'widget': module.SplitbillButton,
+        'condition': function(){
+            return this.pos.config.iface_splitbill;
+        },
+    });
 }