khguide/templates/components/kh2/script.js

62 lines
1.5 KiB
JavaScript

let showOnlyTracked = false;
let kindFilter = new Set();
document.addEventListener("DOMContentLoaded", (event) => {
const onlyTrackedFilter = document.querySelector(
'input[name="onlyTracked"]',
);
onlyTrackedFilter.addEventListener("input", function () {
showOnlyTracked = this.checked ? true : false;
filter();
});
const kindFilters = document.querySelectorAll(
'input[type="checkbox"][name="kindFilter"]',
);
kindFilters.forEach(function (item, index) {
item.addEventListener("input", function () {
if (this.checked) {
kindFilter.add(this.value);
} else {
kindFilter.delete(this.value);
}
console.log(kindFilter);
filter();
});
});
});
function track(element) {
let parent = element.parentElement.parentElement;
let isTracked = parent.dataset["isTracked"] ?? false;
isTracked = isTracked === "true" ? false : true;
parent.dataset["isTracked"] = isTracked;
element.innerHTML = isTracked ? "Stop tracking" : "Start tracking";
element.style["border-bottom-color"] = isTracked ? "#a00" : "#0a0";
filter();
}
function filter() {
const categories = document.querySelectorAll(".category-wrapper");
for (const category of categories) {
let isTracked = category.dataset["isTracked"] == "true";
let kind = category.dataset["matKind"];
let type = category.dataset["matType"];
category.style.display = "";
if (showOnlyTracked && !isTracked) {
category.style.display = "none";
}
if (kindFilter.size > 0) {
if (!kindFilter.has(kind)) {
category.style.display = "none";
}
}
}
}