[FIX] website, *: restore media dialog uses

* web_editor, website_blog

Following the new editor's merge at https://github.com/odoo/odoo/pull/29775,
the media dialog was refactored but the code which used it outside of
the editor was not adapted at all. Also, the selected image was not
saved correctly anymore, making the media dialog useless outside the
editor in the current implementation.

- Adapted SEO image uploading and body image background choice which
  were not working anymore
- Adapted blog cover choice and gallery snippet which were strangely
  still working even though there were sending wrong parameters during
  media dialog initialization

closes odoo/odoo#30416

addons/web_editor/static/src/js/wysiwyg/widgets/media_dialog.js

@@ -141,22 +141,20 @@ var MediaDialog = Dialog.extend({
      */
     save: function () {
         var self = this;
-        var args = arguments;
         var _super = this._super;
-        if (this.multiImages) {
+        var args = arguments;
+        return $.when(this.active.save()).then(function (data) {
+            self.final_data = data;
             // In the case of multi images selection we suppose this was not to
             // replace an old media, so we only retrieve the images and save.
-            return $.when(this.active.save()).then(function (data) {
-                self.final_data = data;
-                return _super.apply(self, args);
-            });
-        }
-
-        return $.when(this.active.save()).then(function (media) {
-            self.trigger('saved', {
-                attachments: self.active.images,
-                media: media,
-            });
+            if (!self.multiImages) {
+                // TODO this dialog triggers 'save' and 'saved' with different
+                // data on close... should refactor to avoid confusion...
+                self.trigger('saved', {
+                    attachments: self.active.images,
+                    media: data,
+                });
+            }
             return _super.apply(self, args);
         });
     },

addons/website/static/src/js/editor/snippets.options.js

@@ -1004,7 +1004,7 @@ options.registry.gallery = options.Class.extend({
     addImages: function (previewMode) {
         var self = this;
         var $container = this.$('.container:first');
-        var dialog = new weWidgets.MediaDialog(this, {multiImages: true}, this.$target.closest('.o_editable'), null);
+        var dialog = new weWidgets.MediaDialog(this, {multiImages: true}, null);
         var lastImage = _.last(this._getImages());
         var index = lastImage ? this._getIndex(lastImage) : -1;
         dialog.on('save', this, function (attachments) {

addons/website/static/src/js/menu/seo.js

@@ -589,12 +589,11 @@ var MetaImageSelector = Widget.extend({
         var mediaDialog = new weWidgets.MediaDialog(this, {
             onlyImages: true,
             res_model: 'ir.ui.view',
-        }, null, $image);
+        }, $image[0]);
         mediaDialog.open();
         mediaDialog.on('save', this, function (image) {
-            var src = image.attr('src');
-            self.activeMetaImg = src;
-            self.customImgUrl = src;
+            self.activeMetaImg = image.src;
+            self.customImgUrl = image.src;
             self._updateTemplateBody();
         });
     },

addons/website/static/src/js/widgets/theme.js

@@ -5,7 +5,7 @@ var config = require('web.config');
 var core = require('web.core');
 var ColorpickerDialog = require('wysiwyg.widgets.ColorpickerDialog');
 var Dialog = require('web.Dialog');
-var widgets = require('wysiwyg.widgets');
+var weWidgets = require('wysiwyg.widgets');
 var websiteNavbarData = require('website.navbar');
 
 var _t = core._t;
@@ -269,7 +269,10 @@ var ThemeCustomizeDialog = Dialog.extend({
 
         var def = $.Deferred();
         var $image = $('<img/>');
-        var editor = new widgets.MediaDialog(this, {onlyImages: true, firstFilters: ['background']}, null, $image[0]);
+        var editor = new weWidgets.MediaDialog(this, {
+            onlyImages: true,
+            firstFilters: ['background'],
+        }, $image[0]);
 
         editor.on('save', this, function (media) { // TODO use scss customization instead (like for user colors)
             var src = $(media).attr('src');

addons/website_blog/static/src/js/website_blog.editor.js

@@ -180,7 +180,7 @@ options.registry.blog_cover = options.Class.extend({
         var editor = new weWidgets.MediaDialog(this, {
             onlyImages: true,
             firstFilters: ['background']
-        }, $image, $image[0]).open();
+        }, $image[0]).open();
         editor.on('save', this, function (event, img) {
             var src = $image.attr('src');
             this.$image.css('background-image', src ? ('url(' + src + ')') : '');