[MERGE] forward port branch saas-11.4 up to d54a3726eca

3 files changed, 139 insertions, 80 deletions

diff --git a/addons/web_editor/static/src/js/editor/editor.js b/addons/web_editor/static/src/js/editor/editor.js
index 95831dd306a..7536c1f5516 100644
--- a/addons/web_editor/static/src/js/editor/editor.js
+++ b/addons/web_editor/static/src/js/editor/editor.js
@@ -145,7 +145,9 @@ var EditorMenuBar = Widget.extend({
     save: function (reload) {
         var self = this;
         this.snippetsMenu.cleanForSave();
-        return this.rte.save().then(function () {
+        this._saveCroppedImages().then(function () {
+            return self.rte.save();
+        }).then(function () {
             if (reload !== false) {
                 return self._reload();
             }
@@ -171,6 +173,56 @@ var EditorMenuBar = Widget.extend({
         }
         return $.Deferred();
     },
+    /**
+     * @private
+     */
+    _saveCroppedImages: function () {
+        var self = this;
+        var defs = _.map(this.rte.editable().find('.o_cropped_img_to_save'), function (croppedImg) {
+            var $croppedImg = $(croppedImg);
+            $croppedImg.removeClass('o_cropped_img_to_save');
+
+            var resModel = $croppedImg.data('crop:resModel');
+            var resID = $croppedImg.data('crop:resID');
+            var cropID = $croppedImg.data('crop:id');
+            var mimetype = $croppedImg.data('crop:mimetype');
+            var originalSrc = $croppedImg.data('crop:originalSrc');
+
+            var datas = $croppedImg.attr('src').split(',')[1];
+
+            if (!cropID) {
+                var name = originalSrc + '.crop';
+                return self._rpc({
+                    model: 'ir.attachment',
+                    method: 'create',
+                    args: [{
+                        res_model: resModel,
+                        res_id: resID,
+                        name: name,
+                        datas_fname: name,
+                        datas: datas,
+                        mimetype: mimetype,
+                        url: originalSrc, // To save the original image that was cropped
+                    }],
+                }).then(function (attachmentID) {
+                    return self._rpc({
+                        model: 'ir.attachment',
+                        method: 'generate_access_token',
+                        args: [[attachmentID]],
+                    }).then(function (access_token) {
+                        $croppedImg.attr('src', '/web/image/' + attachmentID + '?access_token=' + access_token[0]);
+                    });
+                });
+            } else {
+                return self._rpc({
+                    model: 'ir.attachment',
+                    method: 'write',
+                    args: [[cropID], {datas: datas}],
+                });
+            }
+        });
+        return $.when.apply($, defs);
+    },
 
     //--------------------------------------------------------------------------
     // Handlers
diff --git a/addons/web_editor/static/src/js/editor/snippets.editor.js b/addons/web_editor/static/src/js/editor/snippets.editor.js
index 708f576ebc8..cbaa7a2fbbc 100644
--- a/addons/web_editor/static/src/js/editor/snippets.editor.js
+++ b/addons/web_editor/static/src/js/editor/snippets.editor.js
@@ -90,6 +90,7 @@ var SnippetEditor = Widget.extend({
      * @override
      */
     destroy: function () {
+        this.cleanForSave();
         this._super.apply(this, arguments);
         this.$target.removeData('snippet-editor');
     },
@@ -136,6 +137,57 @@ var SnippetEditor = Widget.extend({
         this.$el.toggleClass('o_top_cover', offset.top < 15);
     },
     /**
+     * Removes the associated snippet from the DOM and destroys the associated
+     * editor (itself).
+     */
+    removeSnippet: function () {
+        this.toggleFocus(false);
+
+        this.trigger_up('call_for_each_child_snippet', {
+            $snippet: this.$target,
+            callback: function (editor, $snippet) {
+                for (var i in editor.styles) {
+                    editor.styles[i].onRemove();
+                }
+            },
+        });
+
+        var $parent = this.$target.parent();
+        this.$target.find('*').andSelf().tooltip('destroy');
+        this.$target.remove();
+        this.$el.remove();
+
+        var node = $parent[0];
+        if (node && node.firstChild) {
+            $.summernote.core.dom.removeSpace(node, node.firstChild, 0, node.lastChild, 1);
+            if (!node.firstChild.tagName && node.firstChild.textContent === ' ') {
+                node.removeChild(node.firstChild);
+            }
+        }
+
+        if ($parent.closest(':data("snippet-editor")').length) {
+            while (!$parent.data('snippet-editor')) {
+                var $nextParent = $parent.parent();
+                if ($parent.children().length === 0 && $parent.text().trim() === '' && !$parent.hasClass('oe_structure')) {
+                    $parent.remove();
+                }
+                $parent = $nextParent;
+            }
+            if ($parent.children().length === 0 && $parent.text().trim() === '' && !$parent.hasClass('oe_structure')) {
+                _.defer(function () {
+                    $parent.data('snippet-editor').removeSnippet();
+                });
+            }
+        }
+
+        // clean editor if they are image or table in deleted content
+        $('.note-control-selection').hide();
+        $('.o_table_handler').remove();
+
+        this.trigger_up('snippet_removed');
+        this.destroy();
+    },
+    /**
      * Displays/Hides the editor overlay and notifies the associated snippet
      * options. Note: when it is displayed, this is here that the parent
      * snippet options are moved to the editor overlay.
@@ -259,59 +311,6 @@ var SnippetEditor = Widget.extend({
 
         return $.when.apply($, defs);
     },
-    /**
-     * Removes the associated snippet from the DOM and destroys the associated
-     * editor (itself).
-     *
-     * @private
-     */
-    _removeSnippet: function () {
-        this.toggleFocus(false);
-
-        this.trigger_up('call_for_each_child_snippet', {
-            $snippet: this.$target,
-            callback: function (editor, $snippet) {
-                for (var i in editor.styles) {
-                    editor.styles[i].onRemove();
-                }
-            },
-        });
-
-        var $parent = this.$target.parent();
-        this.$target.find('*').andSelf().tooltip('destroy');
-        this.$target.remove();
-        this.$el.remove();
-
-        var node = $parent[0];
-        if (node && node.firstChild) {
-            $.summernote.core.dom.removeSpace(node, node.firstChild, 0, node.lastChild, 1);
-            if (!node.firstChild.tagName && node.firstChild.textContent === ' ') {
-                node.removeChild(node.firstChild);
-            }
-        }
-
-        if ($parent.closest(':data("snippet-editor")').length) {
-            while (!$parent.data('snippet-editor')) {
-                var $nextParent = $parent.parent();
-                if ($parent.children().length === 0 && $parent.text().trim() === '' && !$parent.hasClass('oe_structure')) {
-                    $parent.remove();
-                }
-                $parent = $nextParent;
-            }
-            if ($parent.children().length === 0 && $parent.text().trim() === '' && !$parent.hasClass('oe_structure')) {
-                _.defer(function () {
-                    $parent.data('snippet-editor')._removeSnippet();
-                });
-            }
-        }
-
-        // clean editor if they are image or table in deleted content
-        $('.note-control-selection').hide();
-        $('.o_table_handler').remove();
-
-        this.trigger_up('snippet_removed');
-        this.destroy();
-    },
 
     //--------------------------------------------------------------------------
     // Handlers
@@ -495,7 +494,7 @@ var SnippetEditor = Widget.extend({
     _onRemoveClick: function (ev) {
         ev.preventDefault();
         this.trigger_up('request_history_undo_record', {$target: this.$target});
-        this._removeSnippet();
+        this.removeSnippet();
     },
 });
 
@@ -511,6 +510,7 @@ var SnippetsMenu = Widget.extend({
         deactivate_snippet: '_onDeactivateSnippet',
         drag_and_drop_stop: '_onDragAndDropStop',
         go_to_parent: '_onGoToParent',
+        remove_snippet: '_onRemoveSnippet',
         snippet_removed: '_onSnippetRemoved',
     },
 
@@ -634,9 +634,7 @@ var SnippetsMenu = Widget.extend({
      */
     cleanForSave: function () {
         this.trigger_up('ready_to_clean_for_save');
-        _.each(this.snippetEditors, function (snippetEditor) {
-            snippetEditor.cleanForSave();
-        });
+        this._destroyEditors();
 
         this.$editable.find('[contentEditable]')
             .removeAttr('contentEditable')
@@ -644,17 +642,6 @@ var SnippetsMenu = Widget.extend({
 
         this.$editable.find('.o_we_selected_image')
             .removeClass('o_we_selected_image');
-
-        // Removing query_string used to invalidate cache during image crop
-        _.each(this.$editable.find('.o_cropped_img_to_clean'), function (croppedImg) {
-            var $croppedImg = $(croppedImg);
-            var s = $croppedImg.attr('src').split('?');
-            var src = s[0];
-            var urlParams = s[1] || '';
-            urlParams = $.param(_.omit($.deparam(urlParams), 'unique'));
-            $croppedImg.attr('src', src + (urlParams ? ('?' + urlParams) : ''));
-            $croppedImg.removeClass('o_cropped_img_to_clean');
-        });
     },
 
     //--------------------------------------------------------------------------
@@ -818,6 +805,14 @@ var SnippetsMenu = Widget.extend({
         return $.when();
     },
     /**
+     * @private
+     */
+    _destroyEditors: function () {
+        _.each(this.snippetEditors, function (snippetEditor) {
+            snippetEditor.destroy();
+        });
+    },
+    /**
      * Updates the cover dimensions of the current snippet editor.
      *
      * @private
@@ -1355,15 +1350,11 @@ var SnippetsMenu = Widget.extend({
     /**
      * Called when a snippet has moved in the page.
      *
-     * @todo technically, as a snippet has been moved, all editors should be
-     * destroyed as their snippet options may not correspond to their
-     * selector anymore. However this should rarely (maybe never ?) be the case,
-     * so we might not want to do this as it would slow the editor.
-     *
      * @private
      * @param {OdooEvent} ev
      */
     _onDragAndDropStop: function (ev) {
+        this._destroyEditors();
         this._activateSnippet(ev.data.$snippet);
     },
     /**
@@ -1378,6 +1369,16 @@ var SnippetsMenu = Widget.extend({
         this._activateSnippet(ev.data.$snippet.parent());
     },
     /**
+     * @private
+     * @param {OdooEvent} ev
+     */
+    _onRemoveSnippet: function (ev) {
+        ev.stopPropagation();
+        this._createSnippetEditor(ev.data.$snippet).then(function (editor) {
+            editor.removeSnippet();
+        });
+    },
+    /**
      * Called when a snippet is removed -> checks if there is draggable snippets
      * to enable/disable as the DOM changed.
      *
diff --git a/addons/web_editor/static/src/js/editor/transcoder.js b/addons/web_editor/static/src/js/editor/transcoder.js
index fb3e69eda29..84fe3cf8c93 100644
--- a/addons/web_editor/static/src/js/editor/transcoder.js
+++ b/addons/web_editor/static/src/js/editor/transcoder.js
@@ -108,9 +108,14 @@ function getMatchedCSSRules(a) {
     // The css generates all the attributes separately and not in simplified form.
     // In order to have a better compatibility (outlook for example) we simplify the css tags.
     // e.g. border-left-style: none; border-bottom-s .... will be simplified in border-style = none
-    _.each([['margin'], ['padding'], ['border', 'style']], function (attr) {
-        var p = attr[0];
-        var e = attr[1] ? '-' + attr[1] : '';
+    _.each([
+        {property: 'margin'},
+        {property: 'padding'},
+        {property: 'border', propertyEnd: '-style', defaultValue: 'none'},
+    ], function (propertyInfo) {
+        var p = propertyInfo.property;
+        var e = propertyInfo.propertyEnd || '';
+        var defVal = propertyInfo.defaultValue || 0;
 
         if (style[p+'-top'+e] || style[p+'-right'+e] || style[p+'-bottom'+e] || style[p+'-left'+e]) {
             if (style[p+'-top'+e] === style[p+'-right'+e] && style[p+'-top'+e] === style[p+'-bottom'+e] && style[p+'-top'+e] === style[p+'-left'+e]) {
@@ -119,7 +124,7 @@ function getMatchedCSSRules(a) {
             }
             else {
                 // keep => property: [top value] [right value] [bottom value] [left value];
-                style[p+e] = (style[p+'-top'+e] || 0) + ' ' + (style[p+'-right'+e] || 0) + ' ' + (style[p+'-bottom'+e] || 0) + ' ' + (style[p+'-left'+e] || 0);
+                style[p+e] = (style[p+'-top'+e] || defVal) + ' ' + (style[p+'-right'+e] || defVal) + ' ' + (style[p+'-bottom'+e] || defVal) + ' ' + (style[p+'-left'+e] || defVal);
                 if (style[p+e].indexOf('inherit') !== -1 || style[p+e].indexOf('initial') !== -1) {
                     // keep => property-top: [top value]; property-right: [right value]; property-bottom: [bottom value]; property-left: [left value];
                     delete style[p+e];
@@ -277,11 +282,12 @@ function classToStyle($editable) {
         }
 
         // Outlook
-        if (node.nodeName === 'A' && $target.hasClass('btn') && !$target.children().length) {
-            var $hack = $('<table class="o_outlook_hack"><tr><td></td></tr></table>');
+        if (node.nodeName === 'A' && $target.hasClass('btn') && !$target.hasClass('btn-link') && !$target.children().length) {
+            var $hack = $('<table class="o_outlook_hack" style="display: inline-table;"><tr><td></td></tr></table>');
             $hack.find('td')
                 .attr('height', $target.outerHeight())
                 .css({
+                    'text-align': $target.parent().css('text-align'),
                     'margin': $target.css('padding'),
                     'border-radius': $target.css('border-radius'),
                     'background-color': $target.css('background-color'),