diff --git a/app/Util/HtmlDescriptionFilter.php b/app/Util/HtmlDescriptionFilter.php
index cb091b869f8..a4c214ae58c 100644
--- a/app/Util/HtmlDescriptionFilter.php
+++ b/app/Util/HtmlDescriptionFilter.php
@@ -27,6 +27,7 @@ class HtmlDescriptionFilter
'strong' => [],
'em' => [],
'br' => [],
+ 'img' => ['src', 'alt'],
];
public static function filterFromString(string $html): string
diff --git a/resources/js/components/page-comments.js b/resources/js/components/page-comments.js
index 1d6abfe2044..22f35882c39 100644
--- a/resources/js/components/page-comments.js
+++ b/resources/js/components/page-comments.js
@@ -93,7 +93,6 @@ export class PageComments extends Component {
updateCount() {
const count = this.getCommentCount();
- console.log('update count', count, this.container);
this.commentsTitle.textContent = window.$trans.choice(this.countText, count, {count});
}
@@ -135,7 +134,10 @@ export class PageComments extends Component {
containerElement: this.formInput,
darkMode: document.documentElement.classList.contains('dark-mode'),
textDirection: this.wysiwygTextDirection,
- translations: {},
+ translations: {
+ imageUploadErrorText: this.$opts.imageUploadErrorText,
+ serverUploadLimitText: this.$opts.serverUploadLimitText,
+ },
translationMap: window.editor_translations,
});
diff --git a/resources/js/wysiwyg-tinymce/config.js b/resources/js/wysiwyg-tinymce/config.js
index 1666aa50066..fdd734c9288 100644
--- a/resources/js/wysiwyg-tinymce/config.js
+++ b/resources/js/wysiwyg-tinymce/config.js
@@ -318,6 +318,9 @@ export function buildForInput(options) {
// Set language
window.tinymce.addI18n(options.language, options.translationMap);
+ // Add IMage Manager Plugin
+ window.tinymce.PluginManager.add('imagemanager', getImagemanagerPlugin());
+
// BookStack Version
const version = document.querySelector('script[src*="/dist/app.js"]').getAttribute('src').split('?version=')[1];
@@ -343,13 +346,20 @@ export function buildForInput(options) {
remove_trailing_brs: false,
statusbar: false,
menubar: false,
- plugins: 'link autolink lists',
+ plugins: 'link autolink lists imagemanager',
contextmenu: false,
- toolbar: 'bold italic link bullist numlist',
+ toolbar: 'bold italic link bullist numlist imagemanager-insert',
content_style: getContentStyle(options),
- file_picker_types: 'file',
- valid_elements: 'p,a[href|title|target],ol,ul,li,strong,em,br',
+ file_picker_types: 'file image',
+ automatic_uploads: false,
+ valid_elements: 'p,a[href|title|target],ol,ul,li,strong,em,br,+div[pre|img],img[src|alt|width|height|class|style]',
file_picker_callback: filePickerCallback,
+ paste_preprocess(plugin, args) {
+ const {content} = args;
+ if (content.indexOf('
@@ -37,6 +39,7 @@ class="button outline">{{ trans('entities.comment_add') }}
@if(userCan('comment-create-all') || $commentTree->canUpdateAny())
@push('body-end')
+ @include('pages.parts.image-manager', ['uploaded_to' => $page->id])
@include('form.editor-translations')
@include('entities.selector-popup')
diff --git a/tests/Entity/CommentTest.php b/tests/Entity/CommentTest.php
index 73136235ce0..ac3e4f05915 100644
--- a/tests/Entity/CommentTest.php
+++ b/tests/Entity/CommentTest.php
@@ -214,4 +214,16 @@ public function test_comment_editor_js_loaded_with_create_or_edit_permissions()
$resp->assertSee('window.editor_translations', false);
$resp->assertSee('component="entity-selector"', false);
}
+
+ public function test_images_can_add_in_comment()
+ {
+ $this->asEditor();
+ $page = $this->entities->page();
+
+ $this->postJson("/comment/$page->id", [
+ 'html' => '