webapp/bookstack
1
0
Fork 0
mirror of https://github.com/BookStackApp/BookStack.git synced 2025-11-03 02:13:16 +03:00
Code Activity

Added pre-render sizes to wysiwyg code blocks

Browse Source 
Sets sizes on WYSIWYG code block sections based on content lines
as an early pre-codemirror height prediction to avoid excessive
jumping in the editor.

For #3326
This commit is contained in:
Dan Brown
2022-03-25 11:13:04 +00:00
parent 8594f42584
commit d2b49084b0
1 changed files with 8 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
resources/js/wysiwyg/plugin-codeeditor.js
View File

@@ -97,11 +97,18 @@ function defineCodeBlockCustomElement(editor) {
} }
this.cleanChildContent(); this.cleanChildContent();
const content = this.getContent();
const lines = content.split('\n').length;
const height = (lines * 19.2) + 18 + 24;
this.style.height = `${height}px`;
const container = this.shadowRoot.querySelector('.CodeMirrorContainer'); const container = this.shadowRoot.querySelector('.CodeMirrorContainer');
const renderCodeMirror = (Code) => { const renderCodeMirror = (Code) => {
this.cm = Code.wysiwygView(container, this.getContent(), this.getLanguage()); this.cm = Code.wysiwygView(container, content, this.getLanguage());
Code.updateLayout(this.cm); Code.updateLayout(this.cm);
setTimeout(() => {
this.style.height = null;
}, 1);
}; };
window.importVersioned('code').then((Code) => { window.importVersioned('code').then((Code) => {