Accept search parameter in URL

output/main.js

@@ -82,9 +82,18 @@ function getTimestamp() {
  * Processes initial URL hash and parameter to trigger actions on the page.
  */
 function reactToURLParameters() {
-	const hash = location.hash;
-	if (hash == "") return;
-	const communityID = hash.slice(1);
+	const rawHash = location.hash;
+	if (rawHash == "") return;
+
+	const hash = rawHash.slice(1);
+
+	if (hash.startsWith("q=")) {
+		useSearchTerm(hash.slice(2), true);
+		toggleSearchBarVisibility();
+		return;
+	}
+
+	const communityID = hash;
 	const row = dom.community_row(communityID);
 	if (row == null || !(row instanceof HTMLTableRowElement)) {
 		return;
@@ -448,19 +457,23 @@ function addServerIconInteractions() {
 	}
 }
 
+function toggleSearchBarVisibility() {
+	const container = dom.search_container();
+	container?.classList.toggle(CLASSES.COMPONENTS.COLLAPSED);
+	if (!container?.classList.contains(CLASSES.COMPONENTS.COLLAPSED)) {
+		const searchBar = dom.search_bar();
+		searchBar?.focus();
+		// Inconsistent; attempt to align search bar to top to make more space for results.
+		searchBar?.scrollIntoView({ behavior: 'smooth', inline: 'start' });
+	} else {
+		useSearchTerm("");
+	}
+}
+
 function addSearchInteractions() {
 	dom.btn_toggle_search()?.addEventListener('click', function (ev) {
 		location.hash="#";
-		const container = dom.search_container();
-		container?.classList.toggle(CLASSES.COMPONENTS.COLLAPSED);
-		if (!container?.classList.contains(CLASSES.COMPONENTS.COLLAPSED)) {
-			const searchBar = dom.search_bar();
-			searchBar?.focus();
-			// Inconsistent; attempt to align search bar to top to make more space for results.
-			searchBar?.scrollIntoView({ behavior: 'smooth', inline: 'start' });
-		} else {
-			useSearchTerm("");
-		}
+		toggleSearchBarVisibility();
 	})
 
 	dom.search_bar()?.addEventListener('keydown', function () {
@@ -475,16 +488,16 @@ function addSearchInteractions() {
 	})
 
 	dom.btn_clear_search()?.addEventListener('click', function () {
-		useSearchTerm("");
-		const searchBar = dom.search_bar();
-		searchBar?.focus();
-		searchBar.value = "";
+		useSearchTerm("", true);
+		dom.search_bar()?.focus();
 	})
 
 	Array.from(dom.sample_searches()).forEach(button => button.addEventListener('click', function() {
 		const targetSearch = button.getAttribute(ATTRIBUTES.SEARCH.TARGET_SEARCH);
-		useSearchTerm(targetSearch);
-		dom.search_bar().value = targetSearch;
+		if (targetSearch === null) {
+			throw new Error("Sample search was null");
+		}
+		useSearchTerm(targetSearch, true);
 	}))
 }
 
@@ -624,7 +637,13 @@ function initializeSearch() {
  *
  * @param {string} [rawTerm]
  */
-function useSearchTerm(rawTerm) {
+function useSearchTerm(rawTerm, fillSearchBarWithTerm = false) {
+	const searchBar = dom.search_bar();
+
+	if (searchBar === undefined || !(searchBar instanceof HTMLInputElement)) {
+		throw new Error("Could not find search bar input element");
+	}
+
 	if (!rawTerm) {
 		replaceRowsWith(communityFullRowCache);
 		dom.search_bar()?.classList.remove(CLASSES.SEARCH.NO_RESULTS);
@@ -652,12 +671,17 @@ function useSearchTerm(rawTerm) {
 			}
 		);
 		if (newRows.length === 0) {
-			dom.search_bar()?.classList.add(CLASSES.SEARCH.NO_RESULTS);
+			searchBar.classList.add(CLASSES.SEARCH.NO_RESULTS);
 		} else {
-			dom.search_bar()?.classList.remove(CLASSES.SEARCH.NO_RESULTS);
+			searchBar.classList.remove(CLASSES.SEARCH.NO_RESULTS);
 		}
 		replaceRowsWith(newRows);
 	}
+
+	if (fillSearchBarWithTerm) {
+		searchBar.value = rawTerm;
+	}
+
 	sortTable();
 }