From 5113c8bca60b308c4299fcff9fa7930616b5513a Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Thibault=20Delavall=C3=A9e?= Date: Tue, 11 Feb 2014 11:04:45 +0100 Subject: [PATCH] [IMP] web_kanban_gauge: udpated parameters - new parameters: input_value_field is now called gauge_value_field, this is the field displayed under the gauge - new parameter: force_set: whether to force setting a value when the value is nul - new parameter: on_click_label: label under the input when editing the gauge value - action_change renamed on_click_action bzr revid: tde@openerp.com-20140211100445-289mvmr8grcgns8x --- .../static/src/js/kanban_gauge.js | 71 +++++++++++++------ 1 file changed, 49 insertions(+), 22 deletions(-) diff --git a/addons/web_kanban_gauge/static/src/js/kanban_gauge.js b/addons/web_kanban_gauge/static/src/js/kanban_gauge.js index cb703a758a2..cb45e0c00a4 100644 --- a/addons/web_kanban_gauge/static/src/js/kanban_gauge.js +++ b/addons/web_kanban_gauge/static/src/js/kanban_gauge.js @@ -2,6 +2,19 @@ openerp.web_kanban_gauge = function (instance) { /** * Kanban widgets: GaugeWidget + * options + * - max_value: maximum value of the gauge [default: 100] + * - max_field: get the max_value from the field that must be present in the + * view; takes over max_value + * - gauge_value_field: if set, the value displayed below the gauge is taken + from this field instead of the base field used for + the gauge. This allows to display a number different + from the gauge. + * - force_set: is value is 0, display a text 'Click to set' [default: True] + * - label: lable of the gauge, displayed below the gauge value + * - title: title of the gauge, displayed on top of the gauge + * - on_click_action: action to call when cliking and setting a value + * - on_click_label: optional label of the input displayed when clicking * */ var _t = instance.web._t, @@ -13,33 +26,34 @@ instance.web_kanban.GaugeWidget = instance.web_kanban.AbstractField.extend({ start: function() { var self = this; var parent = this.getParent(); - var max = 100; + // parameters + var max_value = this.options.max_value || 100; if (this.options.max_field) { - max = this.getParent().record[this.options.max_field].raw_value; + max_value = this.getParent().record[this.options.max_field].raw_value; } var label = this.options.label || ""; if (this.options.label_field) { label = this.getParent().record[this.options.label_field].raw_value; } + var title = this.$node.html() || this.field.string; + // current gauge value var val = this.field.value; var value = _.isArray(val) && val.length ? val[val.length-1]['value'] : val; - var input_value = value; - if (this.options.input_value_field) { - input_value = this.getParent().record[this.options.input_value_field].raw_value; + // displayed value under gauge + var gauge_value = value; + if (this.options.gauge_value_field) { + gauge_value = this.getParent().record[this.options.gauge_value_field].raw_value; } - var title = this.$node.html() || this.field.string; // var unique_id = _.uniqueId("JustGage"); - this.$el.empty() - .attr('style', this.$node.attr('style') + ';position:relative; display:inline-block;'); - + this.$el.empty().attr('style', this.$node.attr('style') + ';position:relative; display:inline-block;'); this.gage = new JustGage({ parentNode: this.$el[0], // id: unique_id, value: value, title: title, min: 0, - max: max, + max: max_value, relativeGaugeSize: true, humanFriendly: true, titleFontColor: '#333333', @@ -52,17 +66,11 @@ instance.web_kanban.GaugeWidget = instance.web_kanban.AbstractField.extend({ "#a9d70b" ], }); - this.gage.refresh(value, max); + this.gage.refresh(value, max_value); var flag_open = false; - if (this.options.action_change) { + if (this.options.on_click_action) { var $svg = this.$el.find('svg'); - var css = { - 'text-align': 'center', - 'position': 'absolute', - 'width': this.$el.outerWidth() + 'px', - 'top': (this.$el.outerHeight()/2-5) + 'px' - }; this.$el.click(function (event) { event.stopPropagation(); @@ -70,30 +78,47 @@ instance.web_kanban.GaugeWidget = instance.web_kanban.AbstractField.extend({ if (!parent.view.is_action_enabled('edit')) { return; } + // fade widget + $svg.fadeTo(0, 0.3); + + // add input if (!self.$el.find(".oe_justgage_edit").size()) { $div = $('
'); - $div.css(css); - $input = $('').val(input_value); + $div.css({ + 'text-align': 'center', + 'position': 'absolute', + 'width': self.$el.outerWidth() + 'px', + 'top': (self.$el.outerHeight()/2-5) + 'px' + }); + $input = $('').val(gauge_value); $input.css({ 'text-align': 'center', 'margin': 'auto', 'width': ($svg.outerWidth()-40) + 'px' }); $div.append($input); + if (self.options.on_click_label) { + $post_input = $('' + self.options.on_click_label + ''); + $div.append($post_input); + } self.$el.prepend($div) + $input.focus() .keydown(function (event) { event.stopPropagation(); if(isNaN($input.val())){ self.do_warn(_t("Wrong value entered!"), _t("Only Integer Value should be valid.")); $div.remove(); + $svg.fadeTo(0, 1); } else { if (event.keyCode == 13 || event.keyCode == 9) { if ($input.val() != value) { - parent.view.dataset.call(self.options.action_change, [parent.id, $input.val()]).then(function () { + $svg.fadeTo(0, 1); + parent.view.dataset.call(self.options.on_click_action, [parent.id, $input.val()]).then(function () { parent.do_reload(); }); } else { + $svg.fadeTo(0, 1); $div.remove(); } } @@ -106,7 +131,9 @@ instance.web_kanban.GaugeWidget = instance.web_kanban.AbstractField.extend({ .blur(function (event) { if(!flag_open) { self.$el.find(".oe_justgage_edit").remove(); + $svg.fadeTo(0, 1); } else { + $svg.fadeTo(0, 1); flag_open = false; setTimeout(function () {$input.focus();}, 0); } @@ -116,7 +143,7 @@ instance.web_kanban.GaugeWidget = instance.web_kanban.AbstractField.extend({ flag_open = true; }); - if (!+input_value) { + if (this.options.force_set && !+input_value) { $svg.fadeTo(0, 0.3); $div = $('
').text(_t("Click to change value")); $div.css(css);