archive/BookStackApp_BookStack
0
0
Fork 0
mirror of https://github.com/BookStackApp/BookStack.git synced 2025-05-06 09:10:06 +00:00
Code Issues Projects Releases Wiki 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
This commit is contained in:
Dan Brown 2022-03-25 11:13:04 +00:00
parent 8594f42584
commit d2b49084b0
No known key found for this signature in database
GPG key ID: 46D9F943C24A2EF9
1 changed files with 8 additions and 1 deletions

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) => {