feature(hierarchy tree): dynamically load, control dialog

This commit is contained in:
Azgaar 2022-06-12 00:22:39 +03:00
parent b9a578e0be
commit 6e5e570c90
8 changed files with 639 additions and 573 deletions

View file

@ -32,7 +32,7 @@ function clicked() {
else if (grand.id === "coastline") editCoastline();
else if (great.id === "armies") editRegiment();
else if (pack.cells.t[i] === 1) {
const node = document.getElementById("island_" + pack.cells.f[i]);
const node = byId("island_" + pack.cells.f[i]);
editCoastline(node);
} else if (grand.id === "lakes") editLake();
}
@ -58,10 +58,10 @@ function closeDialogs(except = "#except") {
// move brush radius circle
function moveCircle(x, y, r = 20) {
let circle = document.getElementById("brushCircle");
let circle = byId("brushCircle");
if (!circle) {
const html = /* html */ `<circle id="brushCircle" cx=${x} cy=${y} r=${r}></circle>`;
document.getElementById("debug").insertAdjacentHTML("afterBegin", html);
byId("debug").insertAdjacentHTML("afterBegin", html);
} else {
circle.setAttribute("cx", x);
circle.setAttribute("cy", y);
@ -70,7 +70,7 @@ function moveCircle(x, y, r = 20) {
}
function removeCircle() {
if (document.getElementById("brushCircle")) document.getElementById("brushCircle").remove();
if (byId("brushCircle")) byId("brushCircle").remove();
}
// get browser-defined fit-content
@ -79,8 +79,8 @@ function fitContent() {
}
// apply sorting behaviour for lines on Editor header click
document.querySelectorAll(".sortable").forEach(function (e) {
e.addEventListener("click", function () {
document.querySelectorAll(".sortable").forEach(function (event) {
event.on("click", function () {
sortLines(this);
});
});
@ -90,7 +90,7 @@ function applySortingByHeader(headerContainer) {
.getElementById(headerContainer)
.querySelectorAll(".sortable")
.forEach(function (element) {
element.addEventListener("click", function () {
element.on("click", function () {
sortLines(this);
});
});
@ -235,7 +235,7 @@ function removeBurg(id) {
if (burg.coa) {
const coaId = "burgCOA" + id;
if (document.getElementById(coaId)) document.getElementById(coaId).remove();
if (byId(coaId)) byId(coaId).remove();
emblems.select(`#burgEmblems > use[data-i='${id}']`).remove();
delete burg.coa; // remove to save data
}
@ -629,7 +629,7 @@ function createPicker() {
}
function updateSelectedRect(fill) {
document.getElementById("picker").querySelector("rect.selected").classList.remove("selected");
byId("picker").querySelector("rect.selected").classList.remove("selected");
document
.getElementById("picker")
.querySelector("rect[fill='" + fill.toLowerCase() + "']")
@ -687,7 +687,7 @@ function openPicker(fill, callback) {
updateSelectedRect(fill);
openPicker.updateFill = function () {
const selected = document.getElementById("picker").querySelector("rect.selected");
const selected = byId("picker").querySelector("rect.selected");
if (!selected) return;
callback(selected.getAttribute("fill"));
};
@ -888,8 +888,8 @@ function selectIcon(initial, callback) {
if (!callback) return;
$("#iconSelector").dialog();
const table = document.getElementById("iconTable");
const input = document.getElementById("iconInput");
const table = byId("iconTable");
const input = byId("iconInput");
input.value = initial;
if (!table.innerHTML) {
@ -1119,13 +1119,11 @@ function selectIcon(initial, callback) {
}
function getAreaUnit(squareMark = "²") {
return document.getElementById("areaUnit").value === "square"
? document.getElementById("distanceUnitInput").value + squareMark
: document.getElementById("areaUnit").value;
return byId("areaUnit").value === "square" ? byId("distanceUnitInput").value + squareMark : byId("areaUnit").value;
}
function getArea(rawArea) {
const distanceScale = document.getElementById("distanceScaleInput")?.value;
const distanceScale = byId("distanceScaleInput")?.value;
return rawArea * distanceScale ** 2;
}
@ -1150,26 +1148,26 @@ function confirmationDialog(options) {
}
};
document.getElementById("alertMessage").innerHTML = message;
byId("alertMessage").innerHTML = message;
$("#alert").dialog({resizable: false, title, buttons});
}
// add and register event listeners to clean up on editor closure
function listen(element, event, handler) {
element.addEventListener(event, handler);
element.on(event, handler);
return () => element.removeEventListener(event, handler);
}
// Calls the refresh functionality on all editors currently open.
function refreshAllEditors() {
TIME && console.time("refreshAllEditors");
if (document.getElementById("culturesEditorRefresh")?.offsetParent) culturesEditorRefresh.click();
if (document.getElementById("biomesEditorRefresh")?.offsetParent) biomesEditorRefresh.click();
if (document.getElementById("diplomacyEditorRefresh")?.offsetParent) diplomacyEditorRefresh.click();
if (document.getElementById("provincesEditorRefresh")?.offsetParent) provincesEditorRefresh.click();
if (document.getElementById("religionsEditorRefresh")?.offsetParent) religionsEditorRefresh.click();
if (document.getElementById("statesEditorRefresh")?.offsetParent) statesEditorRefresh.click();
if (document.getElementById("zonesEditorRefresh")?.offsetParent) zonesEditorRefresh.click();
if (byId("culturesEditorRefresh")?.offsetParent) culturesEditorRefresh.click();
if (byId("biomesEditorRefresh")?.offsetParent) biomesEditorRefresh.click();
if (byId("diplomacyEditorRefresh")?.offsetParent) diplomacyEditorRefresh.click();
if (byId("provincesEditorRefresh")?.offsetParent) provincesEditorRefresh.click();
if (byId("religionsEditorRefresh")?.offsetParent) religionsEditorRefresh.click();
if (byId("statesEditorRefresh")?.offsetParent) statesEditorRefresh.click();
if (byId("zonesEditorRefresh")?.offsetParent) zonesEditorRefresh.click();
TIME && console.timeEnd("refreshAllEditors");
}