From 5b20f124a536552479d2928eee12e7110933851f Mon Sep 17 00:00:00 2001
From: Xavier Morel <xmo@openerp.com>
Date: Mon, 16 Apr 2012 14:33:59 +0200
Subject: [PATCH] [ADD] basic quick_create UI in kanban view

bzr revid: xmo@openerp.com-20120416123359-l60csuz0jgx37f7c
---
 addons/web_kanban/static/src/css/kanban.css   | 24 +++++++
 addons/web_kanban/static/src/js/kanban.js     | 68 ++++++++++++++++++-
 .../web_kanban/static/src/xml/web_kanban.xml  |  5 ++
 3 files changed, 94 insertions(+), 3 deletions(-)

diff --git a/addons/web_kanban/static/src/css/kanban.css b/addons/web_kanban/static/src/css/kanban.css
index d23174df74c..c74b038d1a6 100644
--- a/addons/web_kanban/static/src/css/kanban.css
+++ b/addons/web_kanban/static/src/css/kanban.css
@@ -224,6 +224,30 @@
     line-height: 1em;
 }
 
+.openerp .oe_kanban_add {
+    cursor: pointer;
+    position: absolute;
+    top: 6px;
+    right: 6px;
+    width: 16px;
+    height: 16px;
+    background: url(/web_kanban/static/src/img/plus-icon.png) no-repeat;
+}
+
+.openerp .oe_kanban_quick_create {
+    /* apply block formatting context */
+    overflow: hidden;
+}
+.openerp .oe_kanban_quick_create input {
+    display: block;
+    /* margins within width */
+    box-sizing: border-box;
+    width: 100%;
+}
+.openerp .oe_kanban_quick_create button {
+    float: right;
+}
+
 /* Custom colors are also present in kanban.js */
 /* Custom color#0 */
 .openerp .oe_kanban_color_0 .oe_kanban_color_bglight {
diff --git a/addons/web_kanban/static/src/js/kanban.js b/addons/web_kanban/static/src/js/kanban.js
index 1118c6388c8..cbcbadce1fb 100644
--- a/addons/web_kanban/static/src/js/kanban.js
+++ b/addons/web_kanban/static/src/js/kanban.js
@@ -351,6 +351,12 @@ openerp.web_kanban.KanbanGroup = openerp.web.OldWidget.extend({
             self.view.compute_groups_width();
             return false;
         });
+        this.$element.find('.oe_kanban_add').click(function () {
+            if (self.quick) { return; }
+            self.quick = new openerp.web_kanban.QuickCreate(this)
+                .on('added', self, self.proxy('quick_add'));
+            self.quick.appendTo(self.$element.find('.oe_kanban_group_header'));
+        });
         this.$records.find('.oe_kanban_show_more').click(this.do_show_more);
         if (this.state.folded) {
             this.do_toggle_fold();
@@ -373,12 +379,17 @@ openerp.web_kanban.KanbanGroup = openerp.web.OldWidget.extend({
             'offset': self.dataset_offset += self.view.limit
         }).then(this.do_add_records);
     },
-    do_add_records: function(records) {
+    do_add_records: function(records, prepend) {
         var self = this;
         _.each(records, function(record) {
             var rec = new openerp.web_kanban.KanbanRecord(self, record);
-            rec.insertBefore(self.$records.find('.oe_kanban_show_more'));
-            self.records.push(rec);
+            if (!prepend) {
+                rec.insertBefore(self.$records.find('.oe_kanban_show_more'));
+                self.records.push(rec);
+            } else {
+                rec.prependTo(self.$records);
+                self.records.unshift(rec);
+            }
         });
         this.$records.find('.oe_kanban_show_more').toggle(this.records.length < this.dataset.size())
             .find('.oe_kanban_remaining').text(this.dataset.size() - this.records.length);
@@ -401,6 +412,35 @@ openerp.web_kanban.KanbanGroup = openerp.web.OldWidget.extend({
                 self.view.dataset.write(record.id, { sequence : index });
             });
         }
+    },
+    /**
+     * Handles user event from nested quick creation view
+     *
+     * @param {String} name name to give to the new record
+     */
+    quick_add: function (name) {
+        var context = {};
+        context['default_' + this.view.group_by] = this.value;
+        // FIXME: what if name_create fails?
+        new openerp.web.Model(this.dataset.model).call(
+            'name_create', [name], {context: new openerp.web.CompoundContext(
+                    this.dataset.get_context(), context)})
+            .then(this.proxy('quick_created'))
+    },
+    /**
+     * Handles a non-erroneous response from name_create
+     *
+     * @param {(Id, String)} record name_get format for the newly created record
+     */
+    quick_created: function (record) {
+        var id = record[0], self = this;
+        this.quick.destroy();
+        delete this.quick;
+        new openerp.web.Model(this.dataset.model).call(
+                'read', [[id], this.view.fields_keys], {})
+            .then(function (records) {
+                self.do_add_records(records, 'prepend');
+            });
     }
 });
 
@@ -602,6 +642,28 @@ openerp.web_kanban.KanbanRecord = openerp.web.OldWidget.extend({
         }
     }
 });
+
+/**
+ * Quick creation view.
+ *
+ * Triggers a single event "added" with a single parameter "name", which is the
+ * name entered by the user
+ *
+ * @class
+ * @type {*}
+ */
+openerp.web_kanban.QuickCreate = openerp.web.Widget.extend({
+    template: 'KanbanView.quick_create',
+
+    start: function () {
+        var self = this;
+        this.$element.on('submit', function () {
+            self.trigger('added', self.$element.find('input').val());
+            return false;
+        });
+        return this._super();
+    }
+});
 };
 
 // vim:et fdc=0 fdl=0 foldnestmax=3 fdm=syntax:
diff --git a/addons/web_kanban/static/src/xml/web_kanban.xml b/addons/web_kanban/static/src/xml/web_kanban.xml
index 0238c7ac357..97a9463e4f2 100644
--- a/addons/web_kanban/static/src/xml/web_kanban.xml
+++ b/addons/web_kanban/static/src/xml/web_kanban.xml
@@ -20,6 +20,7 @@
         <t t-if="widget.view.group_by">
             <div class="oe_kanban_group_header">
                 <div class="oe_kanban_fold_icon"></div>
+                <div class="oe_kanban_add"></div>
                 <div class="oe_fold_column">
                     <div t-attf-class="oe_kanban_group_title #{widget.undefined_title ? 'oe_kanban_group_title_undefined' : ''}">
                         <t t-esc="widget.title"/>
@@ -62,4 +63,8 @@
     </tr>
     </table>
 </t>
+<form t-name="KanbanView.quick_create" class="oe_kanban_quick_create">
+    <input/>
+    <button type="submit">Add</button>
+</form>
 </template>