diff --git a/js/forum/src/components/CommentPost.js b/js/forum/src/components/CommentPost.js
index 444563354..8bae5813c 100644
--- a/js/forum/src/components/CommentPost.js
+++ b/js/forum/src/components/CommentPost.js
@@ -1,3 +1,5 @@
+/*global s9e*/
+
import Post from 'flarum/components/Post';
import classList from 'flarum/utils/classList';
import PostUser from 'flarum/components/PostUser';
@@ -6,7 +8,6 @@ import PostEdited from 'flarum/components/PostEdited';
import EditPostComposer from 'flarum/components/EditPostComposer';
import Composer from 'flarum/components/Composer';
import ItemList from 'flarum/utils/ItemList';
-import Formatter from 'flarum/utils/Formatter';
import listItems from 'flarum/helpers/listItems';
import Button from 'flarum/components/Button';
@@ -42,13 +43,13 @@ export default class CommentPost extends Post {
}
content() {
- const content = this.isEditing()
- ? Formatter.format(this.props.post.editedContent)
- : this.props.post.contentHtml();
-
return [
{listItems(this.headerItems().toArray())}
,
-
{m.trust(content)}
,
+
+ {this.isEditing()
+ ?
+ : m.trust(this.props.post.contentHtml())}
+
,
,
];
@@ -74,6 +75,25 @@ export default class CommentPost extends Post {
};
}
+ configPreview(element, isInitialized, context) {
+ if (isInitialized) return;
+
+ // Every 50ms, if the composer content has changed, then update the post's
+ // body with a preview.
+ let preview;
+ const updateInterval = setInterval(() => {
+ const content = app.composer.component.content();
+
+ if (preview === content) return;
+
+ preview = content;
+
+ s9e.TextFormatter.preview(preview || '', element);
+ }, 50);
+
+ context.onunload = () => clearInterval(updateInterval);
+ }
+
/**
* Toggle the visibility of a hidden post's content.
*/
diff --git a/js/forum/src/components/EditPostComposer.js b/js/forum/src/components/EditPostComposer.js
index 3e6b66099..3a44c4603 100644
--- a/js/forum/src/components/EditPostComposer.js
+++ b/js/forum/src/components/EditPostComposer.js
@@ -31,27 +31,6 @@ export default class EditPostComposer extends ComposerBody {
props.post.editedContent = props.originalContent;
}
- config(isInitialized, context) {
- super.config(isInitialized, context);
-
- if (isInitialized) return;
-
- // Every 50ms, if the content has changed, then update the post's
- // editedContent property and redraw. This will cause the preview in the
- // post's component to update.
- const updateInterval = setInterval(() => {
- const post = this.props.post;
- const content = this.content();
-
- if (content === post.editedContent) return;
-
- post.editedContent = content;
- m.redraw();
- }, 50);
-
- context.onunload = () => clearInterval(updateInterval);
- }
-
headerItems() {
const items = super.headerItems();
const post = this.props.post;
diff --git a/js/forum/src/components/ReplyComposer.js b/js/forum/src/components/ReplyComposer.js
index 0d3d69be2..dd9db1e17 100644
--- a/js/forum/src/components/ReplyComposer.js
+++ b/js/forum/src/components/ReplyComposer.js
@@ -42,32 +42,6 @@ export default class ReplyComposer extends ComposerBody {
return items;
}
- config(isInitialized, context) {
- super.config(isInitialized, context);
-
- if (isInitialized) return;
-
- // Every 50ms, if the content has changed, then update the post's
- // editedContent property and redraw. This will cause the preview in the
- // post's component to update.
- const updateInterval = setInterval(() => {
- const discussion = this.props.discussion;
- const content = this.content();
-
- if (content === discussion.replyContent) return;
-
- discussion.replyContent = content;
-
- const anchorToBottom = $(window).scrollTop() + $(window).height() >= $(document).height();
- m.redraw();
- if (anchorToBottom) {
- $(window).scrollTop($(document).height());
- }
- }, 50);
-
- context.onunload = () => clearInterval(updateInterval);
- }
-
/**
* Get the data to submit to the server when the reply is saved.
*
diff --git a/js/forum/src/components/ReplyPlaceholder.js b/js/forum/src/components/ReplyPlaceholder.js
index 01a5b4bac..b5b0c8039 100644
--- a/js/forum/src/components/ReplyPlaceholder.js
+++ b/js/forum/src/components/ReplyPlaceholder.js
@@ -1,8 +1,9 @@
+/*global s9e*/
+
import Component from 'flarum/Component';
import avatar from 'flarum/helpers/avatar';
import username from 'flarum/helpers/username';
import DiscussionControls from 'flarum/utils/DiscussionControls';
-import Formatter from 'flarum/utils/Formatter';
/**
* The `ReplyPlaceholder` component displays a placeholder for a reply, which,
@@ -25,9 +26,7 @@ export default class ReplyPlaceholder extends Component {
-
- {m.trust(Formatter.format(this.props.discussion.replyContent))}
-
+
);
}
@@ -50,4 +49,29 @@ export default class ReplyPlaceholder extends Component {
);
}
+
+ configPreview(element, isInitialized, context) {
+ if (isInitialized) return;
+
+ // Every 50ms, if the composer content has changed, then update the post's
+ // body with a preview.
+ let preview;
+ const updateInterval = setInterval(() => {
+ const content = app.composer.component.content();
+
+ if (preview === content) return;
+
+ preview = content;
+
+ const anchorToBottom = $(window).scrollTop() + $(window).height() >= $(document).height();
+
+ s9e.TextFormatter.preview(preview || '', element);
+
+ if (anchorToBottom) {
+ $(window).scrollTop($(document).height());
+ }
+ }, 50);
+
+ context.onunload = () => clearInterval(updateInterval);
+ }
}
diff --git a/js/forum/src/utils/Formatter.js b/js/forum/src/utils/Formatter.js
deleted file mode 100644
index 573f82ebf..000000000
--- a/js/forum/src/utils/Formatter.js
+++ /dev/null
@@ -1,11 +0,0 @@
-/*global s9e*/
-
-export default {
- format(text) {
- const elm = document.createElement('div');
-
- s9e.TextFormatter.preview(text || '', elm);
-
- return elm.innerHTML;
- }
-}