Removed use of image-manager/entity-selector window globals

diff --git a/resources/js/components/image-manager.js b/resources/js/components/image-manager.js
index da842849d97bc9b4c45f243086340949d474639a..a78aa348320c4ec7275a65d53089d37326532826 100644 (file)
--- a/resources/js/components/image-manager.js
+++ b/resources/js/components/image-manager.js
@@ -4,7 +4,6 @@ import {Component} from "./component";
 export class ImageManager extends Component {
 
     setup() {
-
         // Options
         this.uploadedTo = this.$opts.uploadedTo;
 
@@ -33,8 +32,6 @@ export class ImageManager extends Component {
         this.resetState();
 
         this.setupListeners();
-
-        window.ImageManager = this;
     }
 
     setupListeners() {

diff --git a/resources/js/components/markdown-editor.js b/resources/js/components/markdown-editor.js
index ee2f0ced2c42451a217be3c5921cf30f239827f4..b9567d8643779184e74553b52c2aa9adb23420f3 100644 (file)
--- a/resources/js/components/markdown-editor.js
+++ b/resources/js/components/markdown-editor.js
@@ -431,7 +431,9 @@ export class MarkdownEditor extends Component {
 
     actionInsertImage() {
         const cursorPos = this.cm.getCursor('from');
-        window.ImageManager.show(image => {
+        /** @type {ImageManager} **/
+        const imageManager = window.$components.first('image-manager');
+        imageManager.show(image => {
             const imageUrl = image.thumbs.display || image.url;
             let selectedText = this.cm.getSelection();
             let newText = "[![" + (selectedText || image.name) + "](" + imageUrl + ")](" + image.url + ")";
@@ -443,7 +445,9 @@ export class MarkdownEditor extends Component {
 
     actionShowImageManager() {
         const cursorPos = this.cm.getCursor('from');
-        window.ImageManager.show(image => {
+        /** @type {ImageManager} **/
+        const imageManager = window.$components.first('image-manager');
+        imageManager.show(image => {
             this.insertDrawing(image, cursorPos);
         }, 'drawio');
     }
@@ -451,7 +455,9 @@ export class MarkdownEditor extends Component {
     // Show the popup link selector and insert a link when finished
     actionShowLinkSelector() {
         const cursorPos = this.cm.getCursor('from');
-        window.EntitySelectorPopup.show(entity => {
+        /** @type {EntitySelectorPopup} **/
+        const selector = window.$components.first('entity-selector-popup');
+        selector.show(entity => {
             let selectedText = this.cm.getSelection() || entity.name;
             let newText = `[${selectedText}](${entity.link})`;
             this.cm.focus();

diff --git a/resources/js/wysiwyg/config.js b/resources/js/wysiwyg/config.js
index acf5e1d52530c9b8478e4eeb10455a7b664d08fa..d5ec20e2631356ba2d09ed7e4f0b7cfd2521e7ca 100644 (file)
--- a/resources/js/wysiwyg/config.js
+++ b/resources/js/wysiwyg/config.js
@@ -73,7 +73,9 @@ function file_picker_callback(callback, value, meta) {
 
     // field_name, url, type, win
     if (meta.filetype === 'file') {
-        window.EntitySelectorPopup.show(entity => {
+        /** @type {EntitySelectorPopup} **/
+        const selector = window.$components.first('entity-selector-popup');
+        selector.show(entity => {
             callback(entity.link, {
                 text: entity.name,
                 title: entity.name,
@@ -83,7 +85,9 @@ function file_picker_callback(callback, value, meta) {
 
     if (meta.filetype === 'image') {
         // Show image manager
-        window.ImageManager.show(function (image) {
+        /** @type {ImageManager} **/
+        const imageManager = window.$components.first('image-manager');
+        imageManager.show(function (image) {
             callback(image.url, {alt: image.name});
         }, 'gallery');
     }

diff --git a/resources/js/wysiwyg/plugin-drawio.js b/resources/js/wysiwyg/plugin-drawio.js
index 64ef1fffbcfc26cd63f2c06c90b4f4ed762dbdc8..ad7e09f95fabbcf6f79a0b0f19a08e2d353df77a 100644 (file)
--- a/resources/js/wysiwyg/plugin-drawio.js
+++ b/resources/js/wysiwyg/plugin-drawio.js
@@ -15,8 +15,10 @@ function isDrawing(node) {
 function showDrawingManager(mceEditor, selectedNode = null) {
     pageEditor = mceEditor;
     currentNode = selectedNode;
-    // Show image manager
-    window.ImageManager.show(function (image) {
+
+    /** @type {ImageManager} **/
+    const imageManager = window.$components.first('image-manager');
+    imageManager.show(function (image) {
         if (selectedNode) {
             const imgElem = selectedNode.querySelector('img');
             pageEditor.undoManager.transact(function () {

diff --git a/resources/js/wysiwyg/plugins-imagemanager.js b/resources/js/wysiwyg/plugins-imagemanager.js
index 225f271fdb9c2c7aef16d56e0aaf578685e222f8..6969a50e22264bb77e96c626dc93d04329edeb3e 100644 (file)
--- a/resources/js/wysiwyg/plugins-imagemanager.js
+++ b/resources/js/wysiwyg/plugins-imagemanager.js
@@ -3,14 +3,15 @@
  * @param {String} url
  */
 function register(editor, url) {
-
     // Custom Image picker button
     editor.ui.registry.addButton('imagemanager-insert', {
         title: 'Insert image',
         icon: 'image',
         tooltip: 'Insert image',
         onAction() {
-            window.ImageManager.show(function (image) {
+            /** @type {ImageManager} **/
+            const imageManager = window.$components.first('image-manager');
+            imageManager.show(function (image) {
                 const imageUrl = image.thumbs.display || image.url;
                 let html = `<a href="${image.url}" target="_blank">`;
                 html += `<img src="${imageUrl}" alt="${image.name}">`;