breaking: closes #11070, move quickreply to core

public/src/client/topic.js

@@ -9,6 +9,7 @@ define('forum/topic', [
 	'forum/topic/posts',
 	'navigator',
 	'sort',
+	'quickreply',
 	'components',
 	'storage',
 	'hooks',
@@ -16,7 +17,7 @@ define('forum/topic', [
 	'alerts',
 ], function (
 	infinitescroll, threadTools, postTools,
-	events, posts, navigator, sort,
+	events, posts, navigator, sort, quickreply,
 	components, storage, hooks, api, alerts
 ) {
 	const Topic = {};
@@ -62,7 +63,7 @@ define('forum/topic', [
 		addDropupHandler();
 		addRepliesHandler();
 		addPostsPreviewHandler();
-
+		setupQuickReply();
 		handleBookmark(tid);
 
 		$(window).on('scroll', utils.debounce(updateTopicTitle, 250));
@@ -292,6 +293,12 @@ define('forum/topic', [
 		});
 	}
 
+	function setupQuickReply() {
+		if (config.enableQuickReply) {
+			quickreply.init();
+		}
+	}
+
 	function updateTopicTitle() {
 		const span = components.get('navbar/title').find('span');
 		if ($(window).scrollTop() > 50 && span.hasClass('hidden')) {

public/src/modules/quickreply.js

@@ -0,0 +1,95 @@
+'use strict';
+
+define('quickreply', [
+	'components', 'composer', 'composer/autocomplete', 'api',
+	'alerts', 'uploadHelpers', 'mousetrap',
+], function (
+	components, composer, autocomplete, api,
+	alerts, uploadHelpers, mousetrap
+) {
+	const QuickReply = {};
+
+	QuickReply.init = function () {
+		const element = components.get('topic/quickreply/text');
+		const data = {
+			element: element,
+			strategies: [],
+			options: {
+				style: {
+					'z-index': 100,
+				},
+			},
+		};
+
+		$(window).trigger('composer:autocomplete:init', data);
+		autocomplete._active.core_qr = autocomplete.setup(data);
+
+		mousetrap.bind('ctrl+return', (e) => {
+			if (e.target === element.get(0)) {
+				components.get('topic/quickreply/button').get(0).click();
+			}
+		});
+
+		uploadHelpers.init({
+			dragDropAreaEl: $('[component="topic/quickreply/container"] .quickreply-message'),
+			pasteEl: element,
+			uploadFormEl: $('[component="topic/quickreply/upload"]'),
+			inputEl: element,
+			route: '/api/post/upload',
+			callback: function (uploads) {
+				let text = element.val();
+				uploads.forEach((upload) => {
+					text = text + (text ? '\n' : '') + (upload.isImage ? '!' : '') + `[${upload.filename}](${upload.url})`;
+				});
+				element.val(text);
+			},
+		});
+
+		let ready = true;
+		components.get('topic/quickreply/button').on('click', function (e) {
+			e.preventDefault();
+			if (!ready) {
+				return;
+			}
+
+			var replyMsg = components.get('topic/quickreply/text').val();
+			var replyData = {
+				tid: ajaxify.data.tid,
+				handle: undefined,
+				content: replyMsg,
+			};
+
+			ready = false;
+			api.post(`/topics/${ajaxify.data.tid}`, replyData, function (err, data) {
+				ready = true;
+				if (err) {
+					return alerts.error(err);
+				}
+				if (data && data.queued) {
+					alerts.alert({
+						type: 'success',
+						title: '[[global:alert.success]]',
+						message: data.message,
+						timeout: 10000,
+						clickfn: function () {
+							ajaxify.go(`/post-queue/${data.id}`);
+						},
+					});
+				}
+
+				components.get('topic/quickreply/text').val('');
+				autocomplete._active.core_qr.hide();
+			});
+		});
+
+		components.get('topic/quickreply/expand').on('click', (e) => {
+			e.preventDefault();
+
+			const textEl = components.get('topic/quickreply/text');
+			composer.newReply(ajaxify.data.tid, undefined, ajaxify.data.title, utils.escapeHTML(textEl.val()));
+			textEl.val('');
+		});
+	};
+
+	return QuickReply;
+});