'use strict';

define('quickreply', [
	'components', 'autocomplete', 'api',
	'alerts', 'uploadHelpers', 'mousetrap', 'storage', 'hooks',
	'categorySelector',
], function (
	components, autocomplete, api,
	alerts, uploadHelpers, mousetrap, storage, hooks,
	categorySelector,
) {
	const QuickReply = {
		_autocomplete: null,
	};

	QuickReply.init = function (opts) {
		const element = components.get('topic/quickreply/text');
		if (!element.length) {
			return;
		}

		if (opts?.body?.cid && $('[component="topic/quickreply/container"] [component="category-selector"]')) {
			categorySelector.init($('[component="category-selector"]'), {
				privilege: 'topics:create',
				selectedCategory: ajaxify.data.selectedCategory,
				onSelect: function (category) {
					opts.body = opts.body || {};
					opts.body.cid = category.cid;
				},
			});
			$('[component="topic/quickreply/container"] [component="topic/quickreply/category-selector"').removeClass('hidden');
		}

		const qrDraftId = ajaxify.data.tid ? `qr:draft:tid:${ajaxify.data.tid}` : `qr:draft:cid:${opts?.body?.cid || -1}`;
		const data = {
			element: element,
			strategies: [],
			options: {
				style: {
					'z-index': 20000,
					'max-height': '250px',
					overflow: 'auto',
				},
				className: 'dropdown-menu textcomplete-dropdown ghost-scrollbar',
			},
		};

		destroyAutoComplete();
		$(window).one('action:ajaxify.start', () => {
			destroyAutoComplete();
		});
		$(window).trigger('composer:autocomplete:init', data);
		QuickReply._autocomplete = autocomplete.setup(data);

		mousetrap.bind('ctrl+return', (e) => {
			if (e.target === element.get(0)) {
				components.get('topic/quickreply/button').get(0).click();
			}
		});

		uploadHelpers.init({
			uploadBtnEl: $('[component="topic/quickreply/upload/button"]'),
			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;
			}

			const replyMsg = element.val();
			const replyData = {
				tid: ajaxify.data.tid,
				handle: undefined,
				content: replyMsg,
				...opts.body,
			};

			const replyLen = replyMsg.length;
			if (replyLen < parseInt(config.minimumPostLength, 10)) {
				return alerts.error('[[error:content-too-short, ' + config.minimumPostLength + ']]');
			} else if (replyLen > parseInt(config.maximumPostLength, 10)) {
				return alerts.error('[[error:content-too-long, ' + config.maximumPostLength + ']]');
			}

			ready = false;
			element.val('');
			api.post(opts.route, replyData, function (err, data) {
				ready = true;
				if (err) {
					element.val(replyMsg);
					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}`);
						},
					});
				}

				element.val('');
				storage.removeItem(qrDraftId);
				QuickReply._autocomplete.hide();
				hooks.fire('action:quickreply.success', { data });
			});
		});

		const draft = storage.getItem(qrDraftId);
		if (draft) {
			element.val(draft);
		}

		element.on('keyup', utils.debounce(function () {
			const text = element.val();
			if (text) {
				storage.setItem(qrDraftId, text);
			} else {
				storage.removeItem(qrDraftId);
			}
		}, 1000));

		components.get('topic/quickreply/expand').on('click', (e) => {
			e.preventDefault();
			storage.removeItem(qrDraftId);
			const textEl = components.get('topic/quickreply/text');
			hooks.fire('action:composer.post.new', {
				title: ajaxify.data.tid ? ajaxify.data.titleRaw : '',
				body: textEl.val(),
				...opts.body,
			});
			textEl.val('');
		});
	};

	function destroyAutoComplete() {
		if (QuickReply._autocomplete) {
			QuickReply._autocomplete.destroy();
			QuickReply._autocomplete = null;
		}
	}

	return QuickReply;
});
