Merge branch 'tinymce' into development

[bookstack] / resources / js / wysiwyg / plugin-codeeditor.js

diff --git a/resources/js/wysiwyg/plugin-codeeditor.js b/resources/js/wysiwyg/plugin-codeeditor.js
index 92781f02462afdda1e480e3effa1a17ee49e7c1c..0d591217a430186fe53611c8d09237ff0080ef40 100644 (file)
--- a/resources/js/wysiwyg/plugin-codeeditor.js
+++ b/resources/js/wysiwyg/plugin-codeeditor.js
@@ -1,5 +1,3 @@
-import Code from "../services/code";
-
 function elemIsCodeBlock(elem) {
     return elem.className === 'CodeMirrorContainer';
 }
@@ -8,18 +6,14 @@ function showPopup(editor) {
     const selectedNode = editor.selection.getNode();
 
     if (!elemIsCodeBlock(selectedNode)) {
-        const providedCode = editor.selection.getNode().textContent;
+        const providedCode = editor.selection.getContent({format: 'text'});
         window.components.first('code-editor').open(providedCode, '', (code, lang) => {
             const wrap = document.createElement('div');
             wrap.innerHTML = `<pre><code class="language-${lang}"></code></pre>`;
             wrap.querySelector('code').innerText = code;
 
-            editor.formatter.toggle('pre');
-            const node = editor.selection.getNode();
-            editor.dom.setHTML(node, wrap.querySelector('pre').innerHTML);
-            editor.fire('SetContent');
-
-            editor.focus()
+            editor.insertContent(wrap.innerHTML);
+            editor.focus();
         });
         return;
     }
@@ -31,8 +25,10 @@ function showPopup(editor) {
         const editorElem = selectedNode.querySelector('.CodeMirror');
         const cmInstance = editorElem.CodeMirror;
         if (cmInstance) {
-            Code.setContent(cmInstance, code);
-            Code.setMode(cmInstance, lang, code);
+            window.importVersioned('code').then(Code => {
+                Code.setContent(cmInstance, code);
+                Code.setMode(cmInstance, lang, code);
+            });
         }
         const textArea = selectedNode.querySelector('textarea');
         if (textArea) textArea.textContent = code;
@@ -93,7 +89,7 @@ function register(editor, url) {
         showPopup(editor);
     });
 
-    function parseCodeMirrorInstances() {
+    function parseCodeMirrorInstances(Code) {
 
         // Recover broken codemirror instances
         $('.CodeMirrorContainer').filter((index ,elem) => {
@@ -111,17 +107,18 @@ function register(editor, url) {
         });
     }
 
-    editor.on('init', function() {
+    editor.on('init', async function() {
+        const Code = await window.importVersioned('code');
         // Parse code mirror instances on init, but delay a little so this runs after
         // initial styles are fetched into the editor.
         editor.undoManager.transact(function () {
-            parseCodeMirrorInstances();
+            parseCodeMirrorInstances(Code);
         });
         // Parsed code mirror blocks when content is set but wait before setting this handler
         // to avoid any init 'SetContent' events.
         setTimeout(() => {
             editor.on('SetContent', () => {
-                setTimeout(parseCodeMirrorInstances, 100);
+                setTimeout(() => parseCodeMirrorInstances(Code), 100);
             });
         }, 200);
     });