X-Git-Url: http://source.bookstackapp.com/bookstack/blobdiff_plain/b0b28e7b5e5859cd676ad2e5704f244ca94422e9..refs/pull/2227/head:/resources/js/components/markdown-editor.js diff --git a/resources/js/components/markdown-editor.js b/resources/js/components/markdown-editor.js index 4dc240d48..6e646c72b 100644 --- a/resources/js/components/markdown-editor.js +++ b/resources/js/components/markdown-editor.js @@ -8,12 +8,11 @@ import DrawIO from "../services/drawio"; class MarkdownEditor { - constructor(elem) { - this.elem = elem; + setup() { + this.elem = this.$el; - const pageEditor = document.getElementById('page-editor'); - this.pageId = pageEditor.getAttribute('page-id'); - this.textDirection = pageEditor.getAttribute('text-direction'); + this.pageId = this.$opts.pageId; + this.textDirection = this.$opts.textDirection; this.markdown = new MarkdownIt({html: true}); this.markdown.use(mdTasksLists, {label: true}); @@ -27,12 +26,18 @@ class MarkdownEditor { this.onMarkdownScroll = this.onMarkdownScroll.bind(this); - this.display.addEventListener('load', () => { + const displayLoad = () => { this.displayDoc = this.display.contentDocument; this.init(); - }); + }; + + if (this.display.contentDocument.readyState === 'complete') { + displayLoad(); + } else { + this.display.addEventListener('load', displayLoad.bind(this)); + } - window.$events.emitPublic(elem, 'editor-markdown::setup', { + window.$events.emitPublic(this.elem, 'editor-markdown::setup', { markdownIt: this.markdown, displayEl: this.display, codeMirrorInstance: this.cm, @@ -557,6 +562,11 @@ class MarkdownEditor { const prependLineCount = markdown.split('\n').length; this.cm.setCursor(cursorPos.line + prependLineCount, cursorPos.ch); }); + + // Focus on editor + window.$events.listen('editor::focus', () => { + this.cm.focus(); + }); } }