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

Comments: Added input wysiwyg for creating/updating comments

Browse Source 
Not supporting old content, existing HTML or updating yet.
This commit is contained in:
Dan Brown
2024-01-30 14:27:09 +00:00
parent 24e6dc4b37
commit 5c92b72fdd
8 changed files with 85 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

30
resources/js/components/page-comments.js
View File

@ -1,5 +1,6 @@
import {Component} from './component';
import {getLoading, htmlToDom} from '../services/dom';
import {buildForInput} from "../wysiwyg/config";
export class PageComments extends Component {
@ -21,6 +22,11 @@ export class PageComments extends Component {
this.hideFormButton = this.$refs.hideFormButton;
this.removeReplyToButton = this.$refs.removeReplyToButton;
// WYSIWYG options
this.wysiwygLanguage = this.$opts.wysiwygLanguage;
this.wysiwygTextDirection = this.$opts.wysiwygTextDirection;
this.wysiwygEditor = null;
// Translations
this.createdText = this.$opts.createdText;
this.countText = this.$opts.countText;
@ -96,9 +102,7 @@ export class PageComments extends Component {
this.formContainer.toggleAttribute('hidden', false);
this.addButtonContainer.toggleAttribute('hidden', true);
this.formContainer.scrollIntoView({behavior: 'smooth', block: 'nearest'});
setTimeout(() => {
this.formInput.focus();
}, 100);
this.loadEditor();
}
hideForm() {
@ -112,6 +116,26 @@ export class PageComments extends Component {
this.addButtonContainer.toggleAttribute('hidden', false);
}
loadEditor() {
if (this.wysiwygEditor) {
return;
}
const config = buildForInput({
language: this.wysiwygLanguage,
containerElement: this.formInput,
darkMode: document.documentElement.classList.contains('dark-mode'),
textDirection: this.wysiwygTextDirection,
translations: {},
translationMap: window.editor_translations,
});
window.tinymce.init(config).then(editors => {
this.wysiwygEditor = editors[0];
this.wysiwygEditor.focus();
});
}
getCommentCount() {
return this.container.querySelectorAll('[component="page-comment"]').length;
}