mirror of
https://github.com/BookStackApp/BookStack.git
synced 2025-07-28 17:02:04 +03:00
Editors: Added lexical editor for testing
Started basic playground for testing lexical as a new WYSIWYG editor. Moved out tinymce to be under wysiwyg-tinymce instead so lexical is the default, but TinyMce code remains.
This commit is contained in:
48
resources/js/components/wysiwyg-editor-tinymce.js
Normal file
48
resources/js/components/wysiwyg-editor-tinymce.js
Normal file
@ -0,0 +1,48 @@
|
||||
import {buildForEditor as buildEditorConfig} from '../wysiwyg-tinymce/config';
|
||||
import {Component} from './component';
|
||||
|
||||
export class WysiwygEditorTinymce extends Component {
|
||||
|
||||
setup() {
|
||||
this.elem = this.$el;
|
||||
|
||||
this.tinyMceConfig = buildEditorConfig({
|
||||
language: this.$opts.language,
|
||||
containerElement: this.elem,
|
||||
darkMode: document.documentElement.classList.contains('dark-mode'),
|
||||
textDirection: this.$opts.textDirection,
|
||||
drawioUrl: this.getDrawIoUrl(),
|
||||
pageId: Number(this.$opts.pageId),
|
||||
translations: {
|
||||
imageUploadErrorText: this.$opts.imageUploadErrorText,
|
||||
serverUploadLimitText: this.$opts.serverUploadLimitText,
|
||||
},
|
||||
translationMap: window.editor_translations,
|
||||
});
|
||||
|
||||
window.$events.emitPublic(this.elem, 'editor-tinymce::pre-init', {config: this.tinyMceConfig});
|
||||
window.tinymce.init(this.tinyMceConfig).then(editors => {
|
||||
this.editor = editors[0];
|
||||
});
|
||||
}
|
||||
|
||||
getDrawIoUrl() {
|
||||
const drawioUrlElem = document.querySelector('[drawio-url]');
|
||||
if (drawioUrlElem) {
|
||||
return drawioUrlElem.getAttribute('drawio-url');
|
||||
}
|
||||
return '';
|
||||
}
|
||||
|
||||
/**
|
||||
* Get the content of this editor.
|
||||
* Used by the parent page editor component.
|
||||
* @return {{html: String}}
|
||||
*/
|
||||
getContent() {
|
||||
return {
|
||||
html: this.editor.getContent(),
|
||||
};
|
||||
}
|
||||
|
||||
}
|
Reference in New Issue
Block a user