addons/web_kanban/static/src/js/kanban.js

   1 openerp.web_kanban = function (instance) {
   2
   3 var _t = instance.web._t,
   4    _lt = instance.web._lt;
   5 var QWeb = instance.web.qweb;
   6 instance.web.views.add('kanban', 'instance.web_kanban.KanbanView');
   7
   8 instance.web_kanban.KanbanView = instance.web.View.extend({
   9     template: "KanbanView",
  10     display_name: _lt('Kanban'),
  11     default_nr_columns: 1,
  12     view_type: "kanban",
  13     quick_create_class: "instance.web_kanban.QuickCreate",
  14     number_of_color_schemes: 10,
  15     init: function (parent, dataset, view_id, options) {
  16         this._super(parent, dataset, view_id, options);
  17         var self = this;
  18         _.defaults(this.options, {
  19             "quick_creatable": true,
  20             "creatable": true,
  21             "create_text": undefined,
  22             "read_only_mode": false,
  23             "confirm_on_delete": true,
  24         });
  25         this.fields_view = {};
  26         this.fields_keys = [];
  27         this.group_by = null;
  28         this.group_by_field = {};
  29         this.grouped_by_m2o = false;
  30         this.many2manys = [];
  31         this.state = {
  32             groups : {},
  33             records : {}
  34         };
  35         this.groups = [];
  36         this.aggregates = {};
  37         this.group_operators = ['avg', 'max', 'min', 'sum', 'count'];
  38         this.qweb = new QWeb2.Engine();
  39         this.qweb.debug = instance.session.debug;
  40         this.qweb.default_dict = _.clone(QWeb.default_dict);
  41         this.has_been_loaded = $.Deferred();
  42         this.search_domain = this.search_context = this.search_group_by = null;
  43         this.currently_dragging = {};
  44         this.limit = options.limit || 40;
  45         this.add_group_mutex = new $.Mutex();
  46     },
  47     view_loading: function(r) {
  48         return this.load_kanban(r);
  49     },
  50     start: function() {
  51         var self = this;
  52         this._super.apply(this, arguments);
  53         this.$el.on('click', '.oe_kanban_dummy_cell', function() {
  54             if (self.$buttons) {
  55                 self.$buttons.find('.oe_kanban_add_column').openerpBounce();
  56             }
  57         });
  58     },
  59     destroy: function() {
  60         this._super.apply(this, arguments);
  61         $('html').off('click.kanban');
  62     },
  63     load_kanban: function(data) {
  64         this.fields_view = data;
  65
  66         // use default order if defined in xml description
  67         var default_order = this.fields_view.arch.attrs.default_order,
  68             unsorted = !this.dataset._sort.length;
  69         if (unsorted && default_order) {
  70             this.dataset.set_sort(default_order.split(','));
  71         }
  72
  73         this.$el.addClass(this.fields_view.arch.attrs['class']);
  74         this.$buttons = $(QWeb.render("KanbanView.buttons", {'widget': this}));
  75         if (this.options.$buttons) {
  76             this.$buttons.appendTo(this.options.$buttons);
  77         } else {
  78             this.$el.find('.oe_kanban_buttons').replaceWith(this.$buttons);
  79         }
  80         this.$buttons
  81             .on('click', 'button.oe_kanban_button_new', this.do_add_record)
  82             .on('click', '.oe_kanban_add_column', this.do_add_group);
  83         this.$groups = this.$el.find('.oe_kanban_groups tr');
  84         this.fields_keys = _.keys(this.fields_view.fields);
  85         this.add_qweb_template();
  86         this.has_been_loaded.resolve();
  87         this.trigger('kanban_view_loaded', data);
  88         return $.when();
  89     },
  90     _is_quick_create_enabled: function() {
  91         if (!this.options.quick_creatable || !this.is_action_enabled('create'))
  92             return false;
  93         if (this.fields_view.arch.attrs.quick_create !== undefined)
  94             return JSON.parse(this.fields_view.arch.attrs.quick_create);
  95         return !! this.group_by;
  96     },
  97     is_action_enabled: function(action) {
  98         if (action === 'create' && !this.options.creatable)
  99             return false;
 100         return this._super(action);
 101     },
 102     /*  add_qweb_template
 103     *   select the nodes into the xml and send to extract_aggregates the nodes with TagName="field"
 104     */
 105     add_qweb_template: function() {
 106         for (var i=0, ii=this.fields_view.arch.children.length; i < ii; i++) {
 107             var child = this.fields_view.arch.children[i];
 108             if (child.tag === "templates") {
 109                 this.transform_qweb_template(child);
 110                 this.qweb.add_template(instance.web.json_node_to_xml(child));
 111                 break;
 112             } else if (child.tag === 'field') {
 113                 this.extract_aggregates(child);
 114             }
 115         }
 116     },
 117     /*  extract_aggregates
 118     *   extract the agggregates from the nodes (TagName="field")
 119     */
 120     extract_aggregates: function(node) {
 121         for (var j = 0, jj = this.group_operators.length; j < jj;  j++) {
 122             if (node.attrs[this.group_operators[j]]) {
 123                 this.aggregates[node.attrs.name] = node.attrs[this.group_operators[j]];
 124                 break;
 125             }
 126         }
 127     },
 128     transform_qweb_template: function(node) {
 129         var qweb_add_if = function(node, condition) {
 130             if (node.attrs[QWeb.prefix + '-if']) {
 131                 condition = _.str.sprintf("(%s) and (%s)", node.attrs[QWeb.prefix + '-if'], condition);
 132             }
 133             node.attrs[QWeb.prefix + '-if'] = condition;
 134         };
 135         // Process modifiers
 136         if (node.tag && node.attrs.modifiers) {
 137             var modifiers = JSON.parse(node.attrs.modifiers || '{}');
 138             if (modifiers.invisible) {
 139                 qweb_add_if(node, _.str.sprintf("!kanban_compute_domain(%s)", JSON.stringify(modifiers.invisible)));
 140             }
 141         }
 142         switch (node.tag) {
 143             case 'field':
 144                 var ftype = this.fields_view.fields[node.attrs.name].type;
 145                 ftype = node.attrs.widget ? node.attrs.widget : ftype;
 146                 if (ftype === 'many2many') {
 147                     if (_.indexOf(this.many2manys, node.attrs.name) < 0) {
 148                         this.many2manys.push(node.attrs.name);
 149                     }
 150                     node.tag = 'div';
 151                     node.attrs['class'] = (node.attrs['class'] || '') + ' oe_form_field oe_tags';
 152                 } else if (instance.web_kanban.fields_registry.contains(ftype)) {
 153                     // do nothing, the kanban record will handle it
 154                 } else {
 155                     node.tag = QWeb.prefix;
 156                     node.attrs[QWeb.prefix + '-esc'] = 'record.' + node.attrs['name'] + '.value';
 157                 }
 158                 break;
 159             case 'button':
 160             case 'a':
 161                 var type = node.attrs.type || '';
 162                 if (_.indexOf('action,object,edit,open,delete'.split(','), type) !== -1) {
 163                     _.each(node.attrs, function(v, k) {
 164                         if (_.indexOf('icon,type,name,args,string,context,states,kanban_states'.split(','), k) != -1) {
 165                             node.attrs['data-' + k] = v;
 166                             delete(node.attrs[k]);
 167                         }
 168                     });
 169                     if (node.attrs['data-string']) {
 170                         node.attrs.title = node.attrs['data-string'];
 171                     }
 172                     if (node.attrs['data-icon']) {
 173                         node.children = [{
 174                             tag: 'img',
 175                             attrs: {
 176                                 src: instance.session.prefix + '/web/static/src/img/icons/' + node.attrs['data-icon'] + '.png',
 177                                 width: '16',
 178                                 height: '16'
 179                             }
 180                         }];
 181                     }
 182                     if (node.tag == 'a') {
 183                         node.attrs.href = '#';
 184                     } else {
 185                         node.attrs.type = 'button';
 186                     }
 187                     node.attrs['class'] = (node.attrs['class'] || '') + ' oe_kanban_action oe_kanban_action_' + node.tag;
 188                 }
 189                 break;
 190         }
 191         if (node.children) {
 192             for (var i = 0, ii = node.children.length; i < ii; i++) {
 193                 this.transform_qweb_template(node.children[i]);
 194             }
 195         }
 196     },
 197     do_add_record: function() {
 198         this.dataset.index = null;
 199         this.do_switch_view('form');
 200     },
 201     do_add_group: function() {
 202         var self = this;
 203         self.do_action({
 204             name: _t("Add column"),
 205             res_model: self.group_by_field.relation,
 206             views: [[false, 'form']],
 207             type: 'ir.actions.act_window',
 208             target: "new",
 209             context: self.dataset.get_context(),
 210             flags: {
 211                 action_buttons: true,
 212             }
 213         });
 214         var am = instance.webclient.action_manager;
 215         var form = am.dialog_widget.views.form.controller;
 216         form.on("on_button_cancel", am.dialog, am.dialog.close);
 217         form.on('record_created', self, function(r) {
 218             (new instance.web.DataSet(self, self.group_by_field.relation)).name_get([r]).done(function(new_record) {
 219                 am.dialog.close();
 220                 var domain = self.dataset.domain.slice(0);
 221                 domain.push([self.group_by, '=', new_record[0][0]]);
 222                 var dataset = new instance.web.DataSetSearch(self, self.dataset.model, self.dataset.get_context(), domain);
 223                 var datagroup = {
 224                     get: function(key) {
 225                         return this[key];
 226                     },
 227                     value: new_record[0],
 228                     length: 0,
 229                     aggregates: {},
 230                 };
 231                 var new_group = new instance.web_kanban.KanbanGroup(self, [], datagroup, dataset);
 232                 self.do_add_groups([new_group]).done(function() {
 233                     $(window).scrollTo(self.groups.slice(-1)[0].$el, { axis: 'x' });
 234                 });
 235             });
 236         });
 237     },
 238     do_search: function(domain, context, group_by) {
 239         var self = this;
 240         this.search_domain = domain;
 241         this.search_context = context;
 242         this.search_group_by = group_by;
 243         return $.when(this.has_been_loaded).then(function() {
 244             self.group_by = group_by.length ? group_by[0] : self.fields_view.arch.attrs.default_group_by;
 245             self.group_by_field = self.fields_view.fields[self.group_by] || {};
 246             self.grouped_by_m2o = (self.group_by_field.type === 'many2one');
 247             self.$buttons.find('.oe_alternative').toggle(self.grouped_by_m2o);
 248             self.$el.toggleClass('oe_kanban_grouped_by_m2o', self.grouped_by_m2o);
 249             var grouping_fields = self.group_by ? [self.group_by].concat(_.keys(self.aggregates)) : undefined;
 250             if (!_.isEmpty(grouping_fields)) {
 251                 // ensure group_by fields are read.
 252                 self.fields_keys = _.unique(self.fields_keys.concat(grouping_fields));
 253             }
 254             var grouping = new instance.web.Model(self.dataset.model, context, domain).query(self.fields_keys).group_by(grouping_fields);
 255             return self.alive($.when(grouping)).done(function(groups) {
 256                 self.remove_no_result();
 257                 if (groups) {
 258                     self.do_process_groups(groups);
 259                 } else {
 260                     self.do_process_dataset();
 261                 }
 262             });
 263         });
 264     },
 265     do_process_groups: function(groups) {
 266         var self = this;
 267         this.$el.find('table:first').show();
 268         this.$el.removeClass('oe_kanban_ungrouped').addClass('oe_kanban_grouped');
 269         this.add_group_mutex.exec(function() {
 270             self.do_clear_groups();
 271             self.dataset.ids = [];
 272             if (!groups.length) {
 273                 self.no_result();
 274                 return false;
 275             }
 276             self.nb_records = 0;
 277             var remaining = groups.length - 1,
 278                 groups_array = [];
 279             return $.when.apply(null, _.map(groups, function (group, index) {
 280                 var def = $.when([]);
 281                 var dataset = new instance.web.DataSetSearch(self, self.dataset.model,
 282                     new instance.web.CompoundContext(self.dataset.get_context(), group.model.context()), group.model.domain());
 283                 if (group.attributes.length >= 1) {
 284                     def = dataset.read_slice(self.fields_keys.concat(['__last_update']), { 'limit': self.limit });
 285                 }
 286                 return def.then(function(records) {
 287                         self.nb_records += records.length;
 288                         self.dataset.ids.push.apply(self.dataset.ids, dataset.ids);
 289                         groups_array[index] = new instance.web_kanban.KanbanGroup(self, records, group, dataset);
 290                         if (!remaining--) {
 291                             self.dataset.index = self.dataset.size() ? 0 : null;
 292                             return self.do_add_groups(groups_array);
 293                         }
 294                 });
 295             })).then(function () {
 296                 if(!self.nb_records) {
 297                     self.no_result();
 298                 }
 299                 self.trigger('kanban_groups_processed');
 300             });
 301         });
 302     },
 303     do_process_dataset: function() {
 304         var self = this;
 305         this.$el.find('table:first').show();
 306         this.$el.removeClass('oe_kanban_grouped').addClass('oe_kanban_ungrouped');
 307         this.add_group_mutex.exec(function() {
 308             var def = $.Deferred();
 309             self.do_clear_groups();
 310             self.dataset.read_slice(self.fields_keys.concat(['__last_update']), { 'limit': self.limit }).done(function(records) {
 311                 var kgroup = new instance.web_kanban.KanbanGroup(self, records, null, self.dataset);
 312                 self.do_add_groups([kgroup]).done(function() {
 313                     if (_.isEmpty(records)) {
 314                         self.no_result();
 315                     }
 316                     self.trigger('kanban_dataset_processed');
 317                     def.resolve();
 318                 });
 319             }).done(null, function() {
 320                 def.reject();
 321             });
 322             return def;
 323         });
 324     },
 325     do_reload: function() {
 326         this.do_search(this.search_domain, this.search_context, this.search_group_by);
 327     },
 328     do_clear_groups: function() {
 329         var groups = this.groups.slice(0);
 330         this.groups = [];
 331         _.each(groups, function(group) {
 332             group.destroy();
 333         });
 334     },
 335     do_add_groups: function(groups) {
 336         var self = this;
 337         var $parent = this.$el.parent();
 338         this.$el.detach();
 339         _.each(groups, function(group) {
 340             self.groups[group.undefined_title ? 'unshift' : 'push'](group);
 341         });
 342         var $last_td = self.$el.find('.oe_kanban_groups_headers td:last');
 343         var groups_started = _.map(this.groups, function(group) {
 344             if (!group.is_started) {
 345                 group.on("add_record", self, function () {
 346                     self.remove_no_result();
 347                 });
 348                 return group.insertBefore($last_td);
 349             }
 350         });
 351         return $.when.apply(null, groups_started).done(function () {
 352             self.on_groups_started();
 353             self.$el.appendTo($parent);
 354             _.each(self.groups, function(group) {
 355                 group.compute_cards_auto_height();
 356             });
 357         });
 358     },
 359     on_groups_started: function() {
 360         var self = this;
 361         if (this.group_by || this.fields_keys.indexOf("sequence") !== -1) {
 362             // Kanban cards drag'n'drop
 363             var prev_widget, is_folded, record, $columns;
 364             if (this.group_by) {
 365                 $columns = this.$el.find('.oe_kanban_column .oe_kanban_column_cards, .oe_kanban_column .oe_kanban_folded_column_cards');
 366             } else {
 367                 $columns = this.$el.find('.oe_kanban_column_cards');
 368             }
 369             $columns.sortable({
 370                 handle : '.oe_kanban_draghandle',
 371                 start: function(event, ui) {
 372                     self.currently_dragging.index = ui.item.parent().children('.oe_kanban_record').index(ui.item);
 373                     self.currently_dragging.group = prev_widget = ui.item.parents('.oe_kanban_column:first').data('widget');
 374                     ui.item.find('*').on('click.prevent', function(ev) {
 375                         return false;
 376                     });
 377                     record = ui.item.data('widget');
 378                     record.$el.bind('mouseup',function(ev,ui){
 379                         if (is_folded) {
 380                             record.$el.hide();
 381                         }
 382                         record.$el.unbind('mouseup');
 383                     })
 384                     ui.placeholder.height(ui.item.height());
 385                 },
 386                 over: function(event, ui) {
 387                     var parent = $(event.target).parent();
 388                     prev_widget.highlight(false);
 389                     is_folded = parent.hasClass('oe_kanban_group_folded');
 390                     if (is_folded) {
 391                         var widget = parent.data('widget');
 392                         widget.highlight(true);
 393                         prev_widget = widget;
 394                     }
 395                  },
 396                 revert: 150,
 397                 stop: function(event, ui) {
 398                     prev_widget.highlight(false);
 399                     var old_index = self.currently_dragging.index;
 400                     var new_index = ui.item.parent().children('.oe_kanban_record').index(ui.item);
 401                     var old_group = self.currently_dragging.group;
 402                     var new_group = ui.item.parents('.oe_kanban_column:first').data('widget');
 403                     if (!(old_group.title === new_group.title && old_group.value === new_group.value && old_index == new_index)) {
 404                         self.on_record_moved(record, old_group, old_index, new_group, new_index);
 405                     }
 406                     setTimeout(function() {
 407                         // A bit hacky but could not find a better solution for Firefox (problem not present in chrome)
 408                         // http://stackoverflow.com/questions/274843/preventing-javascript-click-event-with-scriptaculous-drag-and-drop
 409                         ui.item.find('*').off('click.prevent');
 410                     }, 0);
 411                 },
 412                 scroll: false
 413             });
 414             // Keep connectWith out of the sortable initialization for performance sake:
 415             // http://www.planbox.com/blog/development/coding/jquery-ui-sortable-slow-to-bind.html
 416             $columns.sortable({ connectWith: $columns });
 417
 418             // Kanban groups drag'n'drop
 419             var start_index;
 420             if (this.grouped_by_m2o) {
 421                 this.$('.oe_kanban_groups_headers').sortable({
 422                     items: '.oe_kanban_group_header',
 423                     helper: 'clone',
 424                     axis: 'x',
 425                     opacity: 0.5,
 426                     scroll: false,
 427                     start: function(event, ui) {
 428                         start_index = ui.item.index();
 429                         self.$('.oe_kanban_record, .oe_kanban_quick_create').css({ visibility: 'hidden' });
 430                     },
 431                     stop: function(event, ui) {
 432                         var stop_index = ui.item.index();
 433                         if (start_index !== stop_index) {
 434                             var $start_column = $('.oe_kanban_groups_records .oe_kanban_column').eq(start_index);
 435                             var $stop_column = $('.oe_kanban_groups_records .oe_kanban_column').eq(stop_index);
 436                             var method = (start_index > stop_index) ? 'insertBefore' : 'insertAfter';
 437                             $start_column[method]($stop_column);
 438                             var tmp_group = self.groups.splice(start_index, 1)[0];
 439                             self.groups.splice(stop_index, 0, tmp_group);
 440                             var new_sequence = _.pluck(self.groups, 'value');
 441                             (new instance.web.DataSet(self, self.group_by_field.relation)).resequence(new_sequence).done(function(r) {
 442                                 if (r === false) {
 443                                     console.error("Kanban: could not resequence model '%s'. Probably no 'sequence' field.", self.group_by_field.relation);
 444                                 }
 445                             });
 446                         }
 447                         self.$('.oe_kanban_record, .oe_kanban_quick_create').css({ visibility: 'visible' });
 448                     }
 449                 });
 450             }
 451         } else {
 452             this.$el.find('.oe_kanban_draghandle').removeClass('oe_kanban_draghandle');
 453         }
 454         this.postprocess_m2m_tags();
 455     },
 456     on_record_moved : function(record, old_group, old_index, new_group, new_index) {
 457         var self = this;
 458         record.$el.find('[title]').tooltip('destroy');
 459         $(old_group.$el).add(new_group.$el).find('.oe_kanban_aggregates, .oe_kanban_group_length').hide();
 460         if (old_group === new_group) {
 461             new_group.records.splice(old_index, 1);
 462             new_group.records.splice(new_index, 0, record);
 463             new_group.do_save_sequences();
 464         } else {
 465             old_group.records.splice(old_index, 1);
 466             new_group.records.splice(new_index, 0, record);
 467             record.group = new_group;
 468             var data = {};
 469             data[this.group_by] = new_group.value;
 470             this.dataset.write(record.id, data, {}).done(function() {
 471                 record.do_reload();
 472                 new_group.do_save_sequences();
 473                 if (new_group.state.folded) {
 474                     new_group.do_action_toggle_fold();
 475                     record.prependTo(new_group.$records.find('.oe_kanban_column_cards'));
 476                 }
 477             }).fail(function(error, evt) {
 478                 evt.preventDefault();
 479                 alert(_t("An error has occured while moving the record to this group: ") + error.data.message);
 480                 self.do_reload(); // TODO: use draggable + sortable in order to cancel the dragging when the rcp fails
 481             });
 482         }
 483     },
 484
 485     do_show: function() {
 486         if (this.$buttons) {
 487             this.$buttons.show();
 488         }
 489         this.do_push_state({});
 490         return this._super();
 491     },
 492     do_hide: function () {
 493         if (this.$buttons) {
 494             this.$buttons.hide();
 495         }
 496         return this._super();
 497     },
 498     open_record: function(id, editable) {
 499         if (this.dataset.select_id(id)) {
 500             this.do_switch_view('form', null, { mode: editable ? "edit" : undefined });
 501         } else {
 502             this.do_warn("Kanban: could not find id#" + id);
 503         }
 504     },
 505     no_result: function() {
 506         var self = this;
 507         if (this.groups.group_by
 508             || !this.options.action
 509             || (!this.options.action.help && !this.options.action.get_empty_list_help)) {
 510             return;
 511         }
 512         this.$el.css("position", "relative");
 513         $(QWeb.render('KanbanView.nocontent', { content : this.options.action.get_empty_list_help || this.options.action.help})).insertBefore(this.$('table:first'));
 514         this.$el.find('.oe_view_nocontent').click(function() {
 515             self.$buttons.openerpBounce();
 516         });
 517     },
 518     remove_no_result: function() {
 519         this.$el.css("position", "");
 520         this.$el.find('.oe_view_nocontent').remove();
 521     },
 522
 523     /*
 524     *  postprocessing of fields type many2many
 525     *  make the rpc request for all ids/model and insert value inside .oe_tags fields
 526     */
 527     postprocess_m2m_tags: function() {
 528         var self = this;
 529         if (!this.many2manys.length) {
 530             return;
 531         }
 532         var relations = {};
 533         this.groups.forEach(function(group) {
 534             group.records.forEach(function(record) {
 535                 self.many2manys.forEach(function(name) {
 536                     var field = record.record[name];
 537                     var $el = record.$('.oe_form_field.oe_tags[name=' + name + ']').empty();
 538                     if (!relations[field.relation]) {
 539                         relations[field.relation] = { ids: [], elements: {}};
 540                     }
 541                     var rel = relations[field.relation];
 542                     field.raw_value.forEach(function(id) {
 543                         rel.ids.push(id);
 544                         if (!rel.elements[id]) {
 545                             rel.elements[id] = [];
 546                         }
 547                         rel.elements[id].push($el[0]);
 548                     });
 549                 });
 550             });
 551         });
 552        _.each(relations, function(rel, rel_name) {
 553             var dataset = new instance.web.DataSetSearch(self, rel_name, self.dataset.get_context());
 554             dataset.name_get(_.uniq(rel.ids)).done(function(result) {
 555                 result.forEach(function(nameget) {
 556                     $(rel.elements[nameget[0]]).append('<span class="oe_tag">' + _.str.escapeHTML(nameget[1]) + '</span>');
 557                 });
 558             });
 559         });
 560     }
 561 });
 562
 563
 564 function get_class(name) {
 565     return new instance.web.Registry({'tmp' : name}).get_object("tmp");
 566 }
 567
 568 instance.web_kanban.KanbanGroup = instance.web.Widget.extend({
 569     template: 'KanbanView.group_header',
 570     init: function (parent, records, group, dataset) {
 571         var self = this;
 572         this._super(parent);
 573         this.$has_been_started = $.Deferred();
 574         this.view = parent;
 575         this.group = group;
 576         this.dataset = dataset;
 577         this.dataset_offset = 0;
 578         this.aggregates = {};
 579         this.value = this.title = null;
 580         if (this.group) {
 581             this.value = group.get('value');
 582             this.title = group.get('value');
 583             if (this.value instanceof Array) {
 584                 this.title = this.value[1];
 585                 this.value = this.value[0];
 586             }
 587             var field = this.view.group_by_field;
 588             if (!_.isEmpty(field)) {
 589                 try {
 590                     this.title = instance.web.format_value(group.get('value'), field, false);
 591                 } catch(e) {}
 592             }
 593             _.each(this.view.aggregates, function(value, key) {
 594                 self.aggregates[value] = instance.web.format_value(group.get('aggregates')[key], {type: 'float'});
 595             });
 596         }
 597
 598         if (this.title === false) {
 599             this.title = _t('Undefined');
 600             this.undefined_title = true;
 601         }
 602         var key = this.view.group_by + '-' + this.value;
 603         if (!this.view.state.groups[key]) {
 604             this.view.state.groups[key] = {
 605                 folded: group ? group.get('folded') : false
 606             };
 607         }
 608         this.state = this.view.state.groups[key];
 609         this.$records = null;
 610
 611         this.records = [];
 612         this.$has_been_started.done(function() {
 613             self.do_add_records(records);
 614         });
 615     },
 616     start: function() {
 617         var self = this;
 618         if (! self.view.group_by) {
 619             self.$el.addClass("oe_kanban_no_group");
 620             self.quick = new (get_class(self.view.quick_create_class))(this, self.dataset, {}, false)
 621                 .on('added', self, self.proxy('quick_created'));
 622             self.quick.replace($(".oe_kanban_no_group_qc_placeholder"));
 623         }
 624         this.$records = $(QWeb.render('KanbanView.group_records_container', { widget : this}));
 625         this.$records.insertBefore(this.view.$el.find('.oe_kanban_groups_records td:last'));
 626
 627         this.$el.on('click', '.oe_kanban_group_dropdown li a', function(ev) {
 628             var fn = 'do_action_' + $(ev.target).data().action;
 629             if (typeof(self[fn]) === 'function') {
 630                 self[fn]($(ev.target));
 631             }
 632         });
 633
 634         this.$el.find('.oe_kanban_add').click(function () {
 635             if (self.view.quick) {
 636                 self.view.quick.trigger('close');
 637             }
 638             if (self.quick) {
 639                 return false;
 640             }
 641             self.view.$el.find('.oe_view_nocontent').hide();
 642             var ctx = {};
 643             ctx['default_' + self.view.group_by] = self.value;
 644             self.quick = new (get_class(self.view.quick_create_class))(this, self.dataset, ctx, true)
 645                 .on('added', self, self.proxy('quick_created'))
 646                 .on('close', self, function() {
 647                     self.view.$el.find('.oe_view_nocontent').show();
 648                     this.quick.destroy();
 649                     delete self.view.quick;
 650                     delete this.quick;
 651                 });
 652             self.quick.appendTo($(".oe_kanban_group_list_header", self.$records));
 653             self.quick.focus();
 654             self.view.quick = self.quick;
 655         });
 656         // Add bounce effect on image '+' of kanban header when click on empty space of kanban grouped column.
 657         this.$records.on('click', '.oe_kanban_show_more', this.do_show_more);
 658         if (this.state.folded) {
 659             this.do_toggle_fold();
 660         }
 661         this.$el.data('widget', this);
 662         this.$records.data('widget', this);
 663         this.$has_been_started.resolve();
 664         var add_btn = this.$el.find('.oe_kanban_add');
 665         add_btn.tooltip({delay: { show: 500, hide:1000 }});
 666         this.$records.find(".oe_kanban_column_cards").click(function (ev) {
 667             if (ev.target == ev.currentTarget) {
 668                 if (!self.state.folded) {
 669                     add_btn.openerpBounce();
 670                 }
 671             }
 672         });
 673         this.is_started = true;
 674         var def_tooltip = this.fetch_tooltip();
 675         return $.when(def_tooltip);
 676     },
 677     fetch_tooltip: function() {
 678         if (! this.group)
 679             return;
 680         var field_name = this.view.group_by;
 681         var field = this.view.group_by_field;
 682         var field_desc = null;
 683         var recurse = function(node) {
 684             if (node.tag === "field" && node.attrs.name === field_name) {
 685                 field_desc = node;
 686                 return;
 687             }
 688             _.each(node.children, function(child) {
 689                 if (field_desc === null)
 690                     recurse(child);
 691             });
 692         };
 693         recurse(this.view.fields_view.arch);
 694         if (! field_desc)
 695             return;
 696         var options = instance.web.py_eval(field_desc.attrs.options || '{}')
 697         if (! options.tooltip_on_group_by)
 698             return;
 699
 700         var self = this;
 701         if (this.value) {
 702             return (new instance.web.Model(field.relation)).query([options.tooltip_on_group_by])
 703                     .filter([["id", "=", this.value]]).first().then(function(res) {
 704                 self.tooltip = res[options.tooltip_on_group_by];
 705                 self.$(".oe_kanban_group_title_text").attr("title", self.tooltip || self.title || "").tooltip();
 706             });
 707         }
 708     },
 709     compute_cards_auto_height: function() {
 710         // oe_kanban_no_auto_height is an empty class used to disable this feature
 711         if (!this.view.group_by) {
 712             var min_height = 0;
 713             var els = [];
 714             _.each(this.records, function(r) {
 715                 var $e = r.$el.children(':first:not(.oe_kanban_no_auto_height)').css('min-height', 0);
 716                 if ($e.length) {
 717                     els.push($e[0]);
 718                     min_height = Math.max(min_height, $e.outerHeight());
 719                 }
 720             });
 721             $(els).css('min-height', min_height);
 722         }
 723     },
 724     destroy: function() {
 725         this._super();
 726         if (this.$records) {
 727             this.$records.remove();
 728         }
 729     },
 730     do_show_more: function(evt) {
 731         var self = this;
 732         var ids = self.view.dataset.ids.splice(0);
 733         return this.dataset.read_slice(this.view.fields_keys.concat(['__last_update']), {
 734             'limit': self.view.limit,
 735             'offset': self.dataset_offset += self.view.limit
 736         }).then(function(records) {
 737             self.view.dataset.ids = ids.concat(self.dataset.ids);
 738             self.do_add_records(records);
 739             self.compute_cards_auto_height();
 740             self.view.postprocess_m2m_tags();
 741             return records;
 742         });
 743     },
 744     do_add_records: function(records, prepend) {
 745         var self = this;
 746         var $list_header = this.$records.find('.oe_kanban_group_list_header');
 747         var $show_more = this.$records.find('.oe_kanban_show_more');
 748         var $cards = this.$records.find('.oe_kanban_column_cards');
 749
 750         _.each(records, function(record) {
 751             var rec = new instance.web_kanban.KanbanRecord(self, record);
 752             if (!prepend) {
 753                 rec.appendTo($cards);
 754                 self.records.push(rec);
 755             } else {
 756                 rec.prependTo($cards);
 757                 self.records.unshift(rec);
 758             }
 759         });
 760         if ($show_more.length) {
 761             var size = this.dataset.size();
 762             $show_more.toggle(this.records.length < size).find('.oe_kanban_remaining').text(size - this.records.length);
 763         }
 764     },
 765     remove_record: function(id, remove_from_dataset) {
 766         for (var i = 0; i < this.records.length; i++) {
 767             if (this.records[i]['id'] === id) {
 768                 this.records.splice(i, 1);
 769                 i--;
 770             }
 771         }
 772     },
 773     do_toggle_fold: function(compute_width) {
 774         this.$el.add(this.$records).toggleClass('oe_kanban_group_folded');
 775         this.state.folded = this.$el.is('.oe_kanban_group_folded');
 776         this.$("ul.oe_kanban_group_dropdown li a[data-action=toggle_fold]").text((this.state.folded) ? _t("Unfold") : _t("Fold"));
 777     },
 778     do_action_toggle_fold: function() {
 779         this.do_toggle_fold();
 780     },
 781     do_action_edit: function() {
 782         var self = this;
 783         self.do_action({
 784             res_id: this.value,
 785             name: _t("Edit column"),
 786             res_model: self.view.group_by_field.relation,
 787             views: [[false, 'form']],
 788             type: 'ir.actions.act_window',
 789             target: "new",
 790             flags: {
 791                 action_buttons: true,
 792             }
 793         });
 794         var am = instance.webclient.action_manager;
 795         var form = am.dialog_widget.views.form.controller;
 796         form.on("on_button_cancel", am.dialog, function() { return am.dialog.$dialog_box.modal('hide'); });
 797         form.on('record_saved', self, function() {
 798             am.dialog.$dialog_box.modal('hide');
 799             self.view.do_reload();
 800         });
 801     },
 802     do_action_delete: function() {
 803         var self = this;
 804         if (confirm(_t("Are you sure to remove this column ?"))) {
 805             (new instance.web.DataSet(self, self.view.group_by_field.relation)).unlink([self.value]).done(function(r) {
 806                 self.view.do_reload();
 807             });
 808         }
 809     },
 810     do_save_sequences: function() {
 811         var self = this;
 812         if (_.indexOf(this.view.fields_keys, 'sequence') > -1) {
 813             var new_sequence = _.pluck(this.records, 'id');
 814             self.view.dataset.resequence(new_sequence);
 815         }
 816     },
 817     /**
 818      * Handles a newly created record
 819      *
 820      * @param {id} id of the newly created record
 821      */
 822     quick_created: function (record) {
 823         var id = record, self = this;
 824         self.view.remove_no_result();
 825         self.trigger("add_record");
 826         this.dataset.read_ids([id], this.view.fields_keys)
 827             .done(function (records) {
 828                 self.view.dataset.ids.push(id);
 829                 self.do_add_records(records, true);
 830             });
 831     },
 832     highlight: function(show){
 833         if(show){
 834             this.$el.addClass('oe_kanban_column_higlight');
 835             this.$records.addClass('oe_kanban_column_higlight');
 836         }else{
 837             this.$el.removeClass('oe_kanban_column_higlight');
 838             this.$records.removeClass('oe_kanban_column_higlight');
 839         }
 840     }
 841 });
 842
 843 instance.web_kanban.KanbanRecord = instance.web.Widget.extend({
 844     template: 'KanbanView.record',
 845     init: function (parent, record) {
 846         this._super(parent);
 847         this.group = parent;
 848         this.view = parent.view;
 849         this.id = null;
 850         this.set_record(record);
 851         if (!this.view.state.records[this.id]) {
 852             this.view.state.records[this.id] = {
 853                 folded: false
 854             };
 855         }
 856         this.state = this.view.state.records[this.id];
 857         this.fields = {};
 858     },
 859     set_record: function(record) {
 860         var self = this;
 861         this.id = record.id;
 862         this.values = {};
 863         _.each(record, function(v, k) {
 864             self.values[k] = {
 865                 value: v
 866             };
 867         });
 868         this.record = this.transform_record(record);
 869     },
 870     start: function() {
 871         var self = this;
 872         this._super();
 873         this.init_content();
 874     },
 875     init_content: function() {
 876         var self = this;
 877         self.sub_widgets = [];
 878         this.$("[data-field_id]").each(function() {
 879             self.add_widget($(this));
 880         });
 881         this.$el.data('widget', this);
 882         this.bind_events();
 883     },
 884     transform_record: function(record) {
 885         var self = this,
 886             new_record = {};
 887         _.each(record, function(value, name) {
 888             var r = _.clone(self.view.fields_view.fields[name] || {});
 889             if ((r.type === 'date' || r.type === 'datetime') && value) {
 890                 r.raw_value = instance.web.auto_str_to_date(value);
 891             } else {
 892                 r.raw_value = value;
 893             }
 894             r.value = instance.web.format_value(value, r);
 895             new_record[name] = r;
 896         });
 897         return new_record;
 898     },
 899     renderElement: function() {
 900         this.qweb_context = {
 901             instance: instance,
 902             record: this.record,
 903             widget: this,
 904             read_only_mode: this.view.options.read_only_mode,
 905         };
 906         for (var p in this) {
 907             if (_.str.startsWith(p, 'kanban_')) {
 908                 this.qweb_context[p] = _.bind(this[p], this);
 909             }
 910         }
 911         var $el = instance.web.qweb.render(this.template, {
 912             'widget': this,
 913             'content': this.view.qweb.render('kanban-box', this.qweb_context)
 914         });
 915         this.replaceElement($el);
 916         this.replace_fields();
 917     },
 918     replace_fields: function() {
 919         var self = this;
 920         this.$("field").each(function() {
 921             var $field = $(this);
 922             var $nfield = $("<span></span");
 923             var id = _.uniqueId("kanbanfield");
 924             self.fields[id] = $field;
 925             $nfield.attr("data-field_id", id);
 926             $field.replaceWith($nfield);
 927         });
 928     },
 929     add_widget: function($node) {
 930         var $orig = this.fields[$node.data("field_id")];
 931         var field = this.record[$orig.attr("name")];
 932         var type = field.type;
 933         type = $orig.attr("widget") ? $orig.attr("widget") : type;
 934         var obj = instance.web_kanban.fields_registry.get_object(type);
 935         var widget = new obj(this, field, $orig);
 936         this.sub_widgets.push(widget);
 937         widget.replace($node);
 938     },
 939     bind_events: function() {
 940         var self = this;
 941         this.setup_color_picker();
 942         this.$el.find('[title]').each(function(){
 943             $(this).tooltip({
 944                 delay: { show: 500, hide: 0},
 945                 container: $(this),
 946                 title: function() {
 947                     var template = $(this).attr('tooltip');
 948                     if (!self.view.qweb.has_template(template)) {
 949                         return false;
 950                     }
 951                     return self.view.qweb.render(template, self.qweb_context);
 952                 },
 953             });
 954         });
 955
 956         // If no draghandle is found, make the whole card as draghandle (provided one can edit)
 957         if (!this.$el.find('.oe_kanban_draghandle').length) {
 958             this.$el.children(':first')
 959                 .toggleClass('oe_kanban_draghandle', this.view.is_action_enabled('edit'));
 960         }
 961
 962         this.$el.find('.oe_kanban_action').click(function(ev) {
 963             ev.preventDefault();
 964             var $action = $(this),
 965                 type = $action.data('type') || 'button',
 966                 method = 'do_action_' + (type === 'action' ? 'object' : type);
 967             if ((type === 'edit' || type === 'delete') && ! self.view.is_action_enabled(type)) {
 968                 self.view.open_record(self.id, true);
 969             } else if (_.str.startsWith(type, 'switch_')) {
 970                 self.view.do_switch_view(type.substr(7));
 971             } else if (typeof self[method] === 'function') {
 972                 self[method]($action);
 973             } else {
 974                 self.do_warn("Kanban: no action for type : " + type);
 975             }
 976         });
 977
 978         if (this.$el.find('.oe_kanban_global_click,.oe_kanban_global_click_edit').length) {
 979             this.$el.on('click', function(ev) {
 980                 if (!ev.isTrigger && !$._data(ev.target, 'events')) {
 981                     var trigger = true;
 982                     var elem = ev.target;
 983                     var ischild = true;
 984                     var children = [];
 985                     while (elem) {
 986                         var events = $._data(elem, 'events');
 987                         if (elem == ev.currentTarget) {
 988                             ischild = false;
 989                         }
 990                         if (ischild) {
 991                             children.push(elem);
 992                             if (events && events.click) {
 993                                 // do not trigger global click if one child has a click event registered
 994                                 trigger = false;
 995                             }
 996                         }
 997                         if (trigger && events && events.click) {
 998                             _.each(events.click, function(click_event) {
 999                                 if (click_event.selector) {
1000                                     // For each parent of original target, check if a
1001                                     // delegated click is bound to any previously found children
1002                                     _.each(children, function(child) {
1003                                         if ($(child).is(click_event.selector)) {
1004                                             trigger = false;
1005                                         }
1006                                     });
1007                                 }
1008                             });
1009                         }
1010                         elem = elem.parentElement;
1011                     }
1012                     if (trigger) {
1013                         self.on_card_clicked(ev);
1014                     }
1015                 }
1016             });
1017         }
1018     },
1019     /* actions when user click on the block with a specific class
1020      *  open on normal view : oe_kanban_global_click
1021      *  open on form/edit view : oe_kanban_global_click_edit
1022      */
1023     on_card_clicked: function(ev) {
1024         if(this.$el.find('.oe_kanban_global_click_edit').size()>0)
1025             this.do_action_edit();
1026         else
1027             this.do_action_open();
1028     },
1029     setup_color_picker: function() {
1030         var self = this;
1031         var $el = this.$el.find('ul.oe_kanban_colorpicker');
1032         if ($el.length) {
1033             $el.html(QWeb.render('KanbanColorPicker', {
1034                 widget: this
1035             }));
1036             $el.on('click', 'a', function(ev) {
1037                 ev.preventDefault();
1038                 var color_field = $(this).parents('.oe_kanban_colorpicker').first().data('field') || 'color';
1039                 var data = {};
1040                 data[color_field] = $(this).data('color');
1041                 self.view.dataset.write(self.id, data, {}).done(function() {
1042                     self.record[color_field] = $(this).data('color');
1043                     self.do_reload();
1044                 });
1045             });
1046         }
1047     },
1048     do_action_delete: function($action) {
1049         var self = this;
1050         function do_it() {
1051             return $.when(self.view.dataset.unlink([self.id])).done(function() {
1052                 self.group.remove_record(self.id);
1053                 self.destroy();
1054             });
1055         }
1056         if (this.view.options.confirm_on_delete) {
1057             if (confirm(_t("Are you sure you want to delete this record ?"))) {
1058                 return do_it();
1059             }
1060         } else
1061             return do_it();
1062     },
1063     do_action_edit: function($action) {
1064         this.view.open_record(this.id, true);
1065     },
1066     do_action_open: function($action) {
1067         this.view.open_record(this.id);
1068     },
1069     do_action_object: function ($action) {
1070         var button_attrs = $action.data();
1071         this.view.do_execute_action(button_attrs, this.view.dataset, this.id, this.do_reload);
1072     },
1073     do_reload: function() {
1074         var self = this;
1075         this.view.dataset.read_ids([this.id], this.view.fields_keys.concat(['__last_update'])).done(function(records) {
1076              _.each(self.sub_widgets, function(el) {
1077                  el.destroy();
1078              });
1079              self.sub_widgets = [];
1080             if (records.length) {
1081                 self.set_record(records[0]);
1082                 self.renderElement();
1083                 self.init_content();
1084                 self.group.compute_cards_auto_height();
1085                 self.view.postprocess_m2m_tags();
1086             } else {
1087                 self.destroy();
1088             }
1089         });
1090     },
1091     kanban_getcolor: function(variable) {
1092         var index = 0;
1093         switch (typeof(variable)) {
1094             case 'string':
1095                 for (var i=0, ii=variable.length; i<ii; i++) {
1096                     index += variable.charCodeAt(i);
1097                 }
1098                 break;
1099             case 'number':
1100                 index = Math.round(variable);
1101                 break;
1102             default:
1103                 return '';
1104         }
1105         var color = (index % this.view.number_of_color_schemes);
1106         return color;
1107     },
1108     kanban_color: function(variable) {
1109         var color = this.kanban_getcolor(variable);
1110         return color === '' ? '' : 'oe_kanban_color_' + color;
1111     },
1112     kanban_image: function(model, field, id, cache, options) {
1113         options = options || {};
1114         var url;
1115         if (this.record[field] && this.record[field].value && !instance.web.form.is_bin_size(this.record[field].value)) {
1116             url = 'data:image/png;base64,' + this.record[field].value;
1117         } else if (this.record[field] && ! this.record[field].value) {
1118             url = "/web/static/src/img/placeholder.png";
1119         } else {
1120             id = JSON.stringify(id);
1121             if (options.preview_image)
1122                 field = options.preview_image;
1123             url = this.session.url('/web/binary/image', {model: model, field: field, id: id});
1124             if (cache !== undefined) {
1125                 // Set the cache duration in seconds.
1126                 url += '&cache=' + parseInt(cache, 10);
1127             }
1128         }
1129         return url;
1130     },
1131     kanban_text_ellipsis: function(s, size) {
1132         size = size || 160;
1133         if (!s) {
1134             return '';
1135         } else if (s.length <= size) {
1136             return s;
1137         } else {
1138             return s.substr(0, size) + '...';
1139         }
1140     },
1141     kanban_compute_domain: function(domain) {
1142         return instance.web.form.compute_domain(domain, this.values);
1143     }
1144 });
1145
1146 /**
1147  * Quick creation view.
1148  *
1149  * Triggers a single event "added" with a single parameter "name", which is the
1150  * name entered by the user
1151  *
1152  * @class
1153  * @type {*}
1154  */
1155 instance.web_kanban.QuickCreate = instance.web.Widget.extend({
1156     template: 'KanbanView.quick_create',
1157
1158     /**
1159      * close_btn: If true, the widget will display a "Close" button able to trigger
1160      * a "close" event.
1161      */
1162     init: function(parent, dataset, context, buttons) {
1163         this._super(parent);
1164         this._dataset = dataset;
1165         this._buttons = buttons || false;
1166         this._context = context || {};
1167     },
1168     start: function () {
1169         var self = this;
1170         self.$input = this.$el.find('input');
1171         self.$input.keyup(function(event){
1172             if(event.keyCode == 13){
1173                 self.quick_add();
1174             }
1175         });
1176         $(".oe_kanban_quick_create").focusout(function (e) {
1177             var val = self.$el.find('input').val();
1178             if (/^\s*$/.test(val)) { self.trigger('close'); }
1179             e.stopImmediatePropagation();
1180         });
1181         $(".oe_kanban_quick_create_add", this.$el).click(function () {
1182             self.quick_add();
1183             self.focus();
1184         });
1185         $(".oe_kanban_quick_create_close", this.$el).click(function (ev) {
1186             ev.preventDefault();
1187             self.trigger('close');
1188         });
1189         self.$input.keyup(function(e) {
1190             if (e.keyCode == 27 && self._buttons) {
1191                 self.trigger('close');
1192             }
1193         });
1194     },
1195     focus: function() {
1196         this.$el.find('input').focus();
1197     },
1198     /**
1199      * Handles user event from nested quick creation view
1200      */
1201     quick_add: function () {
1202         var self = this;
1203         var val = this.$input.val();
1204         if (/^\s*$/.test(val)) { this.$el.remove(); return; }
1205         this._dataset.call(
1206             'name_create', [val, new instance.web.CompoundContext(
1207                     this._dataset.get_context(), this._context)])
1208             .then(function(record) {
1209                 self.$input.val("");
1210                 self.trigger('added', record[0]);
1211             }, function(error, event) {
1212                 event.preventDefault();
1213                 return self.slow_create();
1214             });
1215     },
1216     slow_create: function() {
1217         var self = this;
1218         var pop = new instance.web.form.SelectCreatePopup(this);
1219         pop.select_element(
1220             self._dataset.model,
1221             {
1222                 title: _t("Create: ") + (this.string || this.name),
1223                 initial_view: "form",
1224                 disable_multiple_selection: true
1225             },
1226             [],
1227             {"default_name": self.$input.val()}
1228         );
1229         pop.on("elements_selected", self, function(element_ids) {
1230             self.$input.val("");
1231             self.trigger('added', element_ids[0]);
1232         });
1233     }
1234 });
1235
1236 /**
1237  * Interface to be implemented by kanban fields.
1238  *
1239  */
1240 instance.web_kanban.FieldInterface = {
1241     /**
1242         Constructor.
1243         - parent: The widget's parent.
1244         - field: A dictionary giving details about the field, including the current field's value in the
1245             raw_value field.
1246         - $node: The field <field> tag as it appears in the view, encapsulated in a jQuery object.
1247     */
1248     init: function(parent, field, $node) {},
1249 };
1250
1251 /**
1252  * Abstract class for classes implementing FieldInterface.
1253  *
1254  * Properties:
1255  *     - value: useful property to hold the value of the field. By default, the constructor
1256  *     sets value property.
1257  *
1258  */
1259 instance.web_kanban.AbstractField = instance.web.Widget.extend(instance.web_kanban.FieldInterface, {
1260     /**
1261         Constructor that saves the field and $node parameters and sets the "value" property.
1262     */
1263     init: function(parent, field, $node) {
1264         this._super(parent);
1265         this.field = field;
1266         this.$node = $node;
1267         this.options = instance.web.py_eval(this.$node.attr("options") || '{}');
1268         this.set("value", field.raw_value);
1269     },
1270 });
1271
1272 instance.web_kanban.Priority = instance.web_kanban.AbstractField.extend({
1273     init: function(parent, field, $node) {
1274         this._super.apply(this, arguments);
1275         this.name = $node.attr('name')
1276         this.parent = parent;
1277     },
1278     prepare_priority: function() {
1279         var self = this;
1280         var selection = this.field.selection || [];
1281         var init_value = selection && selection[0][0] || 0;
1282         var data = _.map(selection.slice(1), function(element, index) {
1283             var value = {
1284                 'value': element[0],
1285                 'name': element[1],
1286                 'click_value': element[0],
1287             }
1288             if (index == 0 && self.get('value') == element[0]) {
1289                 value['click_value'] = init_value;
1290             }
1291             return value;
1292         });
1293         return data;
1294     },
1295     renderElement: function() {
1296         var self = this;
1297         this.record_id = self.parent.id;
1298         this.priorities = self.prepare_priority();
1299         this.$el = $(QWeb.render("Priority", {'widget': this}));
1300         this.$el.find('.oe_legend').click(self.do_action.bind(self));
1301     },
1302     do_action: function(e) {
1303         var self = this;
1304         var li = $(e.target).closest( "li" );
1305         if (li.length) {
1306             var value = {};
1307             value[self.name] = String(li.data('value'));
1308             return self.parent.view.dataset._model.call('write', [[self.record_id], value, self.parent.view.dataset.get_context()]).done(self.reload_record.bind(self.parent));
1309         }
1310     },
1311     reload_record: function() {
1312         this.do_reload();
1313     },
1314 });
1315
1316 instance.web_kanban.KanbanSelection = instance.web_kanban.AbstractField.extend({
1317     init: function(parent, field, $node) {
1318         this._super.apply(this, arguments);
1319         this.name = $node.attr('name')
1320         this.parent = parent;
1321     },
1322     prepare_dropdown_selection: function() {
1323         var data = [];
1324         _.map(this.field.selection || [], function(res) {
1325             var value = {
1326                 'name': res[0],
1327                 'tooltip': res[1],
1328                 'state_name': res[1],
1329             }
1330             if (res[0] == 'normal') { value['state_class'] = 'oe_kanban_status'; }
1331             else if (res[0] == 'done') { value['state_class'] = 'oe_kanban_status oe_kanban_status_green'; }
1332             else { value['state_class'] = 'oe_kanban_status oe_kanban_status_red'; }
1333             data.push(value);
1334         });
1335         return data;
1336     },
1337     renderElement: function() {
1338         var self = this;
1339         this.record_id = self.parent.id;
1340         this.states = self.prepare_dropdown_selection();;
1341         this.$el = $(QWeb.render("KanbanSelection", {'widget': self}));
1342         this.$el.find('.oe_legend').click(self.do_action.bind(self));
1343     },
1344     do_action: function(e) {
1345         var self = this;
1346         var li = $(e.target).closest( "li" );
1347         if (li.length) {
1348             var value = {};
1349             value[self.name] = String(li.data('value'));
1350             return self.parent.view.dataset._model.call('write', [[self.record_id], value, self.parent.view.dataset.get_context()]).done(self.reload_record.bind(self.parent));
1351         }
1352     },
1353     reload_record: function() {
1354         this.do_reload();
1355     },
1356 });
1357
1358 instance.web_kanban.fields_registry = new instance.web.Registry({});
1359 instance.web_kanban.fields_registry.add('priority','instance.web_kanban.Priority');
1360 instance.web_kanban.fields_registry.add('kanban_state_selection','instance.web_kanban.KanbanSelection');
1361 };
1362
1363 // vim:et fdc=0 fdl=0 foldnestmax=3 fdm=syntax: