Added search delay and prioritize anime search

scripts/Actions/Search.ts

@@ -1,4 +1,5 @@
 import { AnimeNotifier } from "../AnimeNotifier"
+import { delay } from "../Utils"
 
 // Search page reference
 var emptySearchHTML = ""
@@ -24,6 +25,9 @@ var soundtrackSearchResults: HTMLElement
 var userSearchResults: HTMLElement
 var companySearchResults: HTMLElement
 
+// Delay before a request is sent
+const searchDelay = 150
+
 // Fetch options
 const fetchOptions: RequestInit = {
 	credentials: "same-origin"
@@ -63,6 +67,14 @@ export async function search(arn: AnimeNotifier, search: HTMLInputElement, e: Ke
 	// Unmount mountables to improve visual responsiveness on key press
 	arn.unmountMountables()
 
+	// Delay
+	await delay(searchDelay)
+
+	if(term !== search.value.trim()) {
+		arn.mountMountables()
+		return
+	}
+
 	// Show loading spinner
 	arn.loading(true)
 
@@ -110,6 +122,7 @@ export async function search(arn: AnimeNotifier, search: HTMLInputElement, e: Ke
 		.then(showResponseInElement(arn, url, "anime", animeSearchResults))
 		.catch(console.error)
 
+		arn.requestIdleCallback(() => {
 			fetch("/_/character-search/" + term, fetchOptions)
 			.then(showResponseInElement(arn, url, "character", characterSearchResults))
 			.catch(console.error)
@@ -129,6 +142,7 @@ export async function search(arn: AnimeNotifier, search: HTMLInputElement, e: Ke
 			fetch("/_/company-search/" + term, fetchOptions)
 			.then(showResponseInElement(arn, url, "company", companySearchResults))
 			.catch(console.error)
+		})
 	} catch(err) {
 		console.error(err)
 	} finally {
@@ -137,7 +151,9 @@ export async function search(arn: AnimeNotifier, search: HTMLInputElement, e: Ke
 }
 
 function showResponseInElement(arn: AnimeNotifier, url: string, typeName: string, element: HTMLElement) {
-	return async response => {
+	return async (response: Response) => {
+		console.log(response.status, response.headers.get("ETag"))
+
 		let html = await response.text()
 
 		if(arn.app.currentPath !== url) {