diff options
Diffstat (limited to 'addons/web_editor')
3 files changed, 42 insertions, 16 deletions
diff --git a/addons/web_editor/static/lib/summernote/src/js/module/Editor.js b/addons/web_editor/static/lib/summernote/src/js/module/Editor.js index 40b7c95e98d..b5e3190ce2e 100644 --- a/addons/web_editor/static/lib/summernote/src/js/module/Editor.js +++ b/addons/web_editor/static/lib/summernote/src/js/module/Editor.js @@ -618,6 +618,9 @@ define([ var isNewWindow = linkInfo.isNewWindow; var rng = linkInfo.range || this.createRange($editable); var isTextChanged = rng.toString() !== linkText; + // Hack : This method was updated to create buttons as well (using the same logic as anchor nodes). + const nodeName = linkInfo.isButton ? 'BUTTON' : 'A'; + const pred = dom.makePredByNodeName(nodeName); options = options || dom.makeLayoutInfo($editable).editor().data('options'); @@ -629,23 +632,25 @@ define([ var anchors = []; // ODOO: adding this branch to modify existing anchor if it fully contains the range - var ancestor_anchor = dom.ancestor(rng.sc, dom.isAnchor); - if(ancestor_anchor && ancestor_anchor === dom.ancestor(rng.ec, dom.isAnchor)) { + var ancestor_anchor = dom.ancestor(rng.sc, pred); + if (ancestor_anchor && ancestor_anchor === dom.ancestor(rng.ec, pred)) { anchors.push($(ancestor_anchor).html(linkText).get(0)); } else if (isTextChanged) { - // Create a new link when text changed. - var anchor = rng.insertNode($('<A>' + linkText + '</A>')[0]); + // Create a new element when text changed. + var anchor = rng.insertNode($(`<${nodeName}>${linkText}</${nodeName}>`)[0]); anchors.push(anchor); } else { anchors = style.styleNodes(rng, { - nodeName: 'A', + nodeName: nodeName, expandClosestSibling: true, onlyPartialContains: true }); } $.each(anchors, function (idx, anchor) { - $(anchor).attr('href', linkUrl); + if (!linkInfo.isButton) { + $(anchor).attr('href', linkUrl); + } $(anchor).attr('class', linkInfo.className || null); // ODOO: addition $(anchor).css(linkInfo.style || {}); // ODOO: addition if (isNewWindow) { @@ -672,6 +677,8 @@ define([ /** * returns link info + * Hack : This method was updated to return a boolean attribute 'isButton' to allow + * handling buttons in linkDialog. * * @return {Object} * @return {WrappedRange} return.range @@ -706,11 +713,24 @@ define([ // Get the first anchor on range(for edit). var $anchor = $(list.head(rng.nodes(dom.isAnchor))); + // Check if the target is a button element. + let isButton = false; + if (!$anchor.length) { + const pred = dom.makePredByNodeName('BUTTON'); + const rngNew = range.create().expand(pred); + const target = list.head(rngNew.nodes(pred)); + if (target && target.nodeName === 'BUTTON') { + isButton = true; + rng = rngNew; + } + } + return { range: rng, text: rng.toString(), isNewWindow: $anchor.length ? $anchor.attr('target') === '_blank' : false, - url: $anchor.length ? $anchor.attr('href') : '' + url: $anchor.length ? $anchor.attr('href') : '', + isButton: isButton, }; }; 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 ed17127c55a..cf2fa9dd04a 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 @@ -26,6 +26,7 @@ var LinkDialog = Dialog.extend({ /** * @constructor + * @param {Boolean} linkInfo.isButton - whether if the target is a button element. */ init: function (parent, options, editable, linkInfo) { this.options = options || {}; @@ -40,8 +41,11 @@ var LinkDialog = Dialog.extend({ }, }); + this.data = linkInfo || {}; + this.isButton = this.data.isButton; + // Using explicit type 'link' to preserve style when the target is <button class="...btn-link"/>. this.colorsData = [ - {type: '', label: _t("Link"), btnPreview: 'link'}, + {type: this.isButton ? 'link' : '', label: _t("Link"), btnPreview: 'link'}, {type: 'primary', label: _t("Primary"), btnPreview: 'primary'}, {type: 'secondary', label: _t("Secondary"), btnPreview: 'secondary'}, // Note: by compatibility the dialog should be able to remove old @@ -51,8 +55,6 @@ var LinkDialog = Dialog.extend({ ]; this.editable = editable; - this.data = linkInfo || {}; - this.data.className = ""; this.data.iniClassName = ""; @@ -60,10 +62,10 @@ var LinkDialog = Dialog.extend({ this.needLabel = !r || (r.sc === r.ec && r.so === r.eo); if (this.data.range) { - const $link = $(this.data.range.sc).filter("a"); - this.data.iniClassName = $link.attr("class") || ""; + const $el = $(this.data.range.sc).filter(this.isButton ? "button" : "a"); + this.data.iniClassName = $el.attr("class") || ""; this.colorCombinationClass = false; - let $node = $link; + let $node = $el; while ($node.length && !$node.is('body')) { const className = $node.attr('class') || ''; const m = className.match(/\b(o_cc\d+)\b/g); @@ -156,6 +158,10 @@ var LinkDialog = Dialog.extend({ this.data.className = this.data.iniClassName .replace(allBtnClassSuffixes, ' ') .replace(allBtnShapes, ' '); + // 'o_submit' class will force anchor to be handled as a button in linkdialog. + if (/(?:s_website_form_send|o_submit)/.test(this.data.className)) { + this.isButton = true; + } }, /** * @override @@ -263,7 +269,7 @@ var LinkDialog = Dialog.extend({ } } - if ($url.prop('required') && (!url || !$url[0].checkValidity())) { + if (!this.isButton && $url.prop('required') && (!url || !$url[0].checkValidity())) { return null; } diff --git a/addons/web_editor/static/src/xml/wysiwyg.xml b/addons/web_editor/static/src/xml/wysiwyg.xml index cef24aec75e..5c9164dca0d 100644 --- a/addons/web_editor/static/src/xml/wysiwyg.xml +++ b/addons/web_editor/static/src/xml/wysiwyg.xml @@ -466,7 +466,7 @@ <input type="text" name="label" class="form-control" id="o_link_dialog_label_input" required="required" t-att-value="widget.data.text"/> </div> </div> - <div class="form-group row o_url_input"> + <div t-attf-class="form-group row o_url_input#{widget.isButton ? ' d-none' : ''}"> <label class="col-form-label col-md-3" for="o_link_dialog_url_input">URL or Email</label> <div class="col-md-9"> <input type="text" name="url" class="form-control" id="o_link_dialog_url_input" required="required"/> @@ -518,7 +518,7 @@ </div> </div> </div> - <div class="form-group row"> + <div t-if="!widget.isButton" class="form-group row"> <div class="offset-md-3 col-md-9"> <label class="o_switch"> <input type="checkbox" name="is_new_window" t-att-checked="widget.data.isNewWindow ? 'checked' : undefined"/> |