[IMP] web: get rid of WidgetButton template

Qweb rendering is great to render "complex" widget structures. However,
using it to render something as simple as a button was not very
meaningful. This commit deletes the "WidgetButton" template and replaces
it with an utility JS function to render buttons according to given
parameters.

Also, this change will allow a better change. Before this commit, the
only templates left in the "base_common.xml" file are the "WidgetButton"
and the "Dialog" ones. With the removal of "WidgetButton", the file can
now be lazy loaded only if necessary, on the first dialog instantiation.
This will allow to remove the need to load static XML files on each
frontend page loading.

1 files changed, 45 insertions, 4 deletions

diff --git a/addons/web/static/src/js/core/dom.js b/addons/web/static/src/js/core/dom.js
index 2dad9eb912f..e1592c53f73 100644
--- a/addons/web/static/src/js/core/dom.js
+++ b/addons/web/static/src/js/core/dom.js
@@ -19,8 +19,8 @@ var core = require('web.core');
  * @params {Array} [callbacks] array of {widget: w, callback_args: args} such
  * that on_attach_callback() will be called on each w with arguments args
  */
-function _notify (content, callbacks) {
-    _.each(callbacks, function(c) {
+function _notify(content, callbacks) {
+    _.each(callbacks, function (c) {
         if (c.widget && c.widget.on_attach_callback) {
             c.widget.on_attach_callback(c.callback_args);
         }
@@ -115,14 +115,14 @@ return {
      * @return {jQuery} the detached elements
      */
     detach: function (to_detach, options) {
-        _.each(to_detach, function(d) {
+        _.each(to_detach, function (d) {
             if (d.widget.on_detach_callback) {
                 d.widget.on_detach_callback(d.callback_args);
             }
         });
         var $to_detach = options && options.$to_detach;
         if (!$to_detach) {
-            $to_detach = $(_.map(to_detach, function(d) {
+            $to_detach = $(_.map(to_detach, function (d) {
                 return d.widget.el;
             }));
         }
@@ -160,6 +160,47 @@ return {
             _notify(content, options.callbacks);
         }
     },
+    /**
+     * Renders a button with standard odoo template. This does not use any xml
+     * template to avoid forcing the frontend part to lazy load a xml file for
+     * each widget which might want to create a simple button.
+     *
+     * @param {Object} options
+     * @param {Object} [options.attrs] - Attributes to put on the button element
+     * @param {string} [options.attrs.type="button"]
+     * @param {string} [options.attrs.class="btn-default"]
+     *        Note: automatically completed with "btn btn-X" (@see options.size
+     *        for the value of X)
+     * @param {string} [options.size=sm] - @see options.attrs.class
+     * @param {string} [options.icon]
+     *        The specific fa icon class (for example "fa-home") or an URL for
+     *        an image to use as icon.
+     * @param {string} [options.text] - the button's text
+     * @returns {jQuery}
+     */
+    renderButton: function (options) {
+        var params = options.attrs || {};
+        params.type = params.type || 'button';
+        params.class = 'btn btn-' + (options.size || 'sm') + ' ' + (params.class || 'btn-default');
+        var $button = $('<button/>', params);
+        if (options.icon) {
+            if (options.icon.substr(0, 3) === 'fa-') {
+                $button.append($('<i/>', {
+                    class: 'fa fa-fw o_button_icon ' + options.icon,
+                }));
+            } else {
+                $button.append($('<img/>', {
+                    src: options.icon,
+                }));
+            }
+        }
+        if (options.text) {
+            $button.append($('<span/>', {
+                text: options.text,
+            }));
+        }
+        return $button;
+    },
 };
 
 });