[IMP] website editor: remove font size from media editor (font size is available in image edition bar)

5 files changed, 17 insertions, 64 deletions

diff --git a/addons/website/static/src/css/editor.css b/addons/website/static/src/css/editor.css
index 4b2dca452cd..cc69336f23a 100644
--- a/addons/website/static/src/css/editor.css
+++ b/addons/website/static/src/css/editor.css
@@ -368,14 +368,7 @@ ul.oe_menu_editor .disclose {
 .modal #icon-search {
   padding-left: 2.5em;
 }
-.modal #fa-preview {
-  text-align: center;
-}
-.modal #fa-preview span {
-  cursor: pointer;
-  padding: 0 15px;
-}
-.modal #fa-preview .font-icons-selected {
+.font-icons-selected {
   background-color: #ddd;
 }
 
diff --git a/addons/website/static/src/css/editor.sass b/addons/website/static/src/css/editor.sass
index 73b04009833..ed0400d0348 100644
--- a/addons/website/static/src/css/editor.sass
+++ b/addons/website/static/src/css/editor.sass
@@ -311,14 +311,8 @@ ul.oe_menu_editor
     #icon-search
         padding-left: 2.5em
 
-    #fa-preview
-        text-align: center
-
-        span
-            cursor: pointer
-            padding: 0 15px
-        .font-icons-selected
-            background-color: #ddd
+    .font-icons-selected
+        background-color: #ddd
 
 $attachment-border-color: #848490
 .existing-attachments
diff --git a/addons/website/static/src/js/website.editor.js b/addons/website/static/src/js/website.editor.js
index a1c87926015..4efb93c62b8 100644
--- a/addons/website/static/src/js/website.editor.js
+++ b/addons/website/static/src/js/website.editor.js
@@ -2307,20 +2307,13 @@ define(['summernote/summernote'], function () {
     website.editor.FontIconsDialog = openerp.Widget.extend({
         template: 'website.editor.dialog.font-icons',
         events : _.extend({}, website.editor.Dialog.prototype.events, {
-            change: 'update_preview',
             'click .font-icons-icon': function (e) {
                 e.preventDefault();
                 e.stopPropagation();
 
                 this.$('#fa-icon').val(e.target.getAttribute('data-id'));
-                this.update_preview();
-            },
-            'click #fa-preview span': function (e) {
-                e.preventDefault();
-                e.stopPropagation();
-
-                this.$('#fa-size').val(e.target.getAttribute('data-size'));
-                this.update_preview();
+                $(".font-icons-icon").removeClass("font-icons-selected");
+                $(event.target).addClass("font-icons-selected");
             },
         }),
 
@@ -2339,7 +2332,6 @@ define(['summernote/summernote'], function () {
             this.media = media;
         },
         start: function () {
-            this.$preview = this.$('.preview-container').detach();
             return this._super().then(this.proxy('load_data'));
         },
         search: function (needle) {
@@ -2383,6 +2375,7 @@ define(['summernote/summernote'], function () {
                 var media = document.createElement('span');
                 $(this.media).replaceWith(media);
                 this.media = media;
+                style = style.replace(/\s*width:[^;]+/, '');
             }
             $(this.media).attr("class", _.compact(final_classes).join(' ')).attr("style", style);
         },
@@ -2437,7 +2430,9 @@ define(['summernote/summernote'], function () {
                     case 'fa-border':
                         this.$('#fa-border').prop('checked', true);
                         continue;
+                    case '': continue;
                     default:
+                        $(".font-icons-icon").removeClass("font-icons-selected").filter("."+cls).addClass("font-icons-selected");
                         for (var k=0; k<this.icons.length; k++) {
                             if (this.icons.indexOf(cls) !== -1) {
                                 this.$('#fa-icon').val(cls);
@@ -2446,7 +2441,6 @@ define(['summernote/summernote'], function () {
                         }
                 }
             }
-            this.update_preview();
         },
         /**
          * Serializes the dialog to an array of FontAwesome classes. Includes
@@ -2462,31 +2456,6 @@ define(['summernote/summernote'], function () {
                 this.$('#fa-border').prop('checked') ? 'fa-border' : ''
             ];
         },
-        update_preview: function () {
-            this.$preview.empty();
-            var $preview = this.$('#fa-preview').empty();
-
-            var sizes = ['fa-1x', 'fa-2x', 'fa-3x', 'fa-4x', 'fa-5x'];
-            var classes = this.get_fa_classes();
-            var no_sizes = _.difference(classes, sizes).join(' ');
-            var selected = false;
-            for (var i = sizes.length - 1; i >= 0; i--) {
-                var size = sizes[i];
-
-                var $p = $('<span>')
-                        .attr('data-size', size)
-                        .addClass(size)
-                        .addClass(no_sizes);
-
-                if ((size && _.contains(classes, size)) || (size === "" && !selected)) {
-                    this.$preview.append($p.clone());
-                    this.$('#fa-size').val(size);
-                    $p.addClass('font-icons-selected');
-                    selected = true;
-                }
-                $preview.prepend($p);
-            }
-        },
         clear: function () {
             this.media.className = this.media.className.replace(/(^|\s)(fa(\s|$)|fa-[^\s]*)/g, ' ');
         },
diff --git a/addons/website/static/src/js/website.tour.rte.js b/addons/website/static/src/js/website.tour.rte.js
index 5688ba2372d..e0940627850 100644
--- a/addons/website/static/src/js/website.tour.rte.js
+++ b/addons/website/static/src/js/website.tour.rte.js
@@ -47,7 +47,7 @@
                     var $el = $(this.element);
                     var html = '<h1 id="text_title_id">Batnae municipium in Anthemusia</h1>     '+
                         '\n     <p>Batnae municipium in Anthemusia conditum Macedonum manu priscorum ab Euphrate flumine brevi spatio disparatur, refertum mercatoribus opulentis, ubi annua sollemnitate prope Septembris initium mensis ad.</p>'+
-                        '\n     <p>    Quam <img class="img-responsive-25" src="/website/static/src/img/text_image.png"/> quidem <span class="fa fa-flag fa-2x"></span> partem accusationis admiratus sum et moleste tuli potissimum esse Atratino datam. Neque enim decebat neque aetas.</p>'+
+                        '\n     <p>    Quam <img style="width: 25%" src="/website/static/src/img/text_image.png"/> quidem <span class="fa fa-flag fa-2x"></span> partem accusationis admiratus sum et moleste tuli potissimum esse Atratino datam. Neque enim decebat neque aetas.</p>'+
                         '\n     <p>Et hanc quidem praeter oppida multa duae civitates exornant Seleucia opus Seleuci regis, et Claudiopolis quam deduxit coloniam Claudius Caesar. Isaura enim antehac nimium potens, olim subversa ut rebellatrix.</p>'+
                         '<p>Harum trium sententiarum nulli prorsus assentior.</p>';
                     $el.html(html);
@@ -157,7 +157,7 @@
             },
             {
                 waitFor:   '#wrapwrap > main > div > section .row > div:first:has( font:last:containsExact(i) ):has( p:first:containsRegex(/^uam/) )',
-                element:   '#wrapwrap > main > div > section .row > div:first img.img-responsive-25',
+                element:   '#wrapwrap > main > div > section .row > div:first img[style*="25%"]',
                 title:     "click on image",
             },
             {
@@ -165,7 +165,7 @@
                 title:     "Click on resize half",
             },
             {
-                waitFor:   '#wrapwrap > main > div > section .row > div:first img.img-responsive-50',
+                waitFor:   '#wrapwrap > main > div > section .row > div:first img[style*="50%"]',
                 element:   '.note-image-popover:visible button[data-event="showImageDialog"]',
                 title:     "Click on edit picture",
             },
@@ -179,16 +179,16 @@
                 title:     "select a pictogram",
             },
             {
-                waitFor:   '#editor-media-icon.active #fa-icon[value]',
-                element:   '#editor-media-icon.active #fa-preview span[data-size="fa-3x"]',
-                title:     "select a size for the pictogram",
-            },
-            {
-                waitFor:   '#editor-media-icon.active #fa-preview span[data-size="fa-3x"].font-icons-selected',
+                waitFor:   '#editor-media-icon.active span.font-icons-selected',
                 element:   '.modal button.save',
                 title:     "save pictogram",
             },
             {
+                element:   '.note-image-popover button[data-event="resizefa"][data-value="3"]',
+                title:     "select a size for the pictogram",
+            },
+            {
+                waitFor:   '#wrapwrap span.fa-3x',
                 element:   '.note-image-popover:visible button[data-event="floatMe"][data-value="right"]',
                 title:     "click on float right",
             },
diff --git a/addons/website/static/src/xml/website.editor.xml b/addons/website/static/src/xml/website.editor.xml
index 2f9477bd8e1..6b0e04da0c0 100644
--- a/addons/website/static/src/xml/website.editor.xml
+++ b/addons/website/static/src/xml/website.editor.xml
@@ -363,9 +363,6 @@
                     <t t-set="iconsParser" t-value="widget.iconsParser"/>
                 </t>
             </div>
-            <div class="form-group mt32" id="fa-preview">
-
-            </div>
         </form>
     </t>
     <t t-name="website.editor.dialog.font-icons.icons">