mirror of
https://github.com/Azgaar/Fantasy-Map-Generator.git
synced 2025-12-17 09:41:24 +01:00
v1.3.02a
This commit is contained in:
Azgaar
parent
8d7f95e2f3
commit
cba011282d
11 changed files with 215 additions and 130 deletions
|
|
@ -6,7 +6,7 @@ function editRegiment() {
|
|||
|
||||
armies.selectAll(":scope > g").classed("draggable", true);
|
||||
armies.selectAll(":scope > g > g").call(d3.drag().on("drag", dragRegiment));
|
||||
elSelected = d3.event.target;
|
||||
elSelected = d3.event.target.parentElement; // select g element
|
||||
if (!pack.states[elSelected.dataset.state]) return;
|
||||
if (!regiment()) return;
|
||||
updateRegimentData(regiment());
|
||||
|
|
@ -25,6 +25,8 @@ function editRegiment() {
|
|||
document.getElementById("regimentNameRestore").addEventListener("click", restoreName);
|
||||
document.getElementById("regimentType").addEventListener("click", changeType);
|
||||
document.getElementById("regimentName").addEventListener("change", changeName);
|
||||
document.getElementById("regimentEmblem").addEventListener("input", changeEmblem);
|
||||
document.getElementById("regimentEmblemSelect").addEventListener("click", selectEmblem);
|
||||
document.getElementById("regimentRegenerateLegend").addEventListener("click", regenerateLegend);
|
||||
document.getElementById("regimentLegend").addEventListener("click", editLegend);
|
||||
document.getElementById("regimentSplit").addEventListener("click", splitRegiment);
|
||||
|
|
@ -40,6 +42,7 @@ function editRegiment() {
|
|||
function updateRegimentData(regiment) {
|
||||
document.getElementById("regimentType").className = regiment.n ? "icon-anchor" :"icon-users";
|
||||
document.getElementById("regimentName").value = regiment.name;
|
||||
document.getElementById("regimentEmblem").value = regiment.icon;
|
||||
const composition = document.getElementById("regimentComposition");
|
||||
|
||||
composition.innerHTML = options.military.map(u => {
|
||||
|
|
@ -54,12 +57,13 @@ function editRegiment() {
|
|||
|
||||
function drawBase() {
|
||||
const reg = regiment();
|
||||
const tr = parseTransform(elSelected.parentNode.getAttribute("transform"));
|
||||
const tr = parseTransform(elSelected.getAttribute("transform"));
|
||||
const tx = +tr[0], ty = +tr[1];
|
||||
const x2 = +elSelected.nextSibling.getAttribute("x"), y2 = +elSelected.nextSibling.getAttribute("y");
|
||||
const x2 = +elSelected.querySelector("text").getAttribute("x"), y2 = +elSelected.querySelector("text").getAttribute("y");
|
||||
|
||||
const clr = pack.states[elSelected.dataset.state].color;
|
||||
const base = viewbox.insert("g", "g#armies").attr("id", "regimentBase");
|
||||
const base = viewbox.insert("g", "g#armies").attr("id", "regimentBase")
|
||||
.attr("stroke-width", .3).attr("stroke", "#000").attr("cursor", "move");
|
||||
base.on("mouseenter", d => {tip("Regiment base. Drag to re-base the regiment", true);}).on("mouseleave", d => {tip('', true);});
|
||||
|
||||
base.append("line").attr("x1", reg.x).attr("y1", reg.y).attr("x2", x2+tx).attr("y2", y2+ty).attr("class", "dragLine");
|
||||
|
|
@ -71,9 +75,15 @@ function editRegiment() {
|
|||
reg.n = +!reg.n;
|
||||
document.getElementById("regimentType").className = reg.n ? "icon-anchor" :"icon-users";
|
||||
|
||||
const size = 3;
|
||||
elSelected.setAttribute("x", reg.n ? reg.x-size*2 : reg.x-size*3);
|
||||
elSelected.setAttribute("width", reg.n ? size*4 : size*6);
|
||||
const size = +armies.attr("data-size");
|
||||
const baseRect = elSelected.querySelectorAll("rect")[0];
|
||||
const iconRect = elSelected.querySelectorAll("rect")[1];
|
||||
const icon = elSelected.querySelector(".regimentIcon");
|
||||
const x = reg.n ? reg.x-size*2 : reg.x-size*3;
|
||||
baseRect.setAttribute("x", x);
|
||||
baseRect.setAttribute("width", reg.n ? size*4 : size*6);
|
||||
iconRect.setAttribute("x", x - size*2);
|
||||
icon.setAttribute("x", x - size);
|
||||
}
|
||||
|
||||
function changeName() {
|
||||
|
|
@ -86,12 +96,50 @@ function editRegiment() {
|
|||
elSelected.dataset.name = reg.name = document.getElementById("regimentName").value = name;
|
||||
}
|
||||
|
||||
function changeEmblem() {
|
||||
const emblem = document.getElementById("regimentEmblem").value;
|
||||
regiment().icon = elSelected.querySelector(".regimentIcon").innerHTML = emblem;
|
||||
}
|
||||
|
||||
function selectEmblem() {
|
||||
const emblems = ["⚔️","🏹","🐴","💣","🌊","🎯","⚓","🔮","📯","🛡️","👑",
|
||||
"☠️","🎆","🗡️","⛏️","🔥","🐾","🎪","🏰","⚜️","⛓️","❤️","📜","🔱","🌈","🌠","💥","☀️","🍀",
|
||||
"🔰","🕸️","⚗️","☣️","☢️","🎖️","⚕️","☸️","✡️","🚩","🏳️","🏴","🌈","💪","✊","👊","🤜","🤝","🙏","🧙","💂","🤴","🧛","🧟","🧞","🧝",
|
||||
"🦄","🐲","🐉","🐎","🦓","🐺","🦊","🐱","🐈","🦁","🐯","🐅","🐆","🐕","🦌","🐵","🐒","🦍",
|
||||
"🦅","🕊️","🐓","🦇","🐦","🦉","🐮","🐄","🐂","🐃","🐷","🐖","🐗","🐏","🐑","🐐","🐫","🦒","🐘","🦏",
|
||||
"🐭","🐁","🐀","🐹","🐰","🐇","🦔","🐸","🐊","🐢","🦎","🐍","🐳","🐬","🦈","🐙","🦑","🐌","🦋","🐜","🐝","🐞","🦗","🕷️","🦂","🦀"];
|
||||
|
||||
alertMessage.innerHTML = "";
|
||||
const container = document.createElement("div");
|
||||
container.style.userSelect = "none";
|
||||
container.style.cursor = "pointer";
|
||||
container.style.fontSize = "2em";
|
||||
container.style.width = "47vw";
|
||||
container.innerHTML = emblems.map(i => `<span>${i}</span>`).join("");
|
||||
container.addEventListener("mouseover", e => showTip(e), false);
|
||||
container.addEventListener("click", e => clickEmblem(e), false);
|
||||
alertMessage.appendChild(container);
|
||||
|
||||
$("#alert").dialog({resizable: false, width: fitContent(), title: "Select emblem"});
|
||||
|
||||
function showTip(e) {
|
||||
if (e.target.tagName !== "SPAN") return;
|
||||
tip(`Click to select ${e.target.innerHTML} emblem`);
|
||||
}
|
||||
|
||||
function clickEmblem(e) {
|
||||
if (e.target.tagName !== "SPAN") return;
|
||||
document.getElementById("regimentEmblem").value = e.target.innerHTML;
|
||||
changeEmblem();
|
||||
}
|
||||
}
|
||||
|
||||
function changeUnit() {
|
||||
const u = this.dataset.u;
|
||||
const reg = regiment();
|
||||
reg.u[u] = (+this.value)||0;
|
||||
reg.a = d3.sum(Object.values(reg.u));
|
||||
elSelected.nextSibling.innerHTML = reg.a;
|
||||
elSelected.querySelector("text").innerHTML = Military.getTotal(reg);
|
||||
if (militaryOverviewRefresh.offsetParent) militaryOverviewRefresh.click();
|
||||
}
|
||||
|
||||
|
|
@ -105,11 +153,11 @@ function editRegiment() {
|
|||
reg.a = d3.sum(Object.values(u1)); // old reg total
|
||||
const a = d3.sum(Object.values(u2)); // new reg total
|
||||
|
||||
const newReg = {a, cell:reg.cell, i, n:reg.n, u:u2, x:reg.x, y:reg.y};
|
||||
const newReg = {a, cell:reg.cell, i, n:reg.n, u:u2, x:reg.x, y:reg.y, icon: reg.icon};
|
||||
newReg.name = Military.getName(newReg, military);
|
||||
military.push(newReg);
|
||||
|
||||
elSelected.parentNode.remove(); // undraw old reg
|
||||
elSelected.remove(); // undraw old reg
|
||||
Military.drawRegiment(reg, state, reg.x, reg.y-6); // draw old reg above
|
||||
Military.drawRegiment(newReg, state, reg.x, reg.y+6); // draw new reg below
|
||||
|
||||
|
|
@ -134,7 +182,7 @@ function editRegiment() {
|
|||
const state = elSelected.dataset.state, military = pack.states[state].military;
|
||||
const i = military.length ? last(military).i + 1 : 0;
|
||||
const n = +(pack.cells.h[cell] < 20); // naval or land
|
||||
const reg = {a:0, cell, i, n, u:{}, x, y};
|
||||
const reg = {a:0, cell, i, n, u:{}, x, y, icon:"🛡️"};
|
||||
reg.name = Military.getName(reg, military);
|
||||
military.push(reg);
|
||||
Military.drawRegiment(reg, state);
|
||||
|
|
@ -155,45 +203,35 @@ function editRegiment() {
|
|||
}
|
||||
|
||||
function attachRegimentOnClick() {
|
||||
const target = d3.event.target, army = target.parentElement.parentElement;
|
||||
const target = d3.event.target, regSelected = target.parentElement, army = regSelected.parentElement;
|
||||
const oldState = +elSelected.dataset.state, newState = +regSelected.dataset.state;
|
||||
|
||||
if (army.parentElement.id !== "armies") {
|
||||
tip("Please click on a regiment", false, "error");
|
||||
return;
|
||||
}
|
||||
if (army.parentElement.id !== "armies") {tip("Please click on a regiment", false, "error"); return;}
|
||||
if (regSelected === elSelected) {tip("Cannot attach regiment to itself. Please click on another regiment", false, "error"); return;}
|
||||
//if (army !== elSelected.parentElement) {tip("Cannot attach to a regiment of other state", false, "error"); return;};
|
||||
|
||||
if (target === elSelected) {
|
||||
tip("Cannot attach regiment to itself. Please click on another regiment", false, "error");
|
||||
return;
|
||||
}
|
||||
|
||||
if (army !== elSelected.parentElement.parentElement) {
|
||||
tip("Cannot attach this regiment to regiment of other state", false, "error");
|
||||
return;
|
||||
};
|
||||
|
||||
const reg = regiment(); // reg to be attached
|
||||
const sel = pack.states[target.dataset.state].military.find(r => r.i == target.dataset.id); // reg to attach to
|
||||
const sel = pack.states[newState].military.find(r => r.i == regSelected.dataset.id); // reg to attach to
|
||||
|
||||
for (const unit of options.military) {
|
||||
const u = unit.name;
|
||||
if (reg.u[u]) sel.u[u] ? sel.u[u] += reg.u[u] : sel.u[u] = reg.u[u];
|
||||
}
|
||||
sel.a = d3.sum(Object.values(sel.u)); // reg total
|
||||
target.nextSibling.innerHTML = sel.a; // update selected reg total text
|
||||
regSelected.querySelector("text").innerHTML = Military.getTotal(sel); // update selected reg total text
|
||||
|
||||
// remove attached regiment
|
||||
const military = pack.states[elSelected.dataset.state].military;
|
||||
const military = pack.states[oldState].military;
|
||||
military.splice(military.indexOf(reg), 1);
|
||||
const index = notes.findIndex(n => n.id === elSelected.parentNode.id);
|
||||
const index = notes.findIndex(n => n.id === elSelected.id);
|
||||
if (index != -1) notes.splice(index, 1);
|
||||
elSelected.parentNode.remove();
|
||||
elSelected.remove();
|
||||
|
||||
$("#regimentEditor").dialog("close");
|
||||
}
|
||||
|
||||
function regenerateLegend() {
|
||||
const index = notes.findIndex(n => n.id === elSelected.parentNode.id);
|
||||
const index = notes.findIndex(n => n.id === elSelected.id);
|
||||
if (index != -1) notes.splice(index, 1);
|
||||
|
||||
const s = pack.states[elSelected.dataset.state];
|
||||
|
|
@ -201,7 +239,7 @@ function editRegiment() {
|
|||
}
|
||||
|
||||
function editLegend() {
|
||||
editNotes(elSelected.parentNode.id, regiment().name);
|
||||
editNotes(elSelected.id, regiment().name);
|
||||
}
|
||||
|
||||
function removeRegiment() {
|
||||
|
|
@ -215,9 +253,9 @@ function editRegiment() {
|
|||
if (regIndex === -1) return;
|
||||
military.splice(regIndex, 1);
|
||||
|
||||
const index = notes.findIndex(n => n.id === elSelected.parentNode.id);
|
||||
const index = notes.findIndex(n => n.id === elSelected.id);
|
||||
if (index != -1) notes.splice(index, 1);
|
||||
elSelected.parentNode.remove();
|
||||
elSelected.remove();
|
||||
|
||||
if (militaryOverviewRefresh.offsetParent) militaryOverviewRefresh.click();
|
||||
$("#regimentEditor").dialog("close");
|
||||
|
|
@ -233,10 +271,10 @@ function editRegiment() {
|
|||
d3.select(this).raise();
|
||||
d3.select(this.parentNode).raise();
|
||||
|
||||
const self = elSelected.parentNode === this;
|
||||
const self = elSelected === this;
|
||||
const baseLine = viewbox.select("g#regimentBase > line");
|
||||
const x2 = +elSelected.nextSibling.getAttribute("x");
|
||||
const y2 = +elSelected.nextSibling.getAttribute("y");
|
||||
const text = elSelected.querySelector("text");
|
||||
const x2 = +text.getAttribute("x"), y2 = +text.getAttribute("y");
|
||||
|
||||
d3.event.on("drag", function() {
|
||||
const x = dx + d3.event.x, y = dy + d3.event.y;
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue