From 6ea347a4907fdc276951b319845e28be9758446f Mon Sep 17 00:00:00 2001 From: Aaron Bohy Date: Tue, 23 Jan 2018 14:30:33 +0100 Subject: [PATCH] [REF] web: Kanban: move quick create widgets ... in their own file. --- .../src/js/views/kanban/kanban_column.js | 3 +- .../kanban/kanban_column_quick_create.js | 168 ++++++++++++++++++ ...reate.js => kanban_record_quick_create.js} | 166 +---------------- .../src/js/views/kanban/kanban_renderer.js | 4 +- addons/web/views/webclient_templates.xml | 3 +- 5 files changed, 176 insertions(+), 168 deletions(-) create mode 100644 addons/web/static/src/js/views/kanban/kanban_column_quick_create.js rename addons/web/static/src/js/views/kanban/{kanban_quick_create.js => kanban_record_quick_create.js} (61%) diff --git a/addons/web/static/src/js/views/kanban/kanban_column.js b/addons/web/static/src/js/views/kanban/kanban_column.js index 563df7a4630..e17bfa7412e 100644 --- a/addons/web/static/src/js/views/kanban/kanban_column.js +++ b/addons/web/static/src/js/views/kanban/kanban_column.js @@ -4,15 +4,14 @@ odoo.define('web.KanbanColumn', function (require) { var config = require('web.config'); var core = require('web.core'); var Dialog = require('web.Dialog'); -var kanban_quick_create = require('web.kanban_quick_create'); var KanbanRecord = require('web.KanbanRecord'); +var RecordQuickCreate = require('web.kanban_record_quick_create'); var view_dialogs = require('web.view_dialogs'); var Widget = require('web.Widget'); var KanbanColumnProgressBar = require('web.KanbanColumnProgressBar'); var _t = core._t; var QWeb = core.qweb; -var RecordQuickCreate = kanban_quick_create.RecordQuickCreate; var KanbanColumn = Widget.extend({ template: 'KanbanView.Group', diff --git a/addons/web/static/src/js/views/kanban/kanban_column_quick_create.js b/addons/web/static/src/js/views/kanban/kanban_column_quick_create.js new file mode 100644 index 00000000000..b3c57bce832 --- /dev/null +++ b/addons/web/static/src/js/views/kanban/kanban_column_quick_create.js @@ -0,0 +1,168 @@ +odoo.define('web.kanban_column_quick_create', function (require) { +"use strict"; + +/** + * This file defines the ColumnQuickCreate widget for Kanban. It allows to + * create kanban columns directly from the Kanban view. + */ + +var Widget = require('web.Widget'); + +var ColumnQuickCreate = Widget.extend({ + template: 'KanbanView.ColumnQuickCreate', + events: { + 'click': 'toggleFold', + 'click input': '_onInputClicked', + 'click .o_kanban_add': '_onAddClicked', + 'focusout': '_onFocusout', + 'keydown': '_onKeydown', + 'keypress input': '_onKeypress', + 'mousedown .o_kanban_add': '_onMousedown', + }, + + /** + * @override + */ + init: function () { + this._super.apply(this, arguments); + this.folded = true; + }, + /** + * @override + */ + start: function () { + this.$header = this.$('.o_column_header'); + this.$quick_create = this.$('.o_kanban_quick_create'); + this.$input = this.$('input'); + return this._super.apply(this, arguments); + }, + + //-------------------------------------------------------------------------- + // Public + //-------------------------------------------------------------------------- + + /** + * Folds/unfolds the Column quick create widget + */ + toggleFold: function () { + this.folded = !this.folded; + this._update(); + if (!this.folded) { + this.$input.focus(); + this.trigger_up('scrollTo', {selector: '.o_column_quick_create'}); + } + }, + + //-------------------------------------------------------------------------- + // Private + //-------------------------------------------------------------------------- + + /** + * Clears the input value and notify the environment to create a column + * + * @private + */ + _add: function () { + var value = this.$input.val().trim(); + if (!value.length) { + return; + } + this.$input.val(''); + this.trigger_up('quick_create_add_column', {value: value}); + this.$input.focus(); + }, + /** + * Cancels the quick creation + * + * @private + */ + _cancel: function () { + this.folded = true; + this.$input.val(''); + this._update(); + }, + /** + * Updates the rendering according to the current state (folded/unfolded) + * + * @private + */ + _update: function () { + this.$header.toggle(this.folded); + this.$quick_create.toggle(!this.folded); + }, + + //-------------------------------------------------------------------------- + // Handlers + //-------------------------------------------------------------------------- + + /** + * @private + * @param {MouseEvent} event + */ + _onAddClicked: function (event) { + event.stopPropagation(); + this._add(); + }, + /** + * Cancels the quick creation when the input loses the focus + * + * @private + */ + _onFocusout: function () { + var hasFocus = this.$(':focus').length > 0; + if (hasFocus) { + return; + } + this._cancel(); + }, + /** + * Stops the propagation of the event to prevent the quick create from + * toggling when the user clicks in the input + * + * @private + * @param {MouseEvent} event + */ + _onInputClicked: function (event) { + event.stopPropagation(); + }, + /** + * Cancels quick creation on escape keydown event + * + * @private + * @param {KeyEvent} event + */ + _onKeydown: function (event) { + if (event.keyCode === 27) { // escape + this._cancel(); + } + }, + /** + * Validates quick creation on enter keypress event + * + * @private + * @param {KeyEvent} event + */ + _onKeypress: function (event) { + if (event.keyCode === 13) { // enter + this._add(); + } + }, + /** + * In all browsers the 'focus/blur' event is triggered before a button's + * 'click' (it's actually triggered by mousedown). + * The quick create is hidden on blur of its input but still needs to create + * the data when the "Add" button is clicked. + * This problem is adressed by suppressing the 'focus/blur' event from the + * Add button entirely by preventing the browser's default mousedown handler. + * + * @private + * @param {MouseEvent} event + */ + _onMousedown: function (event) { + event.preventDefault(); + }, +}); + +return ColumnQuickCreate; + +}); diff --git a/addons/web/static/src/js/views/kanban/kanban_quick_create.js b/addons/web/static/src/js/views/kanban/kanban_record_quick_create.js similarity index 61% rename from addons/web/static/src/js/views/kanban/kanban_quick_create.js rename to addons/web/static/src/js/views/kanban/kanban_record_quick_create.js index 66c6a2676f1..bf7e60b68c3 100644 --- a/addons/web/static/src/js/views/kanban/kanban_quick_create.js +++ b/addons/web/static/src/js/views/kanban/kanban_record_quick_create.js @@ -1,9 +1,9 @@ -odoo.define('web.kanban_quick_create', function (require) { +odoo.define('web.kanban_record_quick_create', function (require) { "use strict"; /** - * This file defines two Kanban 'quick create' widgets: one to quick create - * kanban records, and one to quick create kanban columns. + * This file defines the RecordQuickCreate widget for Kanban. It allows to + * create kanban records directly from the Kanban view. */ var core = require('web.core'); @@ -251,164 +251,6 @@ var RecordQuickCreate = Widget.extend({ }, }); -var ColumnQuickCreate = Widget.extend({ - template: 'KanbanView.ColumnQuickCreate', - events: { - 'click': 'toggleFold', - 'click input': '_onInputClicked', - 'click .o_kanban_add': '_onAddClicked', - 'focusout': '_onFocusout', - 'keydown': '_onKeydown', - 'keypress input': '_onKeypress', - 'mousedown .o_kanban_add': '_onMousedown', - }, - - /** - * @override - */ - init: function () { - this._super.apply(this, arguments); - this.folded = true; - }, - /** - * @override - */ - start: function () { - this.$header = this.$('.o_column_header'); - this.$quick_create = this.$('.o_kanban_quick_create'); - this.$input = this.$('input'); - return this._super.apply(this, arguments); - }, - - //-------------------------------------------------------------------------- - // Public - //-------------------------------------------------------------------------- - - /** - * Folds/unfolds the Column quick create widget - */ - toggleFold: function () { - this.folded = !this.folded; - this._update(); - if (!this.folded) { - this.$input.focus(); - this.trigger_up('scrollTo', {selector: '.o_column_quick_create'}); - } - }, - - //-------------------------------------------------------------------------- - // Private - //-------------------------------------------------------------------------- - - /** - * Clears the input value and notify the environment to create a column - * - * @private - */ - _add: function () { - var value = this.$input.val().trim(); - if (!value.length) { - return; - } - this.$input.val(''); - this.trigger_up('quick_create_add_column', {value: value}); - this.$input.focus(); - }, - /** - * Cancels the quick creation - * - * @private - */ - _cancel: function () { - this.folded = true; - this.$input.val(''); - this._update(); - }, - /** - * Updates the rendering according to the current state (folded/unfolded) - * - * @private - */ - _update: function () { - this.$header.toggle(this.folded); - this.$quick_create.toggle(!this.folded); - }, - - //-------------------------------------------------------------------------- - // Handlers - //-------------------------------------------------------------------------- - - /** - * @private - * @param {MouseEvent} event - */ - _onAddClicked: function (event) { - event.stopPropagation(); - this._add(); - }, - /** - * Cancels the quick creation when the input loses the focus - * - * @private - */ - _onFocusout: function () { - var hasFocus = this.$(':focus').length > 0; - if (hasFocus) { - return; - } - this._cancel(); - }, - /** - * Stops the propagation of the event to prevent the quick create from - * toggling when the user clicks in the input - * - * @private - * @param {MouseEvent} event - */ - _onInputClicked: function (event) { - event.stopPropagation(); - }, - /** - * Cancels quick creation on escape keydown event - * - * @private - * @param {KeyEvent} event - */ - _onKeydown: function (event) { - if (event.keyCode === 27) { // escape - this._cancel(); - } - }, - /** - * Validates quick creation on enter keypress event - * - * @private - * @param {KeyEvent} event - */ - _onKeypress: function (event) { - if (event.keyCode === 13) { // enter - this._add(); - } - }, - /** - * In all browsers the 'focus/blur' event is triggered before a button's - * 'click' (it's actually triggered by mousedown). - * The quick create is hidden on blur of its input but still needs to create - * the data when the "Add" button is clicked. - * This problem is adressed by suppressing the 'focus/blur' event from the - * Add button entirely by preventing the browser's default mousedown handler. - * - * @private - * @param {MouseEvent} event - */ - _onMousedown: function (event) { - event.preventDefault(); - }, -}); - -return { - RecordQuickCreate: RecordQuickCreate, - ColumnQuickCreate: ColumnQuickCreate, -}; +return RecordQuickCreate; }); diff --git a/addons/web/static/src/js/views/kanban/kanban_renderer.js b/addons/web/static/src/js/views/kanban/kanban_renderer.js index 52f57287296..dbc44d30172 100644 --- a/addons/web/static/src/js/views/kanban/kanban_renderer.js +++ b/addons/web/static/src/js/views/kanban/kanban_renderer.js @@ -5,13 +5,11 @@ var BasicRenderer = require('web.BasicRenderer'); var core = require('web.core'); var KanbanColumn = require('web.KanbanColumn'); var KanbanRecord = require('web.KanbanRecord'); -var quick_create = require('web.kanban_quick_create'); +var ColumnQuickCreate = require('web.kanban_column_quick_create'); var QWeb = require('web.QWeb'); var session = require('web.session'); var utils = require('web.utils'); -var ColumnQuickCreate = quick_create.ColumnQuickCreate; - var qweb = core.qweb; function findInNode(node, predicate) { diff --git a/addons/web/views/webclient_templates.xml b/addons/web/views/webclient_templates.xml index 44836526157..f696696af20 100644 --- a/addons/web/views/webclient_templates.xml +++ b/addons/web/views/webclient_templates.xml @@ -213,11 +213,12 @@ - + +