From be2d74bfd7a964f25cd7fa0d4654ee6c48969517 Mon Sep 17 00:00:00 2001 From: Cory Dransfeldt Date: Sat, 19 Oct 2024 15:49:25 -0700 Subject: [PATCH] chore: search cleanup --- package-lock.json | 4 +-- package.json | 2 +- src/assets/scripts/index.js | 52 +++++++++++++++++++++++-------------- 3 files changed, 36 insertions(+), 22 deletions(-) diff --git a/package-lock.json b/package-lock.json index 445341db..5df6519f 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,12 +1,12 @@ { "name": "coryd.dev", - "version": "1.5.6", + "version": "1.5.7", "lockfileVersion": 3, "requires": true, "packages": { "": { "name": "coryd.dev", - "version": "1.5.6", + "version": "1.5.7", "license": "MIT", "dependencies": { "@cdransf/api-text": "^1.5.0", diff --git a/package.json b/package.json index 36ee7dfd..cb8bc5ec 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "coryd.dev", - "version": "1.5.6", + "version": "1.5.7", "description": "The source for my personal site. Built using 11ty (and other tools).", "type": "module", "engines": { diff --git a/src/assets/scripts/index.js b/src/assets/scripts/index.js index c6762b47..9cd1f2eb 100644 --- a/src/assets/scripts/index.js +++ b/src/assets/scripts/index.js @@ -192,12 +192,12 @@ window.addEventListener("load", () => { $results.insertAdjacentHTML("beforeend", newResults); }; - const loadSearchIndex = async (query = "", types = []) => { + const loadSearchIndex = async (query = "", types = [], page = 1) => { const typeQuery = types.join(","); try { const response = await fetch( - `https://coryd.dev/api/search?q=${query}&type=${typeQuery}&page=${currentPage}&pageSize=${PAGE_SIZE}` + `https://coryd.dev/api/search?q=${query}&type=${typeQuery}&page=${page}&pageSize=${PAGE_SIZE}` ); const index = await response.json(); const results = index.results || []; @@ -212,11 +212,10 @@ window.addEventListener("load", () => { miniSearch.removeAll(); miniSearch.addAll(results); - currentResults = results; - return resultsById; + return results; } catch (error) { console.error("Error fetching search data:", error); - return {}; + return []; } }; @@ -225,6 +224,17 @@ window.addEventListener("load", () => { .filter((checkbox) => checkbox.checked) .map((checkbox) => checkbox.value); + const updateSearchResults = (results) => { + if (currentPage === 1) { + renderSearchResults(results); + } else { + appendSearchResults(results); + } + + const moreResultsToShow = currentPage * PAGE_SIZE < total; + $loadMoreButton.style.display = moreResultsToShow ? "block" : "none"; + }; + $input.addEventListener("input", () => { const query = $input.value.trim(); clearTimeout(debounceTimeout); @@ -236,34 +246,38 @@ window.addEventListener("load", () => { } debounceTimeout = setTimeout(async () => { - await loadSearchIndex(query, getSelectedTypes()); + const results = await loadSearchIndex(query, getSelectedTypes(), 1); + currentResults = results; currentPage = 1; - renderSearchResults(getResultsForPage(currentPage)); - $loadMoreButton.style.display = total > PAGE_SIZE ? "block" : "none"; + updateSearchResults(currentResults); }, 300); }); $typeCheckboxes.forEach((checkbox) => { checkbox.addEventListener("change", async () => { - await loadSearchIndex($input.value.trim(), getSelectedTypes()); + const results = await loadSearchIndex( + $input.value.trim(), + getSelectedTypes(), + 1 + ); + currentResults = results; currentPage = 1; - renderSearchResults(getResultsForPage(currentPage)); - $loadMoreButton.style.display = total > PAGE_SIZE ? "block" : "none"; + updateSearchResults(currentResults); }); }); - $loadMoreButton.addEventListener("click", () => { + $loadMoreButton.addEventListener("click", async () => { currentPage++; - const nextResults = getResultsForPage(currentPage); - appendSearchResults(nextResults); + const nextResults = await loadSearchIndex( + $input.value.trim(), + getSelectedTypes(), + currentPage + ); + currentResults = [...currentResults, ...nextResults]; - $loadMoreButton.style.display = - currentPage * PAGE_SIZE < total ? "block" : "none"; + updateSearchResults(nextResults); }); - - const getResultsForPage = (page) => - currentResults.slice((page - 1) * PAGE_SIZE, page * PAGE_SIZE); })(); }); \ No newline at end of file