hide search

install/package.json

@@ -101,10 +101,10 @@
         "nodebb-plugin-ntfy": "1.1.0",
         "nodebb-plugin-spam-be-gone": "2.1.1",
         "nodebb-rewards-essentials": "0.2.3",
-        "nodebb-theme-harmony": "1.1.18",
+        "nodebb-theme-harmony": "1.1.19",
         "nodebb-theme-lavender": "7.1.3",
         "nodebb-theme-peace": "2.1.6",
-        "nodebb-theme-persona": "13.2.10",
+        "nodebb-theme-persona": "13.2.11",
         "nodebb-widget-essentials": "7.0.13",
         "nodemailer": "6.9.4",
         "nprogress": "0.2.0",

public/src/client/chats/message-search.js

@@ -6,43 +6,60 @@ define('forum/chats/message-search', [
 ], function (components, alerts, messages) {
 	const messageSearch = {};
 	let roomId = 0;
+	let searchInputEl;
 	let resultListEl;
 	let chatContent;
 	let clearEl;
-
+	let toggleEl;
+	let containerEl;
 	messageSearch.init = function (_roomId) {
 		roomId = _roomId;
-		const searchInput = $('[component="chat/room/search"]');
-		searchInput.on('keyup', utils.debounce(doSearch, 250))
+
+		resultListEl = $('[component="chat/message/search/results"]');
+		chatContent = $('[component="chat/message/content"]');
+		clearEl = $('[component="chat/room/search/clear"]');
+		containerEl = $('[component="chat/room/search/container"]');
+		toggleEl = $('[component="chat/room/search/toggle"');
+
+		searchInputEl = $('[component="chat/room/search"]');
+		searchInputEl.on('keyup', utils.debounce(doSearch, 250))
 			.on('focus', () => {
-				if (searchInput.val()) {
+				if (searchInputEl.val()) {
 					doSearch();
 				}
 			});
-		resultListEl = $('[component="chat/message/search/results"]');
-		chatContent = $('[component="chat/message/content"]');
-		clearEl = $('[component="chat/room/search/clear"]');
+
 		$('[component="chat/input"]').on('focus', () => {
 			resultListEl.addClass('hidden');
 			chatContent.removeClass('hidden');
 		});
 		clearEl.on('click', clearInputAndResults);
+
+		toggleEl.on('click', () => {
+			containerEl.removeClass('hidden');
+			toggleEl.addClass('hidden');
+			searchInputEl.trigger('focus');
+		});
+		searchInputEl.on('blur', () => {
+			if (!searchInputEl.val()) {
+				clearInputAndResults();
+			}
+		});
 	};
 
 	function clearInputAndResults() {
-		components.get('chat/room/search').val('');
+		searchInputEl.val('');
 		removeResults();
 		resultListEl.addClass('hidden');
-		chatContent.removeClass('hidden');
 		clearEl.addClass('hidden');
+		containerEl.addClass('hidden');
+		chatContent.removeClass('hidden');
+		toggleEl.removeClass('hidden');
 	}
 
 	async function doSearch() {
-		const query = components.get('chat/room/search').val();
-		if (!query) {
-			return clearInputAndResults();
-		}
-		if (query.length <= 2) {
+		const query = searchInputEl.val();
+		if (!query || query.length <= 2) {
 			return;
 		}
 		clearEl.removeClass('hidden');