[IMP] web_editor: move picture options from snippet to summernote bar

Difficulty for the user to understand how to change the images.
Some options summernote being in the bar and the other in the snippets editor.
Need to merge this options.

2 files changed, 17 insertions, 9 deletions

diff --git a/addons/web_editor/static/src/js/rte.summernote.js b/addons/web_editor/static/src/js/rte.summernote.js
index c696468adb4..2c7e4a6ad44 100644
--- a/addons/web_editor/static/src/js/rte.summernote.js
+++ b/addons/web_editor/static/src/js/rte.summernote.js
@@ -169,13 +169,15 @@ renderer.tplPopovers = function (lang, options) {
 
     //////////////// tooltip
 
-    $airPopover.add($linkPopover).add($imagePopover).find("button")
-        .tooltip('destroy')
-        .tooltip({
-            container: 'body',
-            trigger: 'hover',
-            placement: 'bottom'
-        }).on('click', function () {$(this).tooltip('hide');});
+    setTimeout(function () {
+        $airPopover.add($linkPopover).add($imagePopover).find("button")
+            .tooltip('destroy')
+            .tooltip({
+                container: 'body',
+                trigger: 'hover',
+                placement: 'bottom'
+            }).on('click', function () {$(this).tooltip('hide');});
+    });
 
     return $popover;
 };
@@ -207,7 +209,7 @@ eventHandler.modules.popover.button.update = function ($container, oStyle) {
 
         if (dom.isImgFont(oStyle.image)) {
 
-            $container.find('.btn-group:not(.only_fa):has(button[data-event="resize"],button[data-event="imageShape"])').addClass("hidden");
+            $container.find('.btn-group:not(.only_fa):has(button[data-event="resize"],button[data-value="img-thumbnail"])').addClass("hidden");
             $container.find('.only_fa').removeClass("hidden");
             $container.find('button[data-event="resizefa"][data-value="2"]').toggleClass("active", $(oStyle.image).hasClass("fa-2x"));
             $container.find('button[data-event="resizefa"][data-value="3"]').toggleClass("active", $(oStyle.image).hasClass("fa-3x"));
@@ -217,7 +219,6 @@ eventHandler.modules.popover.button.update = function ($container, oStyle) {
 
             $container.find('button[data-event="imageShape"][data-value="fa-spin"]').toggleClass("active", $(oStyle.image).hasClass("fa-spin"));
             $container.find('button[data-event="imageShape"][data-value="shadow"]').toggleClass("active", $(oStyle.image).hasClass("shadow"));
-            $container.find('.btn-group:has(button[data-event="imageShape"])').removeClass("hidden");
 
         } else {
 
@@ -610,6 +611,11 @@ eventHandler.attach = function (oLayoutInfo, options) {
             new widgets.MediaDialog(oLayoutInfo.editor(), event.target).appendTo(document.body);
         }
     });
+    if(oLayoutInfo.editor().is('[data-oe-model][data-oe-type="image"]')) {
+        oLayoutInfo.editor().on('click', 'img', function (event) {
+            $(event.target).trigger("dblclick");
+        });
+    }
     oLayoutInfo.editable().on('mousedown', function(e) {
         if(dom.isImg(e.target)) {
             range.createFromNode(e.target).select();
@@ -675,6 +681,7 @@ var fn_detach = eventHandler.detach;
 eventHandler.detach = function (oLayoutInfo, options) {
     fn_detach.call(this, oLayoutInfo, options);
     oLayoutInfo.editor().off("dragstart");
+    oLayoutInfo.editor().off('click');
     $(document).off('mousedown', summernote_mousedown);
     $(document).off('mouseup', summernote_mouseup);
     oLayoutInfo.editor().off("dblclick");
diff --git a/addons/web_editor/static/src/js/snippets.options.js b/addons/web_editor/static/src/js/snippets.options.js
index b4b47ca6c5c..941d43ccd50 100644
--- a/addons/web_editor/static/src/js/snippets.options.js
+++ b/addons/web_editor/static/src/js/snippets.options.js
@@ -230,6 +230,7 @@ var Option = Class.extend({
 
 /* ----- default options ---- */
 
+// to remove after 9.0 (keep for compatibility without update with -u)
 var media = Option.extend({
     start: function () {
         var self =this;