diff options
| author | Christophe Matthieu <chm@odoo.com> | 2019-01-10 11:07:17 +0000 |
|---|---|---|
| committer | Christophe Matthieu <chm@odoo.com> | 2019-01-17 08:40:21 +0000 |
| commit | f296992317e96562c66bd7ad59a5080d6c551ed5 (patch) | |
| tree | cd7f53aa150a734e240d930908dad1d8e5ee6943 /addons/web/static/src | |
| parent | de444335b7da30a2ab3a4c5b92c9731a023f3f07 (diff) | |
[IMP] web_editor,*: Refactoring the wysiwyg editor and 'html' field
* Creating a new structure by transforming all the plugins in the
library using the odoo inheritance system. Plugins are easier to
implement with the AbstractPlugin to add Odoo behaviors.
* From now on, the methods of the library (in this case Summernote) can
no longer be called by other modules or files. Only the wysiwyg
widgets can access it, to simplify the updating process. The wysiwyg
object serves as an interface.
* Depending on the options the snippets will be loaded or not, the
editor will be in an iframe or not... all of this is transparent from
the outside.
* Regarding iframes, all controllers related to editing have been
removed: the new API no longer needs them. This speeds up loading,
eases testing and removes complexity for the same
features.
PUBLIC FEATURES
There are several public methods on the Wysiwyg class:
* Wysiwyg.prepare (WidgetParent): returns a deferred resolved when the
library (xml, lazy, assets...) is loaded.
* Wysiwyg.getRange (DOM): returns the range (selection in the dom)
* Wysiwyg.setRange (startNode, startOffset, endNode, endOffset): creates
a range (selection in the dom)
* Wysiwyg.setRangeFromNode (DOM, options) that creates a range from an
element (option available to select all, start or end)
A jQuery selector was added: :o_editable, which indicates whether the
current element is editable. That is, if it is contained in a tag with
the attribute 'contentEditable = "true"' or in a tag with the class
o_editable.
Several methods are also present:
* focusIn: makes a focus and places the cursor at the beginning of the
element
* focusInEnd: makes a focus and places the cursor at the end of the
element
* selectContent: makes a focus and selects the content
HTML FIELD
The HTML field can receive different options:
* style-inline: {boolean} transforms a class into an inline style when
saving and vice versa when reading.
* no-attachment: {boolean} prevents the use of attachments (in media
dialog)
* cssEdit: {xml_id} to use a template containing the css to loaded in
an iframe when editing
* cssReadonly: {xml_id} to use a template containing the css to load
into an iframe when viewing in readonly
* snippets: {xml_id} snippets template (can be used with or without
cssEdit)
* wrapper: {template} qweb static template (containing a tag:
id = "wrapper") that will include the content during editing (removed
on save)
MASS MAILING
A widget was created for mass mailing. There are now two fields:
body_html and body_arch.
body_arch contains the code with the class without conversion into
inline style, useful when editing and one with the inline style that is
visible in readonly mode and sent by email.
Advantage: no spreading errors, able to update css/theme, able to do
more changes when converting to inline style so that a maximum of mail
clients have an impeccable rendering.
Co-authored-by: Antoine Guenet <age@odoo.com>
Diffstat (limited to 'addons/web/static/src')
| -rw-r--r-- | addons/web/static/src/js/core/ajax.js | 58 | ||||
| -rw-r--r-- | addons/web/static/src/js/core/domain.js | 5 | ||||
| -rw-r--r-- | addons/web/static/src/js/report/client_action.js | 63 | ||||
| -rw-r--r-- | addons/web/static/src/js/report/report.editor.js | 81 | ||||
| -rw-r--r-- | addons/web/static/src/js/report/report.js | 44 | ||||
| -rw-r--r-- | addons/web/static/src/scss/fields.scss | 2 | ||||
| -rw-r--r-- | addons/web/static/src/scss/report.editor.scss | 26 | ||||
| -rw-r--r-- | addons/web/static/src/scss/report_backend.scss | 2 | ||||
| -rw-r--r-- | addons/web/static/src/xml/report.xml | 11 |
9 files changed, 89 insertions, 203 deletions
diff --git a/addons/web/static/src/js/core/ajax.js b/addons/web/static/src/js/core/ajax.js index f844cbdaed4..1821d5a3be4 100644 --- a/addons/web/static/src/js/core/ajax.js +++ b/addons/web/static/src/js/core/ajax.js @@ -1,6 +1,7 @@ odoo.define('web.ajax', function (require) { "use strict"; +var config = require('web.config'); var core = require('web.core'); var utils = require('web.utils'); var time = require('web.time'); @@ -503,6 +504,55 @@ var loadXML = (function () { }; })(); +/** + * Loads a template file according to the given xmlId. + * + * @param {string} [xmlId] - the template xmlId + * @returns {Deferred} resolved with an object + * cssLibs: list of css files + * cssContents: list of style tag contents + * jsLibs: list of JS files + * jsContents: list of script tag contents + */ +var loadAsset = (function () { + var cache = {}; + + var load = function loadAsset(xmlId) { + if (cache[xmlId]) { + return $.when(cache[xmlId]); + } + var params = { + args: [xmlId, { + debug: config.debug + }], + kwargs: { + context: odoo.session_info.user_context, + }, + method: 'render_template', + model: 'ir.ui.view', + }; + return rpc('/web/dataset/call_kw/ir.ui.view/render_template', params).then(function (xml) { + var $xml = $(xml); + cache[xmlId] = { + cssLibs: $xml.filter('link[href]:not([type="image/x-icon"])').map(function () { + return $(this).attr('href'); + }).get(), + cssContents: $xml.filter('style').map(function () { + return $(this).html(); + }).get(), + jsLibs: $xml.filter('script[src]').map(function () { + return $(this).attr('src'); + }).get(), + jsContents: $xml.filter('script:not([src])').map(function () { + return $(this).html(); + }).get(), + }; + return cache[xmlId]; + }); + }; + + return load; +})(); /** * Loads the given js and css libraries. Note that the ajax loadJS and loadCSS methods @@ -515,6 +565,8 @@ var loadXML = (function () { * parallel. * @param {Array<string>} [libs.cssLibs=[]] A list of css files, to be loaded in * parallel + * @param {Array<string>} [libs.assetLibs=[]] A list of xmlId. The loaded template + * contains the script and link to be loaded * * @returns {Deferred} */ @@ -534,6 +586,11 @@ function loadLibs (libs) { _.each(libs.cssLibs || [], function (url) { defs.push(ajax.loadCSS(url)); }); + _.each(libs.assetLibs || [], function (xmlId) { + defs.push(loadAsset(xmlId).then(function (asset) { + return loadLibs(asset); + })); + }); return $.when.apply($, defs); } @@ -544,6 +601,7 @@ var ajax = { loadCSS: loadCSS, loadJS: loadJS, loadXML: loadXML, + loadAsset: loadAsset, loadLibs: loadLibs, get_file: get_file, post: post, diff --git a/addons/web/static/src/js/core/domain.js b/addons/web/static/src/js/core/domain.js index c31feb61a8f..97642f8e438 100644 --- a/addons/web/static/src/js/core/domain.js +++ b/addons/web/static/src/js/core/domain.js @@ -104,8 +104,13 @@ var Domain = collections.Tree.extend({ ); case "like": return (fieldValue.toLowerCase().indexOf(this._data[2].toLowerCase()) >= 0); + case "=like": + var regExp = new RegExp(this._data[2].toLowerCase().replace(/([.\[\]\{\}\+\*])/g, '\\\$1').replace(/%/g, '.*')); + return regExp.test(fieldValue.toLowerCase()); case "ilike": return (fieldValue.indexOf(this._data[2]) >= 0); + case "=ilike": + return new RegExp(this._data[2].replace(/%/g, '.*'), 'i').test(fieldValue); default: throw new Error(_.str.sprintf( "Domain %s uses an unsupported operator", diff --git a/addons/web/static/src/js/report/client_action.js b/addons/web/static/src/js/report/client_action.js index 3a520e3d6b5..099ee77a527 100644 --- a/addons/web/static/src/js/report/client_action.js +++ b/addons/web/static/src/js/report/client_action.js @@ -2,7 +2,6 @@ odoo.define('report.client_action', function (require) { 'use strict'; var AbstractAction = require('web.AbstractAction'); -var config = require('web.config'); var core = require('web.core'); var session = require('web.session'); var utils = require('report.utils'); @@ -11,8 +10,6 @@ var QWeb = core.qweb; var AUTHORIZED_MESSAGES = [ - 'report.editor:save_ok', - 'report.editor:discard_ok', 'report:do_action', ]; @@ -28,8 +25,6 @@ var ReportAction = AbstractAction.extend({ this.action_manager = parent; this._title = options.display_name || options.name; - this.edit_mode_available = false; - this.in_edit_mode = false; this.report_url = options.report_url; // Extra info that will be useful to build a qweb-pdf action. @@ -49,20 +44,12 @@ var ReportAction = AbstractAction.extend({ self.trusted_origin = utils.build_origin(trusted_protocol, trusted_host); self.$buttons = $(QWeb.render('report.client_action.ControlButtons', {})); - self.$buttons.on('click', '.o_report_edit', self.on_click_edit); self.$buttons.on('click', '.o_report_print', self.on_click_print); - self.$buttons.on('click', '.o_report_save', self.on_click_save); - self.$buttons.on('click', '.o_report_discard', self.on_click_discard); self._update_control_panel(); // Load the report in the iframe. Note that we use a relative URL. self.iframe.src = self.report_url; - - // Once the iframe is loaded, check if we can edit the report. - self.iframe.onload = function () { - self._on_iframe_loaded(); - }; }); }, @@ -82,31 +69,12 @@ var ReportAction = AbstractAction.extend({ $(window).off('message', this.on_message_received); }, - _on_iframe_loaded: function () { - var editable = $(this.iframe).contents().find('html').data('editable'); - if (editable === 1) { - this.edit_mode_available = true; - this._update_control_panel(); - } - }, - _update_control_panel: function () { this.updateControlPanel({ cp_content: { $buttons: this.$buttons, }, }); - this._update_control_panel_buttons(); - }, - - /** - * Helper allowing to toggle groups of buttons in the control panel - * according to the `this.in_edit_mode` flag. - */ - _update_control_panel_buttons: function () { - this.$buttons.filter('div.o_report_edit_mode').toggle(this.in_edit_mode); - this.$buttons.filter('div.o_report_no_edit_mode').toggle(! this.in_edit_mode); - this.$buttons.filter('div.o_edit_mode_available').toggle(config.debug && this.edit_mode_available && ! this.in_edit_mode); }, /** @@ -128,18 +96,6 @@ var ReportAction = AbstractAction.extend({ } switch(message) { - case 'report.editor:save_ok': - // Reload the iframe in order to disable the editor. - this.iframe.src = this.report_url; - this.in_edit_mode = false; - this._update_control_panel_buttons(); - break; - case 'report.editor:discard_ok': - // Reload the iframe in order to disable the editor. - this.iframe.src = this.report_url; - this.in_edit_mode = false; - this._update_control_panel_buttons(); - break; case 'report:do_action': return this.do_action(ev.originalEvent.data.action); default: @@ -157,25 +113,6 @@ var ReportAction = AbstractAction.extend({ this.iframe.contentWindow.postMessage(message, this.trusted_origin); }, - on_click_edit: function () { - // We reload the iframe with a special query string to enable the editor. - if (this.report_url.indexOf('?') === -1) { - this.iframe.src = this.report_url + '?enable_editor=1'; - } else { - this.iframe.src = this.report_url + '&enable_editor=1'; - } - this.in_edit_mode = true; - this._update_control_panel_buttons(); - }, - - on_click_discard: function () { - this._post_message('report.editor:ask_discard'); - }, - - on_click_save: function () { - this._post_message('report.editor:ask_save'); - }, - on_click_print: function () { var action = { 'type': 'ir.actions.report', diff --git a/addons/web/static/src/js/report/report.editor.js b/addons/web/static/src/js/report/report.editor.js deleted file mode 100644 index 4955417a759..00000000000 --- a/addons/web/static/src/js/report/report.editor.js +++ /dev/null @@ -1,81 +0,0 @@ -odoo.define('report.editor', function (require) { -'use strict'; - -require('web.dom_ready') -var core = require('web.core'); -var utils = require('report.utils'); -var editor = require('web_editor.editor'); -var options = require('web_editor.snippets.options'); - -var web_base_url = $('html').attr('web-base-url'); -var trusted_host = utils.get_host_from_url(web_base_url); -var trusted_protocol = utils.get_protocol_from_url(web_base_url); -var trusted_origin = utils.build_origin(trusted_protocol, trusted_host); - -// Patch the editor's behavior when it is launched inside an iframe. -if (window.self !== window.top) { - - // And now we chain some deferred to `save` and `cancel` in order to inform - // the report's client action that the actions are done. - editor.Class.include({ - save: function () { - // Force to not reload - return this._super(false).then(function () { - window.parent.postMessage('report.editor:save_ok', trusted_origin); - }); - }, - cancel: function () { - // Force to not reload - return this._super(false).then(function () { - window.parent.postMessage('report.editor:discard_ok', trusted_origin); - }); - }, - }); - - // postMessage logic. - var AUTHORIZED_MESSAGES = [ - 'report.editor:ask_discard', - 'report.editor:ask_save', - ]; - - window.addEventListener('message', function (ev) { - // Check the origin of the received message. - var message_origin = utils.build_origin(ev.source.location.protocol, ev.source.location.host); - if (message_origin === trusted_origin) { - // Check the syntax of the received message. - var message = ev.data; - if (! _.isString(message) || (_.isString(message) && ! _.contains(AUTHORIZED_MESSAGES, message))) { - return; - } - - switch (message) { - case 'report.editor:ask_save': - core.bus.trigger('editor_save_request'); - break; - case 'report.editor:ask_discard': - core.bus.trigger('editor_discard_request'); - break; - default: - } - } - }, false); -} - -options.registry.many2one.include({ - _selectRecord: function ($li) { - this._super.apply(this, arguments); - if (this.$target.data('oe-field') !== 'partner_id') { - return; - } - - var $img = $('.header .row img:first'); - var css = window.getComputedStyle($img[0]); - $img.css('max-height', css.height+'px'); - $img.attr('src', '/web/image/res.partner/' + this.ID + '/image'); - _.defer(function () { - $img.removeClass('o_dirty'); - }); - } -}); - -}); diff --git a/addons/web/static/src/js/report/report.js b/addons/web/static/src/js/report/report.js index 50d78a9d151..9072966b19e 100644 --- a/addons/web/static/src/js/report/report.js +++ b/addons/web/static/src/js/report/report.js @@ -15,26 +15,26 @@ var trusted_host = utils.get_host_from_url(web_base_url); var trusted_protocol = utils.get_protocol_from_url(web_base_url); var trusted_origin = utils.build_origin(trusted_protocol, trusted_host); -// Allow to send commands to the webclient when the editor is disabled. -if (window.location.search.indexOf('enable_editor') === -1) { - // `do_action` command - $('[res-id][res-model][view-type]') - .wrap('<a/>') - .attr('href', '#') - .on('click', function (ev) { - ev.preventDefault(); - var action = { - 'type': 'ir.actions.act_window', - 'view_type': $(this).attr('view-type'), - 'view_mode': $(this).attr('view-mode') || $(this).attr('view-type'), - 'res_id': Number($(this).attr('res-id')), - 'res_model': $(this).attr('res-model'), - 'views': [[$(this).attr('view-id') || false, $(this).attr('view-type')]], - }; - window.parent.postMessage({ - 'message': 'report:do_action', - 'action': action, - }, trusted_origin); - }); -} +// Allow sending commands to the webclient +// `do_action` command +$('[res-id][res-model][view-type]') + .wrap('<a/>') + .attr('href', '#') + .on('click', function (ev) { + ev.preventDefault(); + var action = { + 'type': 'ir.actions.act_window', + 'view_type': $(this).attr('view-type'), + 'view_mode': $(this).attr('view-mode') || $(this).attr('view-type'), + 'res_id': Number($(this).attr('res-id')), + 'res_model': $(this).attr('res-model'), + 'views': [ + [$(this).attr('view-id') || false, $(this).attr('view-type')], + ], + }; + window.parent.postMessage({ + 'message': 'report:do_action', + 'action': action, + }, trusted_origin); + }); }); diff --git a/addons/web/static/src/scss/fields.scss b/addons/web/static/src/scss/fields.scss index 81a59743788..27d0d13770e 100644 --- a/addons/web/static/src/scss/fields.scss +++ b/addons/web/static/src/scss/fields.scss @@ -33,7 +33,7 @@ } // Block fields - &.note-editor, &.oe_form_field_html, &.oe_form_field_html_text, &.oe_form_field_text, &.o_field_domain, &.o_graph_linechart, &.o_graph_barchart { + &.note-editor, &.oe_form_field_html, &.oe_form_field_text, &.o_field_domain, &.o_graph_linechart, &.o_graph_barchart { display: block; } diff --git a/addons/web/static/src/scss/report.editor.scss b/addons/web/static/src/scss/report.editor.scss deleted file mode 100644 index 544787ff6b2..00000000000 --- a/addons/web/static/src/scss/report.editor.scss +++ /dev/null @@ -1,26 +0,0 @@ -.o_editable { - &:not(:empty), &[data-oe-type] { - &[date-oe-model="ir.ui.view"] { - &, th, td { - &:hover { - -moz-box-shadow: #DDCC33 0 0 5px 2px inset; - -webkit-box-shadow: #DDCC33 0 0 5px 2px inset; - box-shadow: #DDCC33 0 0 5px 2px inset; - } - } - } - } -} - -body.o_in_iframe { - margin-top: 40px!important; - div#web_editor-top-edit { - > form { - display: none; - } - } - - .header, .footer { - display: none; - } -} diff --git a/addons/web/static/src/scss/report_backend.scss b/addons/web/static/src/scss/report_backend.scss index 62252c2d9f7..18ea620ce67 100644 --- a/addons/web/static/src/scss/report_backend.scss +++ b/addons/web/static/src/scss/report_backend.scss @@ -9,6 +9,6 @@ border: none; } -.o_report_no_edit_mode, .o_edit_mode_available, .o_report_edit_mode { +.o_report_buttons { display: inline-block; } diff --git a/addons/web/static/src/xml/report.xml b/addons/web/static/src/xml/report.xml index 49313e8de5a..7f08d009d53 100644 --- a/addons/web/static/src/xml/report.xml +++ b/addons/web/static/src/xml/report.xml @@ -7,15 +7,8 @@ <!-- Buttons of the Control Panel --> <t t-name="report.client_action.ControlButtons"> - <div class="o_report_no_edit_mode"> + <div class="o_report_buttons"> <button type="button" class="btn btn-primary o_report_print" title="Print">Print</button> </div> - <div class="o_edit_mode_available"> - <button type="button" class="btn btn-secondary o_report_edit" title="Edit">Edit</button> - </div> - <div class="o_report_edit_mode"> - <button type="button" class="btn btn-primary o_report_save" title="Save">Save</button> - <button type="button" class="btn btn-secondary o_report_discard" title="Discard">Discard</button> - </div> </t> -</template>
\ No newline at end of file +</template> |
