[IMP] Improved FieldChar widget

bzr revid: fme@openerp.com-20110322171801-e5jmov41xg3pnzfz

addons/base/static/openerp/base.css

@@ -416,6 +416,9 @@ body.openerp {
     border-bottom-width: 1px;
     margin: 6px 4px 6px 1px;
 }
+.openerp input[required=required], .openerp select[required=required] {
+    background-color: #D2D2FF;
+}
 
 /* jQuery UI override */
 .openerp .ui-widget {

addons/base/static/openerp/base.xml

@@ -162,28 +162,28 @@
             <td t-att-colspan="td.colspan gt 1 ? td.colspan : undefined"
                 t-att-width="td.width ? td.width : undefined"
                 t-att-nowrap="td.is_field_label ? 'true' : undefined"
-                t-att-valign="td.table ? 'top' : undefined">
-                    <t t-raw="td.render()"/>
+                t-att-valign="td.table ? 'top' : undefined"
+                t-att-id="td.element_id"
+            >
+                <t t-raw="td.render()"/>
             </td>
         </t>
     </tr>
     </table>
 </t>
 <t t-name="WidgetNotebook">
-    <div t-att-id="widget.element_id">
-        <ul>
-            <li t-foreach="widget.pages" t-as="page">
-                <a t-att-href="'#' + widget.element_id + '-' + page_index">
-                    <t t-esc="page.string"/>
-                </a>
-            </li>
-        </ul>
-        <t t-foreach="widget.pages" t-as="page">
-            <div t-att-id="widget.element_id + '-' + page_index">
-                <t t-raw="page.render()"/>
-            </div>
-        </t>
-    </div>
+    <ul>
+        <li t-foreach="widget.pages" t-as="page">
+            <a t-att-href="'#' + widget.element_id + '-' + page_index">
+                <t t-esc="page.string"/>
+            </a>
+        </li>
+    </ul>
+    <t t-foreach="widget.pages" t-as="page">
+        <div t-att-id="widget.element_id + '-' + page_index">
+            <t t-raw="page.render()"/>
+        </div>
+    </t>
 </t>
 <t t-name="WidgetSeparator">
     <div t-att-class="'separator ' + (widget.node.attrs.orientation || 'horizontal')">
@@ -191,23 +191,39 @@
     </div>
 </t>
 <t t-name="WidgetLabel">
-    <label t-att-for="widget.for.element_id" t-att-title="widget.for.help" style="display: block; text-align: right;" t-att-ondblclick="'console.log(openerp.screen.oe_main.formview.widgets[\'' + widget.for.element_id + '\'])'">
+    <label t-att-for="widget.for.element_id" t-att-title="widget.for.help" style="display: block; text-align: right;" t-att-ondblclick="'console.log(\'' + widget.for.element_id + '\', openerp.screen.' + widget.for.element_id + ')'">
         <t t-esc="widget.for.string"/>
         <span t-if="widget.for.help">?</span>
         :
     </label>
 </t>
 <t t-name="FieldChar">
-    <input type="text" t-att-name="widget.name" t-att-id="widget.element_id" t-att-class="'field_' + widget.type" style="width: 100%"/>
+    <input type="text"
+        t-att-name="widget.name"
+        t-att-required="widget.node.attrs.required ? 'required' : undefined"
+        t-att-class="'field_' + widget.type" style="width: 100%"
+    />
 </t>
 <t t-name="FieldText">
-    <textarea rows="6" t-att-name="widget.name" t-att-id="widget.element_id" t-att-class="'field_' + widget.type" style="width: 100%;"></textarea>
+    <textarea rows="6" style="width: 100%;"
+        t-att-name="widget.name"
+        t-att-required="widget.node.attrs.required ? 'required' : undefined"
+        t-att-class="'field_' + widget.type"
+    ></textarea>
 </t>
 <t t-name="FieldDate">
-    <input type="text" t-att-name="widget.name" t-att-id="widget.element_id" t-att-class="'field_' + widget.type" style="width: 100%" placeholder="Widget Date"/>
+    <input type="text" style="width: 100%"
+        t-att-name="widget.name"
+        t-att-required="widget.node.attrs.required ? 'required' : undefined"
+        t-att-class="'field_' + widget.type"
+    />
 </t>
 <t t-name="FieldDatetime">
-    <input type="text" t-att-name="widget.name" t-att-id="widget.element_id" t-att-class="'field_' + widget.type" style="width: 100%" placeholder="Widget Datetime"/>
+    <input type="text" style="width: 100%"
+        t-att-name="widget.name"
+        t-att-required="widget.node.attrs.required ? 'required' : undefined"
+        t-att-class="'field_' + widget.type"
+    />
 </t>
 <t t-name="FieldSelection">
     <select t-att-name="widget.name" t-att-id="widget.element_id" t-att-class="'field_' + widget.type" style="width: 100%">
@@ -226,6 +242,11 @@
         One2Many widget
     </div>
 </t>
+<t t-name="FieldMany2Many">
+    <div style="background: #ccc; padding: 20px">
+        Many2Many widget
+    </div>
+</t>
 <t t-name="FieldReference">
     <input type="text" t-att-name="widget.name" t-att-id="widget.element_id" t-att-class="'field_' + widget.type" style="width: 100%" placeholder="Widget Reference"/>
 </t>

addons/base/static/openerp/js/base_views.js

@@ -273,7 +273,7 @@ openerp.base.FormView =  openerp.base.Controller.extend({
     },
     on_record_loaded: function() {
         for (var f in this.fields) {
-            this.fields[f].set_value();
+            this.fields[f].set_value(this.datarecord.values[f]);
         }
     }
 });
@@ -487,9 +487,17 @@ openerp.base.WidgetSeparator = openerp.base.Widget.extend({
     }
 });
 
+openerp.base.WidgetButton = openerp.base.Widget.extend({
+    init: function(view, node) {
+        this._super(view, node);
+        this.template = "WidgetButton";
+    }
+});
+
 openerp.base.WidgetLabel = openerp.base.Widget.extend({
     init: function(view, node) {
         this.is_field_label = true;
+        this.element_name = 'label_' + node.attrs.name;
 
         this._super(view, node);
 
@@ -498,19 +506,13 @@ openerp.base.WidgetLabel = openerp.base.Widget.extend({
     }
 });
 
-openerp.base.WidgetButton = openerp.base.Widget.extend({
-    init: function(view, node) {
-        this._super(view, node);
-        this.template = "WidgetButton";
-    }
-});
-
 openerp.base.Field = openerp.base.Widget.extend({
     init: function(view, node) {
         this.name = node.attrs.name;
         view.fields[this.name] = this;
         this.type = node.attrs.widget || view.fields_view.fields[node.attrs.name].type;
         this.element_name = "field_" + this.name + "_" + this.type;
+        this.original_value;
 
         this._super(view, node);
 
@@ -523,7 +525,8 @@ openerp.base.Field = openerp.base.Widget.extend({
         this.help = node.attrs.help || this.field.help;
         this.nolabel = (node.attrs.nolabel == '1');
     },
-    set_value: function() {
+    set_value: function(value) {
+        this.original_value = value;
     }
 });
 
@@ -536,53 +539,35 @@ openerp.base.FieldChar = openerp.base.Field.extend({
         this._super.apply(this, arguments);
         // this.$element.bind('change',)  ... blur, focus, ...
     },
-    set_value: function() {
-        this.$element.val(this.view.datarecord.values[this.name]);
+    set_value: function(value) {
+        this._super.apply(this, arguments);
+        if (value != null && value !== false) {
+            this.$element.find('input').val(this.to_string(value));
+        }
+    },
+    get_value: function() {
+        return this.from_string(this.$element.find('input').val());
+    },
+    to_string: function(value) {
+        return value.toString();
+    },
+    from_string: function(value) {
+        return value.toString();
     },
     on_change: function() {
         //this.view.update_field(this.name,value);
     }
 });
 
-openerp.base.FieldEmail = openerp.base.Field.extend({
-    init: function(view, node) {
-        this._super(view, node);
-        this.template = "FieldEmail";
-    }
+openerp.base.FieldEmail = openerp.base.FieldChar.extend({
 });
 
-openerp.base.FieldUrl = openerp.base.Field.extend({
-    init: function(view, node) {
-        this._super(view, node);
-        this.template = "FieldChar";
-    }
+openerp.base.FieldUrl = openerp.base.FieldChar.extend({
 });
 
-openerp.base.FieldFloat = openerp.base.Field.extend({
-    init: function(view, node) {
-        this._super(view, node);
-        this.template = "FieldChar";
-    }
-});
-
-openerp.base.FieldBoolean = openerp.base.Field.extend({
-    init: function(view, node) {
-        this._super(view, node);
-        this.template = "FieldBoolean";
-    }
-});
-
-openerp.base.FieldDate = openerp.base.Field.extend({
-    init: function(view, node) {
-        this._super(view, node);
-        this.template = "FieldDate";
-    }
-});
-
-openerp.base.FieldDatetime = openerp.base.Field.extend({
-    init: function(view, node) {
-        this._super(view, node);
-        this.template = "FieldDatetime";
+openerp.base.FieldFloat = openerp.base.FieldChar.extend({
+    to_string: function(value) {
+        return value.toFixed(2);
     }
 });
 
@@ -590,6 +575,43 @@ openerp.base.FieldText = openerp.base.Field.extend({
     init: function(view, node) {
         this._super(view, node);
         this.template = "FieldText";
+    },
+    set_value: function(value) {
+        this._super.apply(this, arguments);
+        if (value != null && value !== false) {
+            this.$element.find('textarea').val(value);
+        }
+    },
+    get_value: function() {
+        return this.$element.find('textarea').val();
+    }
+});
+
+openerp.base.FieldBoolean = openerp.base.Field.extend({
+    init: function(view, node) {
+        this._super(view, node);
+        this.template = "FieldBoolean";
+    },
+    set_value: function(value) {
+        this._super.apply(this, arguments);
+        this.$element.find('input')[0].checked = value;
+    },
+    get_value: function() {
+        this.$element.find('input')[0].checked;
+    }
+});
+
+openerp.base.FieldDate = openerp.base.FieldChar.extend({
+    init: function(view, node) {
+        this._super(view, node);
+        this.template = "FieldDate";
+    }
+});
+
+openerp.base.FieldDatetime = openerp.base.FieldChar.extend({
+    init: function(view, node) {
+        this._super(view, node);
+        this.template = "FieldDatetime";
     }
 });
 
@@ -601,6 +623,15 @@ openerp.base.FieldSelection = openerp.base.Field.extend({
     init: function(view, node) {
         this._super(view, node);
         this.template = "FieldSelection";
+    },
+    set_value: function(value) {
+        this._super.apply(this, arguments);
+        if (value != null && value !== false) {
+            this.$element.find('select').val(value);
+        }
+    },
+    get_value: function() {
+        return this.$element.find('select').val();
     }
 });
 
@@ -638,14 +669,16 @@ openerp.base.widgets = {
     'separator' : openerp.base.WidgetSeparator,
     'label' : openerp.base.WidgetLabel,
     'char' : openerp.base.FieldChar,
-    'url' : openerp.base.FieldUrl,
     'email' : openerp.base.FieldEmail,
+    'url' : openerp.base.FieldUrl,
+    'text' : openerp.base.FieldText,
     'date' : openerp.base.FieldDate,
     'datetime' : openerp.base.FieldDatetime,
-    'text' : openerp.base.FieldText,
     'selection' : openerp.base.FieldSelection,
     'many2one' : openerp.base.FieldMany2One,
+    'many2many' : openerp.base.FieldMany2Many,
     'one2many' : openerp.base.FieldOne2Many,
+    'one2many_list' : openerp.base.FieldOne2Many,
     'reference' : openerp.base.FieldReference,
     'boolean' : openerp.base.FieldBoolean,
     'float' : openerp.base.FieldFloat,

doc/source/addons.rst

@@ -86,6 +86,21 @@ replace ``addons`` by the directory in which your own addon lives.
      and run ``nosetests addons`` instead of the ``unit2`` command,
      the result should be exactly the same.
 
+APIs
+----
+
+Javascript
+++++++++++
+
+.. js:class:: openerp.base.Widget(view, node)
+
+    :param openerp.base.Controller view: The view to which the widget belongs
+    :param Object node: the ``fields_view_get`` descriptor for the widget
+
+.. js:attribute:: openerp.base.Widget.$element
+
+    The widget's root element as jQuery object
+
 * Addons lifecycle (loading, execution, events, ...)
 
   * Python-side
@@ -97,7 +112,6 @@ replace ``addons`` by the directory in which your own addon lives.
 * Extending templates
   .. how do you handle deploying static files via e.g. a separate lighttpd?
 * Python public APIs
-* Javascript public APIs
 * QWeb templates description?
 * OpenERP Web modules (from OpenERP modules)