[FIX] web_editor: test jinja content to load editor in codeview

The preview change the content because the browser try to fix the dom.
If a user use jinja and activate the preview, the jinja code is (re)moved by the browser and broke the template.

1 files changed, 80 insertions, 10 deletions

diff --git a/addons/web_editor/static/src/js/backend.js b/addons/web_editor/static/src/js/backend.js
index fa962cfd75f..9491c283ef3 100644
--- a/addons/web_editor/static/src/js/backend.js
+++ b/addons/web_editor/static/src/js/backend.js
@@ -8,8 +8,11 @@ var common = require('web.form_common');
 var base = require('web_editor.base');
 var editor = require('web_editor.editor');
 var summernote = require('web_editor.summernote');
+require('web_editor.rte.summernote');
 var transcoder = require('web_editor.transcoder');
 
+var form_widgets = require('web.form_widgets');
+
 var QWeb = core.qweb;
 var _t = core._t;
 
@@ -20,6 +23,43 @@ var _t = core._t;
  */
 
 var widget = common.AbstractField.extend(common.ReinitializeFieldMixin);
+var dom = $.summernote.core.dom;
+
+var _html = dom.html;
+dom.html = function ($dom, prettifyHtml) {
+    if (prettifyHtml) {
+        transcoder.font_to_img($dom);
+        transcoder.class_to_style($dom);
+
+        // fix outlook image rendering bug
+        _.each(['width', 'height'], function(attribute) {
+            $dom.find('img[style*="width"], img[style*="height"]').attr(attribute, function(){
+                return $(this)[attribute]();
+            }).css(attribute, function(){
+                return $(this).get(0).style[attribute] || 'auto';
+            });
+        });
+    }
+    return _html($dom, prettifyHtml);
+};
+
+var _value = dom.value;
+dom.value = function ($dom, stripLinebreaks, $editable) {
+    var value = _value($dom, stripLinebreaks);
+    if (stripLinebreaks) {
+        $editable = $editable || $('<div/>');
+        $editable.html(value);
+        transcoder.img_to_font($editable);
+        transcoder.style_to_class($editable);
+
+        // fix outlook image rendering bug
+        $editable.find('img[style*="width"], img[style*="height"]').removeAttr('height width');
+
+        value = $editable.html();
+    }
+    return value;
+};
+
 
 var FieldTextHtmlSimple = widget.extend({
     template: 'web_editor.FieldTextHtmlSimple',
@@ -38,13 +78,12 @@ var FieldTextHtmlSimple = widget.extend({
                 ['insert', ['link', 'picture']],
                 ['history', ['undo', 'redo']]
             ],
-            'prettifyHtml': false,
+            'prettifyHtml': !!this.options['style-inline'],
             'styleWithSpan': false,
             'inlinemedia': ['p'],
             'lang': "odoo",
             'onChange': function (value) {
                 self.internal_set_value(value);
-                self.trigger('changed_value');
             }
         };
         if (session.debug) {
@@ -53,6 +92,7 @@ var FieldTextHtmlSimple = widget.extend({
         return config;
     },
     start: function() {
+        var self = this;
         var def = this._super.apply(this, arguments);
         this.$translate.remove();
         this.$translate = $();
@@ -94,9 +134,22 @@ var FieldTextHtmlSimple = widget.extend({
             setTimeout(reset, 0);
 
             this.$content = this.$('.note-editable:first');
-            if (this.options['style-inline']) {
-                transcoder.style_to_class(this.$content);
-            }
+            this.$content.html(dom.value(this.$textarea, this.options['style-inline'], this.$content));
+
+            var layoutInfo = this.$textarea.data('layoutInfo');
+            var $codable = layoutInfo.codable();
+            var $toolbar = layoutInfo.toolbar();
+            $toolbar.find('button[data-event="codeview"]').on('click', function (event) {
+                if ($codable.is(':visible')) {
+                    if (dom.check_unvalid_preview($codable.val())) {
+                        event.preventDefault();
+                        self.do_notify(_t("You can't use html preview when you use non html code (like jinja)"));
+                    }
+                }
+            });
+            $codable.on('input', function () {
+                self.internal_set_value($codable.val());
+            });
         }
 
         $(".oe-view-manager-content").on("scroll", function () {
@@ -115,11 +168,11 @@ var FieldTextHtmlSimple = widget.extend({
         var value = text || "";
         if (value.match(/^\s*$/)) {
             value = '<p><br/></p>';
-        } else {
+        } else if (!value.match(/<(a|span|font|strong|u|i|strong|b|td|p)[^>]*>/i)) {
             value = "<p>"+value.split(/<br\/?>/).join("<br/></p><p>")+"</p>";
-            value = value.replace(/<p><\/p>/g, '').replace('<p><p>', '<p>').replace('<p><p ', '<p ').replace('</p></p>', '</p>');
+            value = value.replace(/<p[^>]*><p([^>]*)>/g, '<p\$1>').replace('</p></p>', '</p>');
         }
-        return value;
+        return value.replace(/<p[^>]*><\/p>/g, '');
     },
     focus: function() {
         if (this.get("effective_readonly")) {
@@ -139,10 +192,22 @@ var FieldTextHtmlSimple = widget.extend({
         var value = this.get('value');
         this.$textarea.val(value || '');
         this.$content.html(this.text_to_html(value));
+
+        var layoutInfo = this.$textarea.data('layoutInfo');
+        if (layoutInfo) {
+            var $codable = layoutInfo.codable();
+            $codable.val(value);
+            var $toolbar = layoutInfo.toolbar();
+            if ($codable.is(':visible') != !!dom.check_unvalid_preview(value)) {
+                $toolbar.find('button[data-event="codeview"]').trigger('click');
+            }
+        }
+
         if (this.get("effective_readonly")) {
             this.resize();
         } else {
             transcoder.style_to_class(this.$content);
+            transcoder.img_to_font(this.$content);
         }
         if (this.$content.is(document.activeElement)) {
             this.focus();
@@ -156,6 +221,11 @@ var FieldTextHtmlSimple = widget.extend({
         return !this.get('value') || this.get('value') === "<p><br/></p>" || !this.get('value').match(/\S/);
     },
     commit_value: function() {
+        var layoutInfo = this.$textarea.data('layoutInfo');
+        if (layoutInfo && layoutInfo.codable().is(':visible')) {
+            return this.internal_set_value(layoutInfo.codable().val());
+        }
+
         if (this.options['style-inline']) {
             transcoder.class_to_style(this.$content);
             transcoder.font_to_img(this.$content);
@@ -169,6 +239,7 @@ var FieldTextHtmlSimple = widget.extend({
     }
 });
 
+
 var FieldTextHtml = widget.extend({
     template: 'web_editor.FieldTextHtml',
     willStart: function () {
@@ -367,8 +438,7 @@ var FieldTextHtml = widget.extend({
             this._dirty_flag = false;
             return this.editor.save();
         } else if (this._dirty_flag && this.editor && this.editor.buildingBlock) {
-            this.editor.buildingBlock.clean_for_save();
-            this.internal_set_value( this.$content.html() );
+            this.internal_set_value( this.editor.buildingBlock.get_codesource() );
         }
     },
     destroy: function () {