[IMP] change CSS classes for m2m tags and get them out of the oe_form namespace

this way, we can consistently display m2m tags anywhere without dummy CSS copy/paste (example: projet issues, projet tasks)
oe_form_field_many2manytags became oe_field_many2many_tags (container)
oe_form_field_many2manytags_box became oe_field_many2many_tag (item)
Qweb templates names have been changed accordingly

bzr revid: abo@openerp.com-20120712125637-hji6e9chch1h01f0
This commit is contained in:
Antonin Bourguignon 2012-07-12 14:56:37 +02:00
parent 30c3919316
commit b83fff287a
4 changed files with 93 additions and 91 deletions

View File

@ -34,7 +34,7 @@
background: white;
/* http://www.quirksmode.org/dom/inputfile.html
* http://stackoverflow.com/questions/2855589/replace-input-type-file-by-an-image
*/ */
*/
}
.openerp a {
text-decoration: none;
@ -450,6 +450,32 @@
.openerp .oe_webclient .oe_star_on {
color: gold;
}
.openerp .oe_field_many2many_tags .text-wrap {
width: 100% !important;
}
.openerp .oe_field_many2many_tags .text-wrap textarea {
width: 100% !important;
}
.openerp .oe_field_many2many_tags .oe_field_many2many_tag {
border-radius: 2px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
position: relative;
float: left;
border: 1px solid #9daccc;
background: #e2e6f0;
color: black;
padding: 0px 3px 0px 3px;
margin: 0 2px 2px 0;
height: 16px;
font: 11px "lucida grande", tahoma, verdana, arial, sans-serif;
}
.openerp .oe_field_many2many_tags .text-core .text-wrap .text-dropdown .text-list .text-suggestion em {
font-style: italic;
text-decoration: none;
}
.openerp.oe_tooltip {
font-size: 12px;
}
@ -2017,32 +2043,6 @@
padding-top: 4px;
width: auto;
}
.openerp .oe_form .oe_form_field_many2manytags .text-wrap {
width: 100% !important;
}
.openerp .oe_form .oe_form_field_many2manytags .text-wrap textarea {
width: 100% !important;
}
.openerp .oe_form .oe_form_field_many2manytags .oe_form_field_many2manytags_box {
border-radius: 2px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
position: relative;
float: left;
border: 1px solid #9daccc;
background: #e2e6f0;
color: black;
padding: 0px 3px 0px 3px;
margin: 0 2px 2px 0;
height: 16px;
font: 11px "lucida grande", tahoma, verdana, arial, sans-serif;
}
.openerp .oe_form .oe_form_field_many2manytags .text-core .text-wrap .text-dropdown .text-list .text-suggestion em {
font-style: italic;
text-decoration: none;
}
.openerp .oe_form .oe_datepicker_container {
display: none;
}

View File

@ -362,8 +362,28 @@ $sheet-max-width: 860px
text-decoration: none
.oe_star_on
color: gold
//.oe_edit_only 
// }}}
// Many2many tags {{{
.oe_field_many2many_tags
.text-wrap
width: 100% !important
textarea
width: 100% !important
.oe_field_many2many_tag
border-radius: 2px
@include box-sizing(border)
position: relative
float: left
border: 1px solid #9DACCC
background: #E2E6F0
color: black
padding: 0px 3px 0px 3px
margin: 0 2px 2px 0
height: 16px
font: 11px "lucida grande", tahoma, verdana, arial, sans-serif
.text-core .text-wrap .text-dropdown .text-list .text-suggestion em
font-style: italic
text-decoration: none
// }}}
// Tooltips {{{
&.oe_tooltip
@ -823,7 +843,7 @@ $sheet-max-width: 860px
text-shadow: 0 1px 1px rgba(0,0,0,0.2)
@include radius(4px)
@include box-shadow(inset 0 1px 1px rgba(0, 0, 0, 0.2))
.oe_menu_counter
.oe_menu_counter
float: right
background: #8a89ba
color: #eee
@ -846,7 +866,7 @@ $sheet-max-width: 860px
color: $colour4
text-shadow: 0 1px 1px white
@include box-shadow(0 1px 1px rgba(0, 0, 0, 0.2))
.oe_menu_counter
.oe_menu_counter
background: #eee
color: #8a89ba
.oe_menu_toggler:before
@ -1312,7 +1332,7 @@ $sheet-max-width: 860px
margin: 0 0 0 4px
padding: 0
// }}}
// Views Common {{{
.oe_view_nocontent
@ -1356,7 +1376,7 @@ $sheet-max-width: 860px
display: none !important
.oe_form .oe_form_field_date
width: auto
.oe_form_nosheet
.oe_form_nosheet
margin-left: 10px
margin-right: 10px
.oe_form_nosheet > header
@ -1364,13 +1384,13 @@ $sheet-max-width: 860px
margin-right: -10px
// }}}
// FormView.custom tags and classes {{{
.oe_form
.oe_form
header
position: relative
border-bottom: 1px solid #cacaca
@include vertical-gradient(#fcfcfc, #dedede)
padding: 0 8px
line-height: 30px
line-height: 30px
ul
display: inline-block
float: right
@ -1387,12 +1407,12 @@ $sheet-max-width: 860px
vertical-align: top
margin-left: 8px
li
border-right: none
border-right: none
padding: 0
margin: 0
float: left
float: left
vertical-align: top
height: 30px
height: 30px
padding: 0 0 0 12px
&:first-child
border-left: 1px solid #cacaca
@ -1428,7 +1448,7 @@ $sheet-max-width: 860px
.oe_form_sheetbg
background: url(/web/static/src/img/form_sheetbg.png)
padding: 8px 0
border-bottom: 1px solid #ddd
border-bottom: 1px solid #ddd
.oe_form_sheet_width
min-width: 650px
max-width: $sheet-max-width
@ -1572,26 +1592,6 @@ $sheet-max-width: 860px
.oe_form_field_boolean
padding-top: 4px
width: auto
.oe_form_field_many2manytags
.text-wrap
width: 100% !important
textarea
width: 100% !important
.oe_form_field_many2manytags_box
border-radius: 2px
@include box-sizing(border)
position: relative
float: left
border: 1px solid #9DACCC
background: #E2E6F0
color: black
padding: 0px 3px 0px 3px
margin: 0 2px 2px 0
height: 16px
font: 11px "lucida grande", tahoma, verdana, arial, sans-serif
.text-core .text-wrap .text-dropdown .text-list .text-suggestion em
font-style: italic
text-decoration: none
.oe_datepicker_container
display: none
.oe_datepicker_root

View File

@ -9,7 +9,7 @@ instance.web.form = {};
/**
* Interface implemented by the form view or any other object
* able to provide the features necessary for the fields to work.
*
*
* Properties:
* - display_invalid_fields : if true, all fields where is_valid() return true should
* be displayed as invalid.
@ -953,7 +953,7 @@ instance.web.form.FormRenderingEngineInterface = instance.web.Class.extend({
/**
* Default rendering engine for the form view.
*
*
* It is necessary to set the view using set_view() before usage.
*/
instance.web.form.FormRenderingEngine = instance.web.form.FormRenderingEngineInterface.extend({
@ -1276,7 +1276,7 @@ instance.web.form.FormRenderingEngine = instance.web.form.FormRenderingEngineInt
page_attrs.__page = $new_page;
page_attrs.__ic = ic;
pages.push(page_attrs);
$new_page.children().each(function() {
self.process($(this));
});
@ -1302,7 +1302,7 @@ instance.web.form.FormRenderingEngine = instance.web.form.FormRenderingEngineInt
}
});
});
this.handle_common_properties($new_notebook, $notebook);
return $new_notebook;
},
@ -1603,7 +1603,7 @@ instance.web.form.FormWidget = instance.web.Widget.extend(instance.web.form.Invi
if (! v_context) {
v_context = (this.field || {}).context || {};
}
if (v_context.__ref || true) { //TODO: remove true
var fields_values = this._build_eval_context(blacklist);
v_context = new instance.web.CompoundContext(v_context).set_eval_context(fields_values);
@ -1711,14 +1711,14 @@ instance.web.form.WidgetButton = instance.web.form.FormWidget.extend({
/**
* Interface to be implemented by fields.
*
*
* Properties:
* - readonly: boolean. If set to true the field should appear in readonly mode.
* - force_readonly: boolean, When it is true, the field should always appear
* in read only mode, no matter what the value of the "readonly" property can be.
* Events:
* - changed_value: triggered to inform the view to check on_changes
*
*
*/
instance.web.form.FieldInterface = {
/**
@ -1729,14 +1729,14 @@ instance.web.form.FieldInterface = {
init: function(field_manager, node) {},
/**
* Called by the form view to indicate the value of the field.
*
*
* set_value() may return an object that can be passed to $.when() that represents the moment when
* the field has finished all operations necessary before the user can effectively use the widget.
*
*
* Multiple calls to set_value() can occur at any time and must be handled correctly by the implementation,
* regardless of any asynchronous operation currently running and the status of any promise that a
* previous call to set_value() could have returned.
*
*
* set_value() must be able, at any moment, to handle the syntax returned by the "read" method of the
* osv class in the OpenERP server as well as the syntax used by the set_value() (see below). It must
* also be able to handle any other format commonly used in the _defaults key on the models in the addons
@ -1746,16 +1746,16 @@ instance.web.form.FieldInterface = {
set_value: function(value_) {},
/**
* Get the current value of the widget.
*
*
* Must always return a syntaxically correct value to be passed to the "write" method of the osv class in
* the OpenERP server, although it is not assumed to respect the constraints applied to the field.
* For example if the field is marqued as "required", a call to get_value() can return false.
*
*
* get_value() can also be called *before* a call to set_value() and, in that case, is supposed to
* return a defaut value according to the type of field.
*
*
* This method is always assumed to perform synchronously, it can not return a promise.
*
*
* If there was no user interaction to modify the value of the field, it is always assumed that
* get_value() return the same semantic value than the one passed in the last call to set_value(),
* altough the syntax can be different. This can be the case for type of fields that have a different
@ -1785,14 +1785,14 @@ instance.web.form.FieldInterface = {
/**
* Abstract class for classes implementing FieldInterface.
*
*
* Properties:
* - effective_readonly: when it is true, the widget is displayed as readonly. Vary depending
* the values of the "readonly" property and the "force_readonly" property on the field manager.
* - value: useful property to hold the value of the field. By default, set_value() and get_value()
* set and retrieve the value property. Changing the value property also triggers automatically
* a 'changed_value' event that inform the view to trigger on_changes.
*
*
*/
instance.web.form.AbstractField = instance.web.form.FormWidget.extend(instance.web.form.FieldInterface, {
/**
@ -1811,7 +1811,7 @@ instance.web.form.AbstractField = instance.web.form.FormWidget.extend(instance.w
this.string = this.node.attrs.string || this.field.string || this.name;
this.set({'value': false});
this.set({required: this.modifiers['required'] === true});
// some events to make the property "effective_readonly" sync automatically with "readonly" and
// "force_readonly"
this.set({"readonly": this.modifiers['readonly'] === true});
@ -1821,7 +1821,7 @@ instance.web.form.AbstractField = instance.web.form.FormWidget.extend(instance.w
this.on("change:readonly", this, test_effective_readonly);
this.on("change:force_readonly", this, test_effective_readonly);
_.bind(test_effective_readonly, this)();
this.on("change:value", this, function() {
if (! this._inhibit_on_change)
this.trigger('changed_value');
@ -2003,7 +2003,7 @@ instance.web.form.FieldChar = instance.web.form.AbstractField.extend(instance.we
});
instance.web.form.FieldID = instance.web.form.FieldChar.extend({
});
instance.web.form.FieldEmail = instance.web.form.FieldChar.extend({
@ -2396,7 +2396,7 @@ instance.web.form.FieldSelection = instance.web.form.AbstractField.extend(instan
} else {
var self = this;
var option = _(this.values)
.detect(function (record) { return record[0] === self.get('value'); });
.detect(function (record) { return record[0] === self.get('value'); });
this.$element.text(option ? option[1] : this.values[0][1]);
}
},
@ -2575,7 +2575,7 @@ instance.web.form.FieldMany2One = instance.web.form.AbstractField.extend(instanc
render_editable: function() {
var self = this;
this.$input = this.$element.find("input");
self.$input.tipsy({
title: function() {
return "No element was selected, you should create or select one from the dropdown list.";
@ -2583,10 +2583,10 @@ instance.web.form.FieldMany2One = instance.web.form.AbstractField.extend(instanc
trigger:'manual',
fade: true,
});
this.$drop_down = this.$element.find(".oe_m2o_drop_down_button");
this.$follow_button = $(".oe_m2o_cm_button", this.$element);
this.$follow_button.click(function() {
if (!self.get('value')) {
self.focus();
@ -2880,7 +2880,7 @@ instance.web.form.FieldOne2Many = instance.web.form.AbstractField.extend({
},
load_views: function() {
var self = this;
var modes = this.node.attrs.mode;
modes = !!modes ? modes.split(",") : ["tree"];
var views = [];
@ -3462,7 +3462,7 @@ instance.web.form.FieldMany2ManyTags = instance.web.form.AbstractField.extend(in
$("textarea", self.$element).css("padding-left", "3px");
self.tags.addTags(_.map(data, function(el) {return {name: el[1], id:el[0]};}));
} else {
self.$element.html(QWeb.render("FieldMany2ManyTags.box", {elements: data}));
self.$element.html(QWeb.render("FieldMany2ManyTag", {elements: data}));
}
};
if (! self.get('values') || self.get('values').length > 0) {
@ -3634,7 +3634,7 @@ instance.web.form.FieldMany2ManyKanban = instance.web.form.AbstractField.extend(
this.dataset.on_unlink.add_last(function(ids) {
self.dataset_changed();
});
this.is_setted.then(function() {
self.load_view();
});
@ -3750,7 +3750,7 @@ instance.web.form.Many2ManyKanbanView = instance.web_kanban.KanbanView.extend({
});
instance.web.form.Many2ManyQuickCreate = instance.web.Widget.extend({
template: 'Many2ManyKanban.quick_create',
/**
* close_btn: If true, the widget will display a "Close" button able to trigger
* a "close" event.
@ -4443,7 +4443,7 @@ instance.web.form.FieldStatus = instance.web.form.AbstractField.extend({
this.selection = [];
// get fold information from widget
var fold = ((this.node.attrs || {}).statusbar_fold || true);
// build final domain: if fold option required, add the
// build final domain: if fold option required, add the
if (fold == true) {
var domain = new instance.web.CompoundDomain(['|'], ['&'], self.build_domain(), [['fold', '=', false]], [['id', '=', self.selected_value]]);
} else {
@ -4475,7 +4475,7 @@ instance.web.form.FieldStatus = instance.web.form.AbstractField.extend({
var shown = _.map(((this.node.attrs || {}).statusbar_visible || "").split(","),
function(x) { return _.str.trim(x); });
shown = _.select(shown, function(x) { return x.length > 0; });
if (shown.length == 0) {
this.to_show = this.selection;
} else {

View File

@ -961,18 +961,20 @@
</t>
</span>
</t>
<!-- Collection of m2m tags -->
<t t-name="FieldMany2ManyTags">
<div class="oe_form_field oe_form_field_many2manytags" t-att-style="widget.node.attrs.style">
<div class="oe_form_field oe_field_many2many_tags" t-att-style="widget.node.attrs.style">
<t t-if="! widget.get('effective_readonly')">
<textarea rows="1" style="width: 100%"
t-att-placeholder="widget.node.attrs.placeholder"></textarea>
</t>
</div>
</t>
<t t-name="FieldMany2ManyTags.box">
<!-- Individual m2m tag element -->
<t t-name="FieldMany2ManyTag">
<t t-set="i" t-value="0"/>
<t t-foreach="elements" t-as="el">
<span class="oe_form_field_many2manytags_box" t-att-data-index="i">
<span class="oe_field_many2many_tag" t-att-data-index="i">
<t t-esc="el[1]"/>
</span>
<t t-set="i" t-value="i + 1"/>