Merge branch '35-implement-functionality-for-extended-categories' into '22-integrate-api-and-frontend'

Resolve "implement functionality for extended categories"

See merge request padas/24ss-5430-web-and-data-eng/gruppe-3/datadash!34
This commit is contained in:
Erik Foris 2024-07-05 12:08:53 +02:00
commit 7a0e2490fe
2 changed files with 16 additions and 15 deletions

View File

@ -37,7 +37,7 @@ export default class Dataset {
clone.querySelector("p").innerText = this.#description; clone.querySelector("p").innerText = this.#description;
clone.querySelector("span").innerText = this.#upvotes; clone.querySelector("span").innerText = this.#upvotes;
let votedIDs = window.localStorage; 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)) { if (votedIDs.getItem(this.#id)) {
let votedButton = clone.querySelector(votedIDs.getItem(this.#id)? ".upvote-btn":".downvote-btn"); let votedButton = clone.querySelector(votedIDs.getItem(this.#id)? ".upvote-btn":".downvote-btn");
votedButton.classList.add("isVoted"); votedButton.classList.add("isVoted");
@ -57,8 +57,4 @@ export default class Dataset {
return clone; return clone;
} }
getID() {
return this.#id;
}
} }

View File

@ -9,6 +9,7 @@ export const lastQuery = {
currentPage: 0 currentPage: 0
}; };
const votedIDs = window.localStorage; const votedIDs = window.localStorage;
const loadedCategories = new Set;
// definition of all buttons & sections // definition of all buttons & sections
const addButton = document.getElementById("add-btn"); const addButton = document.getElementById("add-btn");
@ -33,12 +34,13 @@ addButton.addEventListener("click", () => {
}); });
filterButton.addEventListener("change", () => { filterButton.addEventListener("change", () => {
const filterString = filterButton.value; fetchQuery(createQuery(), true);
if (filterString !== filterButton.querySelector("#default-filter").value) {
fetchQuery(createQuery(), true);
}
}); });
filterButton.addEventListener("click", () => {
fetchCategories();
})
searchButton.addEventListener("click", () => { searchButton.addEventListener("click", () => {
fetchQuery(createQuery(), true); fetchQuery(createQuery(), true);
@ -99,7 +101,7 @@ function getFilterQuery() {
} else if (document.querySelector('#filter-btn option:checked').parentElement.label === "Standard categories") { } else if (document.querySelector('#filter-btn option:checked').parentElement.label === "Standard categories") {
return ["type", filterString]; return ["type", filterString];
} else { } 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 // fetches the further categories used in the filter function
function fetchCategories() { function fetchCategories() {
const fetchURL = new URL( const fetchURL = new URL("api/v1/categories", baseURL);
"api/v1/categories", baseURL);
fetch(fetchURL) fetch(fetchURL)
.then(resp => resp.json()) .then(resp => resp.json())
.then((data) => { .then((data) => {
for (let i = 0; i < data.length; i++) { for (let i = 0; i < data.length; i++) {
let category = data[i].toLowerCase(); let categoryName = data[i].name.toLowerCase();
category = category.charAt(0).toUpperCase() + category.slice(1); categoryName = categoryName.charAt(0).toUpperCase() + categoryName.slice(1);
document.getElementById("other-categories").appendChild(new Option(category)); if (!loadedCategories.has(categoryName)) {
let newCategory = new Option(categoryName, data[i].id);
document.getElementById("other-categories").appendChild(newCategory);
loadedCategories.add(categoryName);
}
} }
}); });
} }