[ADD] Added color picker for kanban view

bzr revid: fme@openerp.com-20110912125938-jt1v7jf1h4e6t66s
This commit is contained in:
Fabien Meghazi 2011-09-12 14:59:38 +02:00
parent 650738b48d
commit 1b5e641ff4
4 changed files with 66 additions and 25 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 767 B

View File

@ -66,16 +66,30 @@
padding: 4px;
}
.openerp .oe_kanban_buttons_set {
border-top: 1px dotted #CCC;
border-top: 1px dotted;
white-space: nowrap;
padding-top: 2px;
position: relative;
}
.openerp .oe_kanban_buttons_set .oe_kanban_left a {
border-right: 1px dotted #CCC;
.openerp .oe_kanban_buttons_set a {
padding: 2px;
}
.openerp .oe_kanban_buttons_set .oe_kanban_right a {
border-left: 1px dotted #CCC;
padding: 2px;
.oe_kanban_color_picker {
position: absolute;
top: -10px;
border: 1px solid black;
-moz-box-shadow: 2px 2px 5px #666;
-webkit-box-shadow: 2px 2px 5px #666;
box-shadow: 2px 2px 5px #666;
}
.oe_kanban_color_picker a {
display: block;
width: 30px;
height: 30px;
border: 1px solid black;
}
.oe_kanban_color_picker a:hover {
border-color: white;
}
.openerp .oe_kanban_left {
float: left;
@ -95,30 +109,24 @@
/* Custom colors are also present in kanban.js */
/* Custom color#1 */
.openerp .oe_kanban_color_1 .oe_kanban_color_bglight,
.openerp .oe_kanban_color_1.oe_kanban_color_bglight {
.openerp .oe_kanban_color_1 .oe_kanban_color_bglight {
background: #FFC7C7;
}
.openerp .oe_kanban_color_1 .oe_kanban_color_bgdark,
.openerp .oe_kanban_color_1.oe_kanban_color_bgdark {
.openerp .oe_kanban_color_1 .oe_kanban_color_bgdark {
background: #FF8F8F;
}
.openerp .oe_kanban_color_1 .oe_kanban_color_border,
.openerp .oe_kanban_color_1.oe_kanban_color_border {
.openerp .oe_kanban_color_1 .oe_kanban_color_border {
border-color: #D97979;
}
/* Custom color#2 */
.openerp .oe_kanban_color_2 .oe_kanban_color_bglight,
.openerp .oe_kanban_color_2.oe_kanban_color_bglight {
.openerp .oe_kanban_color_2 .oe_kanban_color_bglight {
background: #FFF1C7;
}
.openerp .oe_kanban_color_2 .oe_kanban_color_bgdark,
.openerp .oe_kanban_color_2.oe_kanban_color_bgdark {
.openerp .oe_kanban_color_2 .oe_kanban_color_bgdark {
background: #FFE38F;
}
.openerp .oe_kanban_color_2 .oe_kanban_color_border,
.openerp .oe_kanban_color_2.oe_kanban_color_border {
.openerp .oe_kanban_color_2 .oe_kanban_color_border {
border-color: #D9C179;
}
@ -196,6 +204,6 @@
background: #E99;
}
.openerp .oe_kanban_color_alert .oe_kanban_color_border {
border-color: #999;
border-color: #900;
}

View File

@ -65,7 +65,7 @@ openerp.web_kanban.KanbanView = openerp.web.View.extend({
default:
return '';
}
return 'oe_kanban_color_' + ((index % number_of_color_schemes) + 1);
return 'oe_kanban_color_' + ((index % number_of_color_schemes) || number_of_color_schemes);
},
kanban_gravatar: function(email, size) {
size = size || 22;
@ -81,7 +81,7 @@ openerp.web_kanban.KanbanView = openerp.web.View.extend({
case 'button':
case 'a':
var type = node.attrs.type || '';
if (_.indexOf('action,object,edit,delete,'.split(','), type) !== -1) {
if (_.indexOf('action,object,edit,delete,color'.split(','), type) !== -1) {
_.each(node.attrs, function(v, k) {
node.attrs['data-' + k] = v;
delete(node.attrs[k]);
@ -179,8 +179,27 @@ openerp.web_kanban.KanbanView = openerp.web.View.extend({
this.notification.warn("Kanban", "No form view defined for this object");
}
},
do_change_color: function(method) {
var color = '#FFC7C7,#FFF1C7,#E3FFC7,#C7FFD5,#C7FFFF,#C7D5FF,#FFC7F1'.split(',');
do_change_color: function(record_id, $e) {
var self = this,
id = record_id,
colors = '#FFC7C7,#FFF1C7,#E3FFC7,#C7FFD5,#C7FFFF,#C7D5FF,#E3C7FF,#FFC7F1'.split(','),
$cpicker = $(QWeb.render('KanbanColorPicker', { colors : colors, columns: 2 }));
$e.after($cpicker);
$cpicker.mouseenter(function() {
clearTimeout($cpicker.data('timeoutId'));
}).mouseleave(function(evt) {
var timeoutId = setTimeout(function() { $cpicker.remove() }, 500);
$cpicker.data('timeoutId', timeoutId);
});
$cpicker.find('a').click(function() {
var data = {};
data[$e.data('name')] = $(this).data('color');
self.dataset.write(id, data, {}, function() {
// TODO fme: reload record instead of all. need refactoring
self.do_actual_search();
});
$cpicker.remove();
});
},
do_delete: function (id) {
var self = this;
@ -322,8 +341,8 @@ openerp.web_kanban.KanbanView = openerp.web.View.extend({
}
});
this.$element.find('.oe_kanban_action').click(this.on_action_clicked);
this.$element.find('.oe_kanban_record').click(function() {
$(this).find('.oe_kanban_box_show_onclick').toggle();
this.$element.find('.oe_kanban_box_show_onclick_trigger').click(function() {
$(this).parent('.oe_kanban_box').find('.oe_kanban_box_show_onclick').toggle();
});
},
on_action_clicked: function(evt) {
@ -334,6 +353,8 @@ openerp.web_kanban.KanbanView = openerp.web.View.extend({
this.do_delete(record_id);
} else if (type == 'edit') {
this.do_edit_record(record_id);
} else if (type == 'color') {
this.do_change_color(record_id, $action);
} else {
var button_attrs = $(this).data();
this.on_button_click(button_attrs, record_id);

View File

@ -22,4 +22,16 @@
</tr>
</table>
</t>
<t t-name="KanbanColorPicker">
<table cellspacing="0" cellpadding="0" border="0" class="oe_kanban_color_picker">
<tr>
<t t-foreach="colors" t-as="color">
<td t-att-bgcolor="color">
<a href="#" t-att-data-color="color_index + 1"/>
</td>
<t t-if="((color_index + 1) % Math.round(colors.length / columns)) == 0">&lt;/tr&gt;&lt;tr&gt;</t>
</t>
</tr>
</table>
</t>
</template>