Lexical: Started loading real content, Improved html loading

[bookstack] / resources / js / components / wysiwyg-editor.js

diff --git a/resources/js/components/wysiwyg-editor.js b/resources/js/components/wysiwyg-editor.js
index 976dba68f6eefc654f83495dc2d245d8eeb164bb..2f0e660b19fc778644a6554a76c9db1c0bbaad58 100644 (file)
--- a/resources/js/components/wysiwyg-editor.js
+++ b/resources/js/components/wysiwyg-editor.js
@@ -1,31 +1,16 @@
-import {build as buildEditorConfig} from "../wysiwyg/config";
-import {Component} from "./component";
+import {Component} from './component';
 
 export class WysiwygEditor extends Component {
 
     setup() {
         this.elem = this.$el;
+        this.editContainer = this.$refs.editContainer;
+        this.input = this.$refs.input;
 
-        this.pageId = this.$opts.pageId;
-        this.textDirection = this.$opts.textDirection;
-        this.isDarkMode = document.documentElement.classList.contains('dark-mode');
-
-        this.tinyMceConfig = buildEditorConfig({
-            language: this.$opts.language,
-            containerElement: this.elem,
-            darkMode: this.isDarkMode,
-            textDirection: this.textDirection,
-            drawioUrl: this.getDrawIoUrl(),
-            pageId: Number(this.pageId),
-            translations: {
-                imageUploadErrorText: this.$opts.imageUploadErrorText,
-                serverUploadLimitText: this.$opts.serverUploadLimitText,
-            },
-            translationMap: window.editor_translations,
+        window.importVersioned('wysiwyg').then(wysiwyg => {
+            const editorContent = this.input.value;
+            wysiwyg.createPageEditorInstance(this.editContainer, editorContent);
         });
-
-        window.$events.emitPublic(this.elem, 'editor-tinymce::pre-init', {config: this.tinyMceConfig});
-        window.tinymce.init(this.tinyMceConfig);
     }
 
     getDrawIoUrl() {
@@ -36,4 +21,16 @@ export class WysiwygEditor extends Component {
         return '';
     }
 
-}
\ No newline at end of file
+    /**
+     * Get the content of this editor.
+     * Used by the parent page editor component.
+     * @return {{html: String}}
+     */
+    getContent() {
+        // TODO - Update
+        return {
+            html: this.editor.getContent(),
+        };
+    }
+
+}