From 65800bcfa5a380014010a46076da149cd86c86ff Mon Sep 17 00:00:00 2001
From: Antoine Guenet <age@odoo.com>
Date: Thu, 15 Apr 2021 11:48:27 +0000
Subject: [PATCH] [FIX] web_editor, mass_mailing: restore missing html edition
 feature

closes odoo/odoo#69324

X-original-commit: 8e4d0c43eac15718df45b32738d7eb46be426652
Signed-off-by: David Monjoie (dmo) <dmo@odoo.com>
---
 .../static/src/js/mass_mailing_widget.js      | 27 ++++++++++++++-
 addons/mass_mailing/views/snippets_themes.xml | 13 ++++++--
 .../static/src/js/wysiwyg/wysiwyg_iframe.js   |  2 ++
 .../static/src/scss/wysiwyg_iframe.scss       | 33 ++++++++++++++-----
 4 files changed, 63 insertions(+), 12 deletions(-)

diff --git a/addons/mass_mailing/static/src/js/mass_mailing_widget.js b/addons/mass_mailing/static/src/js/mass_mailing_widget.js
index f4bef9c5c58..04d3da76fc6 100644
--- a/addons/mass_mailing/static/src/js/mass_mailing_widget.js
+++ b/addons/mass_mailing/static/src/js/mass_mailing_widget.js
@@ -298,6 +298,24 @@ var MassMailingFieldHtml = FieldHtml.extend({
         this.wysiwyg.trigger('reload_snippet_dropzones');
     },
 
+    /**
+     * Toggle the code view.
+     */
+    _toggleCodeView: function () {
+        this.wysiwyg.odooEditor.observerUnactive();
+        const $codeview = this.$content.parent().find('textarea.o_codeview');
+        $codeview.toggleClass('d-none');
+        this.$content.toggleClass('d-none');
+        if ($codeview.hasClass('d-none')) {
+            this.wysiwyg.odooEditor.observerActive();
+            this.wysiwyg.setValue($codeview.val());
+            this.wysiwyg.odooEditor.historyStep();
+        } else {
+            $codeview.val(this.$content.html());
+            this.wysiwyg.odooEditor.observerActive();
+        }
+    },
+
     /**
      * @override
      */
@@ -338,7 +356,8 @@ var MassMailingFieldHtml = FieldHtml.extend({
         var $snippetsSideBar = ev.data;
         var $themes = $snippetsSideBar.find("#email_designer_themes").children();
         var $snippets = $snippetsSideBar.find(".oe_snippet");
-        $snippetsSideBar.find('.o_we_website_top_actions>*:not(.o_we_external_history_buttons)').hide();
+        var selectorToKeep = '.o_we_external_history_buttons, .email_designer_top_actions';
+        $snippetsSideBar.find(`.o_we_website_top_actions>*:not(${selectorToKeep})`).hide();
         var $snippets_menu = $snippetsSideBar.find("#snippets_menu");
         var $selectTemplateBtn = $snippets_menu.find('.o_we_select_template');
 
@@ -347,6 +366,12 @@ var MassMailingFieldHtml = FieldHtml.extend({
             this.$content.attr('style', 'padding-left: 0px !important');
         }
 
+        if (!odoo.debug) {
+            $snippetsSideBar.find('.o_codeview_btn').hide();
+        }
+
+        $snippetsSideBar.on('click', '.o_codeview_btn', this._toggleCodeView.bind(this));
+
         if ($themes.length === 0) {
             return;
         }
diff --git a/addons/mass_mailing/views/snippets_themes.xml b/addons/mass_mailing/views/snippets_themes.xml
index 87c3c6498c7..a542c037e95 100644
--- a/addons/mass_mailing/views/snippets_themes.xml
+++ b/addons/mass_mailing/views/snippets_themes.xml
@@ -2,11 +2,18 @@
 <odoo>
 <!-- Snippets & Themes Menu -->
 <template id="email_designer_snippets" inherit_id="web_editor.snippets" primary="True" groups="base.group_user">
+    <xpath expr="//div[hasclass('o_we_website_top_actions')]" position="inside">
+        <div class="email_designer_top_actions">
+            <button class="o_codeview_btn btn btn-primary">
+                <i class="fa fa-code"></i>
+            </button>
+            <button class="o_fullscreen_btn btn btn-primary">
+                <img src="/web_editor/font_to_img/61541/rgb(255,255,255)/16" alt="Fullscreen"/>
+            </button>
+        </div>
+    </xpath>
     <xpath expr="//div[@id='snippets_menu']" position="inside">
         <button type="button" class="o_we_select_template text-uppercase"><span>Select a template</span></button>
-        <button class="o_fullscreen_btn btn btn-primary">
-            <img src="/web_editor/font_to_img/61541/rgb(255,255,255)/16" alt="Fullscreen"/>
-        </button>
     </xpath>
     <xpath expr="//t[@id='default_snippets']" position="replace">
         <t id="default_snippets">
diff --git a/addons/web_editor/static/src/js/wysiwyg/wysiwyg_iframe.js b/addons/web_editor/static/src/js/wysiwyg/wysiwyg_iframe.js
index 0ce3fc75ec6..b30d0d295eb 100644
--- a/addons/web_editor/static/src/js/wysiwyg/wysiwyg_iframe.js
+++ b/addons/web_editor/static/src/js/wysiwyg/wysiwyg_iframe.js
@@ -108,10 +108,12 @@ Wysiwyg.include({
                 self.$utilsZone = $utilsZone;
 
                 const $iframeWrapper = $('<div class="iframe-editor-wrapper">');
+                const $codeview = $('<textarea class="o_codeview d-none"/>');
                 self.$editable.attr('class', 'o_editable oe_structure');
 
                 $iframeTarget.append($iframeWrapper);
                 $iframeTarget.append($utilsZone);
+                $iframeWrapper.append($codeview);
                 $iframeWrapper.append(self.$editable);
 
                 self.options.toolbarHandler = $('#web_editor-top-edit', self.$iframe[0].contentWindow.document);
diff --git a/addons/web_editor/static/src/scss/wysiwyg_iframe.scss b/addons/web_editor/static/src/scss/wysiwyg_iframe.scss
index 8e78dc166f9..4ea59d41cb9 100644
--- a/addons/web_editor/static/src/scss/wysiwyg_iframe.scss
+++ b/addons/web_editor/static/src/scss/wysiwyg_iframe.scss
@@ -39,15 +39,32 @@ body.o_in_iframe {
         display: none;
     }
 
-    #oe_snippets #snippets_menu .o_fullscreen_btn {
+    #oe_snippets .email_designer_top_actions {
         display: flex;
-        align-items: center;
-        width: 24px;
-        height: 24px;
-        background-color: #337ab7;
-        border: 1px solid #2e6da4;
-        border-radius: 4px;
-        margin: 4px;
+        margin: auto 9px auto auto;
+
+        .btn {
+            align-items: center;
+            width: 24px;
+            height: 24px;
+            background-color: #337ab7;
+            border: 1px solid #2e6da4;
+            border-radius: 4px;
+            padding: 0;
+            margin-left: 5px;
+        }
+
+        .o_fullscreen_btn img {
+            margin: auto;
+        }
+    }
+    textarea.o_codeview {
+        width: 100%;
+        height: 100%;
+        font-family: 'Courier New', Courier, monospace;
+        padding: 5px;
+        outline: none;
+        resize: none;
     }
 
 }