From 93a52097de5abd61403b99e893502330fc1874ea Mon Sep 17 00:00:00 2001 From: J-Klinke Date: Fri, 5 Jul 2024 12:04:32 +0200 Subject: [PATCH] - main.js: fixed bug in the filterButton EventListener (removed if-clause) added new EventListener for fetching categories updated fetchCategories() --- src/main/resources/static/dataset.js | 6 +----- src/main/resources/static/main.js | 25 +++++++++++++++---------- 2 files changed, 16 insertions(+), 15 deletions(-) diff --git a/src/main/resources/static/dataset.js b/src/main/resources/static/dataset.js index 29170a8..bd33176 100644 --- a/src/main/resources/static/dataset.js +++ b/src/main/resources/static/dataset.js @@ -37,7 +37,7 @@ export default class Dataset { clone.querySelector("p").innerText = this.#description; clone.querySelector("span").innerText = this.#upvotes; let votedIDs = window.localStorage; - // depending on whether the button has been up/downvoted, its according button get disabled and hidden + // depending on whether the button has been up/downvoted, its according button gets disabled and hidden if (votedIDs.getItem(this.#id)) { let votedButton = clone.querySelector(votedIDs.getItem(this.#id)? ".upvote-btn":".downvote-btn"); votedButton.classList.add("isVoted"); @@ -57,8 +57,4 @@ export default class Dataset { return clone; } - - getID() { - return this.#id; - } } diff --git a/src/main/resources/static/main.js b/src/main/resources/static/main.js index 32caf41..cb558ac 100644 --- a/src/main/resources/static/main.js +++ b/src/main/resources/static/main.js @@ -9,6 +9,7 @@ export const lastQuery = { currentPage: 0 }; const votedIDs = window.localStorage; +const loadedCategories = new Set; // definition of all buttons & sections const addButton = document.getElementById("add-btn"); @@ -33,12 +34,13 @@ addButton.addEventListener("click", () => { }); filterButton.addEventListener("change", () => { - const filterString = filterButton.value; - if (filterString !== filterButton.querySelector("#default-filter").value) { - fetchQuery(createQuery(), true); - } + fetchQuery(createQuery(), true); }); +filterButton.addEventListener("click", () => { + fetchCategories(); +}) + searchButton.addEventListener("click", () => { fetchQuery(createQuery(), true); @@ -99,7 +101,7 @@ function getFilterQuery() { } else if (document.querySelector('#filter-btn option:checked').parentElement.label === "Standard categories") { return ["type", filterString]; } else { - return ["category", filterString]; + return ["category", filterButton.options[filterButton.selectedIndex].value] } } @@ -177,15 +179,18 @@ function updateSections() { // fetches the further categories used in the filter function function fetchCategories() { - const fetchURL = new URL( - "api/v1/categories", baseURL); + const fetchURL = new URL("api/v1/categories", baseURL); fetch(fetchURL) .then(resp => resp.json()) .then((data) => { for (let i = 0; i < data.length; i++) { - let category = data[i].toLowerCase(); - category = category.charAt(0).toUpperCase() + category.slice(1); - document.getElementById("other-categories").appendChild(new Option(category)); + let categoryName = data[i].name.toLowerCase(); + categoryName = categoryName.charAt(0).toUpperCase() + categoryName.slice(1); + if (!loadedCategories.has(categoryName)) { + let newCategory = new Option(categoryName, data[i].id); + document.getElementById("other-categories").appendChild(newCategory); + loadedCategories.add(categoryName); + } } }); }