PCv5/app/static/scripts/tag_selector.js

62 lines
1.6 KiB
JavaScript

function tag_selector_find(node) {
while(node != document.body) {
if(node.classList.contains("dynamic-tag-selector"))
return node;
node = node.parentNode;
}
return undefined;
}
function tag_selector_get(ts) {
return ts.querySelector("input").value
.split(",")
.map(str => str.trim())
.filter(str => str !== "");
}
function tag_selector_set(ts, values) {
ts.querySelector("input").value = values.join(", ");
tag_selector_update(ts);
}
function tag_selector_update(ts) {
if(ts === undefined) return;
const input_names = tag_selector_get(ts);
/* Update visibility of selected tags */
ts.querySelectorAll(".tags-selected .tag[data-name]").forEach(tag => {
const visible = input_names.includes(tag.dataset.name);
tag.style.display = visible ? "inline-block" : "none";
});
/* Update visibility of pool tags */
ts.querySelectorAll(".tags-pool .tag[data-name]").forEach(tag => {
const visible = !input_names.includes(tag.dataset.name);
tag.style.display = visible ? "inline-block" : "none";
});
}
function tag_selector_add(ts, id) {
if(ts === undefined) return;
let tags = tag_selector_get(ts);
if(!tags.includes(id))
tags.push(id);
tag_selector_set(ts, tags);
}
function tag_selector_remove(ts, id) {
if(ts === undefined) return;
let tags = tag_selector_get(ts);
tags = tags.filter(str => str !== id);
tag_selector_set(ts, tags);
}
document.querySelectorAll(".dynamic-tag-selector").forEach(ts => {
ts.style.display = "block";
tag_selector_update(ts);
});