[FIX] web_editor: link dialog over image keep image

In f29699231 (12.3) part of the code of the editor `Link Dialog` was
moved to a web_editor/static/src/js/wysiwyg/plugin/link.js file/class.

In 13.0 the 12.3 editor changes were mostly reverted in 35b61822a but
part of the change of `Link Dialog` that was moved to another file/class
was not moved back, thus: it does not work as expected => eg. if we add
a link over an image, the image is removed.

In this commit we get back the missing part as it was in 12.0 version.

opw-2086444
closes #39858

closes odoo/odoo#39881

X-original-commit: 9996d04fd2ec8329cd5561a4bc94ccc35d529d93
Signed-off-by: Nicolas Lempereur (nle) <nle@odoo.com>

2 files changed, 93 insertions, 3 deletions

diff --git a/addons/web_editor/static/src/js/editor/rte.summernote.js b/addons/web_editor/static/src/js/editor/rte.summernote.js
index cd8d75e91dd..e63d87e54b2 100644
--- a/addons/web_editor/static/src/js/editor/rte.summernote.js
+++ b/addons/web_editor/static/src/js/editor/rte.summernote.js
@@ -1247,6 +1247,7 @@ var SummernoteManager = Class.extend(mixins.EventDispatcherMixin, {
         data.__alreadyDone = true;
         var linkDialog = new weWidgets.LinkDialog(this,
             data.options || {},
+            data.$editable,
             data.linkInfo
         );
         if (data.onSave) {
diff --git a/addons/web_editor/static/src/js/wysiwyg/widgets/link_dialog.js b/addons/web_editor/static/src/js/wysiwyg/widgets/link_dialog.js
index 6e8ec03f1f8..a03167eeaa5 100644
--- a/addons/web_editor/static/src/js/wysiwyg/widgets/link_dialog.js
+++ b/addons/web_editor/static/src/js/wysiwyg/widgets/link_dialog.js
@@ -4,6 +4,9 @@ odoo.define('wysiwyg.widgets.LinkDialog', function (require) {
 var core = require('web.core');
 var Dialog = require('wysiwyg.widgets.Dialog');
 
+var dom = $.summernote.core.dom;
+var range = $.summernote.core.range;
+
 var _t = core._t;
 
 /**
@@ -23,7 +26,7 @@ var LinkDialog = Dialog.extend({
     /**
      * @constructor
      */
-    init: function (parent, options, linkInfo) {
+    init: function (parent, options, editable, linkInfo) {
         var self = this;
         this.options = options || {};
 
@@ -38,9 +41,95 @@ var LinkDialog = Dialog.extend({
             },
         });
 
+        this.editable = editable;
         this.data = linkInfo || {};
-        this.needLabel = linkInfo.needLabel;
-        this.data.iniClassName = linkInfo.className || '';
+
+        this.data.className = "";
+        this.data.iniClassName = "";
+
+        var r = this.data.range;
+        this.needLabel = !r || (r.sc === r.ec && r.so === r.eo);
+
+        if (this.data.range) {
+            this.data.iniClassName = $(this.data.range.sc).filter("a").attr("class") || "";
+            this.data.className = this.data.iniClassName.replace(/(^|\s+)btn(-[a-z0-9_-]*)?/gi, ' ');
+
+            var is_link = this.data.range.isOnAnchor();
+
+            var sc = r.sc;
+            var so = r.so;
+            var ec = r.ec;
+            var eo = r.eo;
+
+            var nodes;
+            if (!is_link) {
+                if (sc.tagName) {
+                    sc = dom.firstChild(so ? sc.childNodes[so] : sc);
+                    so = 0;
+                } else if (so !== sc.textContent.length) {
+                    if (sc === ec) {
+                        ec = sc = sc.splitText(so);
+                        eo -= so;
+                    } else {
+                        sc = sc.splitText(so);
+                    }
+                    so = 0;
+                }
+                if (ec.tagName) {
+                    ec = dom.lastChild(eo ? ec.childNodes[eo-1] : ec);
+                    eo = ec.textContent.length;
+                } else if (eo !== ec.textContent.length) {
+                    ec.splitText(eo);
+                }
+
+                nodes = dom.listBetween(sc, ec);
+
+                // browsers can't target a picture or void node
+                if (dom.isVoid(sc) || dom.isImg(sc)) {
+                    so = dom.listPrev(sc).length-1;
+                    sc = sc.parentNode;
+                }
+                if (dom.isBR(ec)) {
+                    eo = dom.listPrev(ec).length-1;
+                    ec = ec.parentNode;
+                } else if (dom.isVoid(ec) || dom.isImg(sc)) {
+                    eo = dom.listPrev(ec).length;
+                    ec = ec.parentNode;
+                }
+
+                this.data.range = range.create(sc, so, ec, eo);
+                $(editable).data("range", this.data.range);
+                this.data.range.select();
+            } else {
+                nodes = dom.ancestor(sc, dom.isAnchor).childNodes;
+            }
+
+            if (dom.isImg(sc) && nodes.indexOf(sc) === -1) {
+                nodes.push(sc);
+            }
+            if (nodes.length > 1 || dom.ancestor(nodes[0], dom.isImg)) {
+                var text = "";
+                this.data.images = [];
+                for (var i=0; i<nodes.length; i++) {
+                    if (dom.ancestor(nodes[i], dom.isImg)) {
+                        this.data.images.push(dom.ancestor(nodes[i], dom.isImg));
+                        text += '[IMG]';
+                    } else if (!is_link && nodes[i].nodeType === 1) {
+                        // just use text nodes from listBetween
+                    } else if (!is_link && i===0) {
+                        text += nodes[i].textContent.slice(so, Infinity);
+                    } else if (!is_link && i===nodes.length-1) {
+                        text += nodes[i].textContent.slice(0, eo);
+                    } else {
+                        text += nodes[i].textContent;
+                    }
+                }
+                this.data.text = text;
+            }
+        }
+
+        this.data.text = this.data.text.replace(/[ \t\r\n]+/g, ' ');
+
         var allBtnClassSuffixes = /(^|\s+)btn(-[a-z0-9_-]*)?/gi;
         var allBtnShapes = /\s*(rounded-circle|flat)\s*/gi;
         this.data.className = this.data.iniClassName