mirror of
https://github.com/Azgaar/Fantasy-Map-Generator.git
synced 2025-12-17 09:41:24 +01:00
add listeners to sort by headers
This commit is contained in:
parent
4fcd62bb99
commit
d488b68226
2 changed files with 16 additions and 7 deletions
|
|
@ -147,6 +147,15 @@ function addListeners() {
|
||||||
document.getElementById("statesAdd").addEventListener("click", enterAddStateMode);
|
document.getElementById("statesAdd").addEventListener("click", enterAddStateMode);
|
||||||
document.getElementById("statesExport").addEventListener("click", downloadStatesData);
|
document.getElementById("statesExport").addEventListener("click", downloadStatesData);
|
||||||
|
|
||||||
|
document
|
||||||
|
.getElementById("statesHeader")
|
||||||
|
.querySelectorAll(".sortable")
|
||||||
|
.forEach(function (element) {
|
||||||
|
element.addEventListener("click", function () {
|
||||||
|
sortLines(this);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
body.addEventListener("click", function (event) {
|
body.addEventListener("click", function (event) {
|
||||||
const element = event.target;
|
const element = event.target;
|
||||||
const classList = element.classList;
|
const classList = element.classList;
|
||||||
|
|
|
||||||
|
|
@ -80,23 +80,23 @@ function fitContent() {
|
||||||
|
|
||||||
// apply sorting behaviour for lines on Editor header click
|
// apply sorting behaviour for lines on Editor header click
|
||||||
document.querySelectorAll(".sortable").forEach(function (e) {
|
document.querySelectorAll(".sortable").forEach(function (e) {
|
||||||
e.addEventListener("click", function (e) {
|
e.addEventListener("click", function () {
|
||||||
sortLines(this);
|
sortLines(this);
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
function sortLines(header) {
|
function sortLines(headerElement) {
|
||||||
const type = header.classList.contains("alphabetically") ? "name" : "number";
|
const type = headerElement.classList.contains("alphabetically") ? "name" : "number";
|
||||||
let order = header.className.includes("-down") ? "-up" : "-down";
|
let order = headerElement.className.includes("-down") ? "-up" : "-down";
|
||||||
if (!header.className.includes("icon-sort") && type === "name") order = "-up";
|
if (!headerElement.className.includes("icon-sort") && type === "name") order = "-up";
|
||||||
|
|
||||||
const headers = header.parentNode;
|
const headers = headerElement.parentNode;
|
||||||
headers.querySelectorAll("div.sortable").forEach(e => {
|
headers.querySelectorAll("div.sortable").forEach(e => {
|
||||||
e.classList.forEach(c => {
|
e.classList.forEach(c => {
|
||||||
if (c.includes("icon-sort")) e.classList.remove(c);
|
if (c.includes("icon-sort")) e.classList.remove(c);
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
header.classList.add("icon-sort-" + type + order);
|
headerElement.classList.add("icon-sort-" + type + order);
|
||||||
applySorting(headers);
|
applySorting(headers);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue