Merge pull request #777 from etobella/11.0-mig-web_widget_color

[11.0] [MIG] web_widget_color
7 years ago · 82f232c46b
17 changed files with 1267 additions and 0 deletions
--- a/web_widget_color/README.rst
+++ b/web_widget_color/README.rst
@ -0,0 +1,100 @@
 Color widget for Odoo web client
 ================================
 This module aims to add a color picker to Odoo.
 It's a `jsColor <http://jscolor.com/>`_ lib integration.
 Features
 ========
 * The picker allow the user to quickly select a color on edit mode
  |picker|
  .. note::
      Notice how html code and the background color is updating when selecting a color.
 * Display the color on form view when you are not editing it
  |formview|
 * Display the color on list view to quickly find what's wrong!
  |listview|
 Usage
 =====
 You need to declare a char field::
    color = fields.Char(
        string="Color",
        help="Choose your color"
    )
 In the view declaration, put widget='color' attribute in the field tag::
    ...
    <field name="arch" type="xml">
        <tree string="View name">
            ...
            <field name="color" widget="color"/>
            ...
        </tree>
    </field>
    ...
    <field name="arch" type="xml">
        <form string="View name">
            ...
            <field name="color" widget="color"/>
            ...
        </form>
    </field>
    ...
 .. |picker| image:: ./images/picker.png
 .. |formview| image:: ./images/form_view.png
 .. |listview| image:: ./images/list_view.png
 .. image:: https://odoo-community.org/website/image/ir.attachment/5784_f2813bd/datas
   :alt: Try me on Runbot
   :target: https://runbot.odoo-community.org/runbot/162/11.0
 Bug Tracker
 ===========
 Bugs are tracked on `GitHub Issues
 <https://github.com/OCA/OCA/issues>`_. In case of trouble, please
 check there if your issue has already been reported. If you spotted it first,
 help us smashing it by providing a detailed and welcomed feedback.
 Credits
 =======
 Contributors
 ------------
 * Adil Houmadi <adil.houmadi@gmail.com>
 * Enric Tobella <etobella@creublanca.es>
 * Nicolas JEUDY (Sudokeys) <https://www.github.com/njeudy>
 Maintainer
 ----------
 .. image:: https://odoo-community.org/logo.png
   :alt: Odoo Community Association
   :target: https://odoo-community.org
 This module is maintained by the OCA.
 OCA, or the Odoo Community Association, is a nonprofit organization whose
 mission is to support the collaborative development of Odoo features and
 promote its widespread use.
 To contribute to this module, please visit https://odoo-community.org.
--- a/web_widget_color/init.py
+++ b/web_widget_color/init.py
@ -0,0 +1,2 @@
 # -*- coding: utf-8 -*-
 #
--- a/web_widget_color/manifest.py
+++ b/web_widget_color/manifest.py
@ -0,0 +1,28 @@
 # -*- coding: utf-8 -*-
 # Odoo, Open Source Web Widget Color
 # Copyright (C) 2012 Savoir-faire Linux (<http://www.savoirfairelinux.com>).
 # Copyright (C) 2014 Anybox <http://anybox.fr>
 # Copyright (C) 2015 Taktik SA <http://taktik.be>
 #
 # License AGPL-3.0 or later (https://www.gnu.org/licenses/agpl).#
 {
    'name': "Web Widget Color",
    'category': "web",
    'version': "11.0.1.0.0",
    "author": "Savoir-faire Linux, "
              "Anybox, "
              "Taktik SA, "
              "Sudokeys, "
              "Odoo Community Association (OCA)",
    'depends': ['base', 'web'],
    'data': [
        'view/web_widget_color_view.xml'
    ],
    'qweb': [
        'static/src/xml/widget.xml',
    ],
    'license': 'AGPL-3',
    'auto_install': False,
    'installable': True,
    'web_preload': True,
 }
--- a/web_widget_color/images/form_view.png
+++ b/web_widget_color/images/form_view.png
--- a/web_widget_color/images/list_view.png
+++ b/web_widget_color/images/list_view.png
--- a/web_widget_color/images/picker.png
+++ b/web_widget_color/images/picker.png
--- a/web_widget_color/static/description/icon.png
+++ b/web_widget_color/static/description/icon.png
--- a/web_widget_color/static/lib/jscolor/arrow.gif
+++ b/web_widget_color/static/lib/jscolor/arrow.gif
--- a/web_widget_color/static/lib/jscolor/cross.gif
+++ b/web_widget_color/static/lib/jscolor/cross.gif
--- a/web_widget_color/static/lib/jscolor/demo.html
+++ b/web_widget_color/static/lib/jscolor/demo.html
@ -0,0 +1,12 @@
 <html>
 <head>
 	<title>jscolor demo</title>
 </head>
 <body>
 	<script type="text/javascript" src="jscolor.js"></script>
 	Click here: <input class="color" value="66ff00">
 </body>
 </html>
--- a/web_widget_color/static/lib/jscolor/hs.png
+++ b/web_widget_color/static/lib/jscolor/hs.png
--- a/web_widget_color/static/lib/jscolor/hv.png
+++ b/web_widget_color/static/lib/jscolor/hv.png
--- a/web_widget_color/static/lib/jscolor/jscolor.js
+++ b/web_widget_color/static/lib/jscolor/jscolor.js
--- a/web_widget_color/static/src/css/widget.css
+++ b/web_widget_color/static/src/css/widget.css
@ -0,0 +1,30 @@
 .openerp .oe_form .oe_form_field_color input {
    width: 100%;
 }
 .openerp .oe_form .oe_form_field_color div {
    border: 1px solid;
    display: inline-block;
    height: 14px;
    margin-right: 10px;
    position: relative;
    top: 3px;
    width: 40px;
 }
 .oe_list_field_color div {
    border: 1px solid;
    display: inline-block;
    height: 14px;
    margin-right: 10px;
    position: relative;
    top: 3px;
    width: 40px;
 }
 .color_box {
    width: 10px;
    height: 10px;
    display: inline-block;
    margin-right: 5px;
 }
--- a/web_widget_color/static/src/js/widget.js
+++ b/web_widget_color/static/src/js/widget.js
@ -0,0 +1,53 @@
 odoo.define('web.web_widget_color', function(require) {
    "use strict";
    var basic_fields = require('web.basic_fields');
    var field_registry = require('web.field_registry');
    var FormController = require('web.FormController');
    var field_utils = require('web.field_utils');
    var _super_getDir = jscolor.getDir.prototype;
    jscolor.getDir = function () {
        var dir = _super_getDir.constructor();
        if (dir.indexOf('web_widget_color') === -1) {
            jscolor.dir = '/web_widget_color/static/lib/jscolor/';
        }
        return jscolor.dir;
    };
    var FieldColor = basic_fields.FieldChar.extend({
        template: 'FieldColor',
        widget_class: 'oe_form_field_color',
        _getValue: function() {
            return field_utils.format.char(this.$('input').val());
        },
        _render: function () {
            var show_value = field_utils.format.char(this.value);
            jscolor.init(this.$el[0]);
            if (this.mode !== 'readonly') {
                var $input = this.$el.find('input');
                $input.val(show_value);
                $input.css("background-color", show_value);
                this.$input = $input;
                this.$(".oe_form_char_content").text(show_value);
                this.$('span').css("background-color", show_value);
            } else {
                this.$(".oe_form_char_content").text(show_value);
                this.$('span').css("background-color", show_value);
            }
        }
    });
    field_registry.add('color', FieldColor);
    /*
     * Init jscolor for each editable mode on view form
     */
    FormController.include({
        _updateEnv : function (parentID) {
            this._super(parentID);
            jscolor.init(this.$el[0]);
        }
    });
    return FieldColor
 });
--- a/web_widget_color/static/src/xml/widget.xml
+++ b/web_widget_color/static/src/xml/widget.xml
@ -0,0 +1,22 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <templates>
    <t t-name="FieldColor">
        <span t-att-class="'oe_form_field '+widget.widget_class" t-att-style="widget.attrs.style">
                <input type="text"
                       t-att-id="widget.id_for_label"
                       t-att-tabindex="widget.attrs.tabindex"
                       t-att-autofocus="widget.attrs.autofocus"
                       t-att-placeholder="widget.attrs.placeholder"
                       t-att-maxlength="widget.field.size"
                       class="color {hash:true} o_input"
                        t-if="widget.mode !== 'readonly'"/>
            <t t-else="">
                <div/>
                <span class="oe_form_char_content"></span>
            </t>
        </span>
    </t>
    <tr t-extend="ListView.row">
        <t t-jquery="t td t" t-operation="replace"><t t-if="column.widget =='color' || column.type == 'color'"><div class="color_box" t-att-style="'background-color:' + render_cell(record, column)"/></t><t t-raw="render_cell(record, column)"/></t>
    </tr>
 </templates>
--- a/web_widget_color/view/web_widget_color_view.xml
+++ b/web_widget_color/view/web_widget_color_view.xml
@ -0,0 +1,10 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <odoo>
    <template id="assets_backend" name="web_widget_color assets" inherit_id="web.assets_backend">
        <xpath expr="." position="inside">
            <link rel="stylesheet" href="/web_widget_color/static/src/css/widget.css"/>
            <script type="text/javascript" src="/web_widget_color/static/lib/jscolor/jscolor.js"></script>
            <script type="text/javascript" src="/web_widget_color/static/src/js/widget.js"></script>
        </xpath>
    </template>
 </odoo>