[!] JS: WYSIWYG: Redactor: A link insertion popup under the editor window was appearing. Fixed.

1-24467_patch.patch

From 4cfc4838e35a8bae0e741d4439b4b73cd744206e Mon Sep 17 00:00:00 2001
From: Andrei Voronin <avoronin@avoronin.u.simtech>
Date: Fri, 9 Aug 2019 17:15:31 +0400
Subject: [PATCH] [!] {@24467}: JS: WYSIWYG: Redactor: A link insertion popup
 under the editor window was appearing. Fixed.

---
 design/backend/css/tygh/utils/wysiwyg.less    | 25 -------
 .../components/existing_blocks_list.tpl       |  4 +-
 .../block_manager/redactor2.js                | 66 +++++++------------
 3 files changed, 26 insertions(+), 69 deletions(-)

diff --git a/design/backend/css/tygh/utils/wysiwyg.less b/design/backend/css/tygh/utils/wysiwyg.less
index 711001690a..7e36c63207 100644
--- a/design/backend/css/tygh/utils/wysiwyg.less
+++ b/design/backend/css/tygh/utils/wysiwyg.less
@@ -1,28 +1,3 @@
-#redactor-modal {
-    max-width: 970px;
-
-    &-overlay, &-box {
-        z-index: 1000 !important;
-    }
-
-    #redactor-modal-body.redactor-modal-body--block-selection {
-        padding-top: 0;
-    }
-}
-
-.wysiwyg-block-selection {
-    .select-block {
-        .cm-remove-block {
-            display: none;
-        }
-    }
-
-    .cm-tabs-content {
-        height: 420px;
-        overflow-y: scroll;
-    }
-}
-
 .wysiwyg-block-loader {
     display: block;
     width: 100%;
diff --git a/design/backend/templates/views/block_manager/components/existing_blocks_list.tpl b/design/backend/templates/views/block_manager/components/existing_blocks_list.tpl
index 3a5912d3bd..fb47d41e22 100644
--- a/design/backend/templates/views/block_manager/components/existing_blocks_list.tpl
+++ b/design/backend/templates/views/block_manager/components/existing_blocks_list.tpl
@@ -7,7 +7,9 @@
             <input type="hidden" name="block_id" value="{$block.block_id}" />
             <input type="hidden" name="grid_id" value="{$grid_id|default:"0"}" />
             <input type="hidden" name="type" value="{$block.type}" />
-            <a class="icon-remove-circle cm-tooltip cm-remove-block" title="{__("delete_block")}"></a>
+            {if $purpose !== "wysiwyg"}
+                <a class="icon-remove-circle cm-tooltip cm-remove-block" title="{__("delete_block")}"></a>
+            {/if}
             <div class="select-block-box">
                 <div class="bmicon-{$block.type|replace:"_":"-"}"></div>
             </div>
diff --git a/js/tygh/wysiwyg_plugins/block_manager/redactor2.js b/js/tygh/wysiwyg_plugins/block_manager/redactor2.js
index 3e26008bc8..ec1f6f3fae 100644
--- a/js/tygh/wysiwyg_plugins/block_manager/redactor2.js
+++ b/js/tygh/wysiwyg_plugins/block_manager/redactor2.js
@@ -9,32 +9,12 @@
                 $('.cm-select-bm-block').removeClass('select-block--active');
                 $('[data-ca-block-uid="' + uid + '"]').addClass('select-block--active');
                 this.blockManager.isBlockSelected = true;
-                this.modal.getActionButton().trigger('click');
-            },
-
-            getTemplate: function () {
-                return String()
-                    + '<div>'
-                        + '<section class="wysiwyg-block-selection" id="block_selection">'
-                        + '<!--block_selection--></section>'
-                        + '<footer>'
-                            + '<button class="hidden" id="redactor-modal-button-cancel">' + this.lang.get('cancel') + '</button>'
-                            + '<button class="hidden" id="redactor-modal-button-action">' + this.lang.get('insert') + '</button>'
-                        + '</footer>'
-                    + '</div>';
+                this.blockManager.insert();
             },
 
             loadBlocks: function () {
                 var self = this.blockManager;
 
-                var loadBlocksHref = 'block_manager.block_selection?purpose=wysiwyg';
-
-                $.ceAjax('request', fn_url(loadBlocksHref), {
-                    caching: false,
-                    hidden: true,
-                    result_ids: 'block_selection'
-                });
-
                 if (self.areHandlersSetup) {
                     return;
                 }
@@ -70,7 +50,7 @@
                             + '&snapping_data[grid_id]=0'
                             + '&ajax_update=1'
                             + '&r_result_ids=block_selection'
-                            + '&r_url=' + encodeURIComponent(fn_url(loadBlocksHref));
+                            + '&r_url=' + encodeURIComponent(fn_url('block_manager.block_selection?purpose=wysiwyg'));
 
                         let $newBlockDialogContainer = $('#new_block_' + blockType);
                         if (!$newBlockDialogContainer.length) {
@@ -109,45 +89,45 @@
             },
 
             openPicker: function () {
-                this.modal.addTemplate('blockManager', this.blockManager.getTemplate());
-                this.modal.addCallback('blockManager', this.blockManager.loadBlocks);
-
-                this.modal.load('blockManager', fn_strip_tags(Tygh.tr('select_block')), 'auto');
-                this.modal.getModal().addClass('redactor-modal-body--block-selection');
-
-                var $actionButton = this.modal.getActionButton();
-                $actionButton.on('click', this.blockManager.insert);
-
                 this.selection.save();
-
                 this.blockManager.isBlockSelected = false;
 
-                this.modal.show();
+                container = $('#block_selection');
+                if (!container.length) {
+                    container = $('<div id="block_selection" title="' + fn_strip_tags(Tygh.tr('select_block')) + '"></div>').appendTo('body');
+                }
+
+                container.ceDialog('open', {
+                    self: this,
+                    href: fn_url('block_manager.block_selection?purpose=wysiwyg'),
+                    onClose: function () {
+                        this.self.selection.restore();
+                    }
+                });
+
+                $.ceEvent('on', 'ce.dialogshow', function (dialog) {
+                    if ($(dialog).attr('id') === 'block_selection') {
+                        $(dialog).dialog('option').self.blockManager.loadBlocks();
+                    }
+                });
             },
 
             insert: function () {
-                var $block = $('.select-block--active', this.modal.getModal()),
+                var $block = $('.select-block--active', $.ceDialog('get_last')),
                     blockData = $block.data();
 
-                var $lastDialog;
-                do {
-                    $lastDialog = $.ceDialog('get_last');
-                    $lastDialog.ceDialog('close');
-                } while ($lastDialog.length);
+                $.ceDialog('get_last').ceDialog('close');
 
-                this.modal.close();
                 this.placeholder.hide();
-
                 this.buffer.set();
-
                 this.air.collapsed();
+                this.selection.restore();
                 this.insert.html('<p><b'
                     + ' title="' + blockData.caBlockName + '"'
                     + ' class="wysiwyg-block-loader cm-block-loader cm-block-loader--' + blockData.caBlockUid +'"'
                     + ' ></b></p>'
                 );
 
-                this.selection.restore();
             }
         }
     }