[IMP] web: make kanban create button jump

This commit makes the create button of a kanban view
jumping when the user click on some zone on the kanban
background.
The purpose here is to educate the user, so he can learn
how to create its first kanban card.

Task-1893021

1 files changed, 20 insertions, 0 deletions

diff --git a/addons/web/static/src/js/views/kanban/kanban_controller.js b/addons/web/static/src/js/views/kanban/kanban_controller.js
index 2383a0ac730..0f07ea6d565 100644
--- a/addons/web/static/src/js/views/kanban/kanban_controller.js
+++ b/addons/web/static/src/js/views/kanban/kanban_controller.js
@@ -33,6 +33,9 @@ var KanbanController = BasicController.extend({
         column_toggle_fold: '_onToggleColumn',
         kanban_column_records_toggle_active: '_onToggleActiveRecords',
     }),
+    events: _.extend({}, BasicController.prototype.events, {
+        click: '_onClick',
+    }),
     /**
      * @override
      * @param {Object} params
@@ -303,6 +306,23 @@ var KanbanController = BasicController.extend({
         }
     },
     /**
+     * Bounce the 'Create' button.
+     *
+     * @private
+     * @param {MouseEvent} ev
+     **/
+    _onClick: function (ev) {
+        var state = this.model.get(this.handle, {raw: true});
+        if (!state.count && this.buttons) {
+            var classesList = ['o_kanban_view', 'o_kanban_group', 'o_column_quick_create', 'o_view_nocontent_smiling_face'];
+            var $target = $(ev.target);
+            var hasClassList = _.map(classesList, function(klass){ return $target.hasClass(klass) });
+            if (_.some(hasClassList)) {
+                this.$buttons.find('.o-kanban-button-new').odooBounce();
+            }
+        }
+    },
+    /**
      * @private
      * @param {OdooEvent} ev
      */