feat: battles - move Regiments back to init position after the battle

This commit is contained in:
Azgaar 2024-09-22 18:20:22 +02:00
parent e25f231697
commit b66874ddda
2 changed files with 56 additions and 70 deletions

View file

@ -36,45 +36,31 @@ class Battle {
modules.Battle = true; modules.Battle = true;
// add listeners // add listeners
document.getElementById("battleType").addEventListener("click", ev => this.toggleChange(ev)); byId("battleType").on("click", ev => this.toggleChange(ev));
document byId("battleType").nextElementSibling.on("click", ev => Battle.prototype.context.changeType(ev));
.getElementById("battleType") byId("battleNameShow").on("click", () => Battle.prototype.context.showNameSection());
.nextElementSibling.addEventListener("click", ev => Battle.prototype.context.changeType(ev)); byId("battleNamePlace").on("change", ev => (Battle.prototype.context.place = ev.target.value));
document byId("battleNameFull").on("change", ev => Battle.prototype.context.changeName(ev));
.getElementById("battleNameShow") byId("battleNameCulture").on("click", () => Battle.prototype.context.generateName("culture"));
.addEventListener("click", () => Battle.prototype.context.showNameSection()); byId("battleNameRandom").on("click", () => Battle.prototype.context.generateName("random"));
document byId("battleNameHide").on("click", this.hideNameSection);
.getElementById("battleNamePlace") byId("battleAddRegiment").on("click", this.addSide);
.addEventListener("change", ev => (Battle.prototype.context.place = ev.target.value)); byId("battleRoll").on("click", () => Battle.prototype.context.randomize());
document.getElementById("battleNameFull").addEventListener("change", ev => Battle.prototype.context.changeName(ev)); byId("battleRun").on("click", () => Battle.prototype.context.run());
document byId("battleApply").on("click", () => Battle.prototype.context.applyResults());
.getElementById("battleNameCulture") byId("battleCancel").on("click", () => Battle.prototype.context.cancelResults());
.addEventListener("click", () => Battle.prototype.context.generateName("culture")); byId("battleWiki").on("click", () => wiki("Battle-Simulator"));
document
.getElementById("battleNameRandom")
.addEventListener("click", () => Battle.prototype.context.generateName("random"));
document.getElementById("battleNameHide").addEventListener("click", this.hideNameSection);
document.getElementById("battleAddRegiment").addEventListener("click", this.addSide);
document.getElementById("battleRoll").addEventListener("click", () => Battle.prototype.context.randomize());
document.getElementById("battleRun").addEventListener("click", () => Battle.prototype.context.run());
document.getElementById("battleApply").addEventListener("click", () => Battle.prototype.context.applyResults());
document.getElementById("battleCancel").addEventListener("click", () => Battle.prototype.context.cancelResults());
document.getElementById("battleWiki").addEventListener("click", () => wiki("Battle-Simulator"));
document.getElementById("battlePhase_attackers").addEventListener("click", ev => this.toggleChange(ev)); byId("battlePhase_attackers").on("click", ev => this.toggleChange(ev));
document byId("battlePhase_attackers").nextElementSibling.on("click", ev =>
.getElementById("battlePhase_attackers") Battle.prototype.context.changePhase(ev, "attackers")
.nextElementSibling.addEventListener("click", ev => Battle.prototype.context.changePhase(ev, "attackers")); );
document.getElementById("battlePhase_defenders").addEventListener("click", ev => this.toggleChange(ev)); byId("battlePhase_defenders").on("click", ev => this.toggleChange(ev));
document byId("battlePhase_defenders").nextElementSibling.on("click", ev =>
.getElementById("battlePhase_defenders") Battle.prototype.context.changePhase(ev, "defenders")
.nextElementSibling.addEventListener("click", ev => Battle.prototype.context.changePhase(ev, "defenders")); );
document byId("battleDie_attackers").on("click", () => Battle.prototype.context.rollDie("attackers"));
.getElementById("battleDie_attackers") byId("battleDie_defenders").on("click", () => Battle.prototype.context.rollDie("defenders"));
.addEventListener("click", () => Battle.prototype.context.rollDie("attackers"));
document
.getElementById("battleDie_defenders")
.addEventListener("click", () => Battle.prototype.context.rollDie("defenders"));
} }
defineType() { defineType() {
@ -97,20 +83,16 @@ class Battle {
} }
setType() { setType() {
document.getElementById("battleType").className = "icon-button-" + this.type; byId("battleType").className = "icon-button-" + this.type;
const sideSpecific = document.getElementById("battlePhases_" + this.type + "_attackers"); const sideSpecific = byId("battlePhases_" + this.type + "_attackers");
const attackers = sideSpecific const attackers = sideSpecific ? sideSpecific.content : byId("battlePhases_" + this.type).content;
? sideSpecific.content const defenders = sideSpecific ? byId("battlePhases_" + this.type + "_defenders").content : attackers;
: document.getElementById("battlePhases_" + this.type).content;
const defenders = sideSpecific
? document.getElementById("battlePhases_" + this.type + "_defenders").content
: attackers;
document.getElementById("battlePhase_attackers").nextElementSibling.innerHTML = ""; byId("battlePhase_attackers").nextElementSibling.innerHTML = "";
document.getElementById("battlePhase_defenders").nextElementSibling.innerHTML = ""; byId("battlePhase_defenders").nextElementSibling.innerHTML = "";
document.getElementById("battlePhase_attackers").nextElementSibling.append(attackers.cloneNode(true)); byId("battlePhase_attackers").nextElementSibling.append(attackers.cloneNode(true));
document.getElementById("battlePhase_defenders").nextElementSibling.append(defenders.cloneNode(true)); byId("battlePhase_defenders").nextElementSibling.append(defenders.cloneNode(true));
} }
definePlace() { definePlace() {
@ -200,7 +182,7 @@ class Battle {
} }
addSide() { addSide() {
const body = document.getElementById("regimentSelectorBody"); const body = byId("regimentSelectorBody");
const context = Battle.prototype.context; const context = Battle.prototype.context;
const regiments = pack.states const regiments = pack.states
.filter(s => s.military && !s.removed) .filter(s => s.military && !s.removed)
@ -246,7 +228,7 @@ class Battle {
}); });
applySorting(regimentSelectorHeader); applySorting(regimentSelectorHeader);
body.addEventListener("click", selectLine); body.on("click", selectLine);
function selectLine(ev) { function selectLine(ev) {
if (ev.target.className === "inactive") { if (ev.target.className === "inactive") {
@ -289,15 +271,15 @@ class Battle {
showNameSection() { showNameSection() {
document.querySelectorAll("#battleBottom > button").forEach(el => (el.style.display = "none")); document.querySelectorAll("#battleBottom > button").forEach(el => (el.style.display = "none"));
document.getElementById("battleNameSection").style.display = "inline-block"; byId("battleNameSection").style.display = "inline-block";
document.getElementById("battleNamePlace").value = this.place; byId("battleNamePlace").value = this.place;
document.getElementById("battleNameFull").value = this.name; byId("battleNameFull").value = this.name;
} }
hideNameSection() { hideNameSection() {
document.querySelectorAll("#battleBottom > button").forEach(el => (el.style.display = "inline-block")); document.querySelectorAll("#battleBottom > button").forEach(el => (el.style.display = "inline-block"));
document.getElementById("battleNameSection").style.display = "none"; byId("battleNameSection").style.display = "none";
} }
changeName(ev) { changeName(ev) {
@ -310,8 +292,8 @@ class Battle {
type === "culture" type === "culture"
? Names.getCulture(pack.cells.culture[this.cell], null, null, "") ? Names.getCulture(pack.cells.culture[this.cell], null, null, "")
: Names.getBase(rand(nameBases.length - 1)); : Names.getBase(rand(nameBases.length - 1));
document.getElementById("battleNamePlace").value = this.place = place; byId("battleNamePlace").value = this.place = place;
document.getElementById("battleNameFull").value = this.name = this.defineName(); byId("battleNameFull").value = this.name = this.defineName();
$("#battleScreen").dialog({title: this.name}); $("#battleScreen").dialog({title: this.name});
} }
@ -495,7 +477,7 @@ class Battle {
this[side].power = this[side].power =
d3.sum(options.military.map(u => (forces[u.name] || 0) * u.power * scheme[phase][u.type])) / adjuster; d3.sum(options.military.map(u => (forces[u.name] || 0) * u.power * scheme[phase][u.type])) / adjuster;
const UIvalue = this[side].power ? Math.max(this[side].power | 0, 1) : 0; const UIvalue = this[side].power ? Math.max(this[side].power | 0, 1) : 0;
document.getElementById("battlePower_" + side).innerHTML = UIvalue; byId("battlePower_" + side).innerHTML = UIvalue;
} }
getInitialMorale() { getInitialMorale() {
@ -509,7 +491,7 @@ class Battle {
} }
updateMorale(side) { updateMorale(side) {
const morale = document.getElementById("battleMorale_" + side); const morale = byId("battleMorale_" + side);
morale.dataset.tip = morale.dataset.tip.replace(morale.value, ""); morale.dataset.tip = morale.dataset.tip.replace(morale.value, "");
morale.value = this[side].morale | 0; morale.value = this[side].morale | 0;
morale.dataset.tip += morale.value; morale.dataset.tip += morale.value;
@ -524,7 +506,7 @@ class Battle {
} }
rollDie(side) { rollDie(side) {
const el = document.getElementById("battleDie_" + side); const el = byId("battleDie_" + side);
const prev = +el.innerHTML; const prev = +el.innerHTML;
do { do {
el.innerHTML = rand(1, 6); el.innerHTML = rand(1, 6);
@ -672,11 +654,11 @@ class Battle {
this.attackers.phase = phase[0]; this.attackers.phase = phase[0];
this.defenders.phase = phase[1]; this.defenders.phase = phase[1];
const buttonA = document.getElementById("battlePhase_attackers"); const buttonA = byId("battlePhase_attackers");
buttonA.className = "icon-button-" + this.attackers.phase; buttonA.className = "icon-button-" + this.attackers.phase;
buttonA.dataset.tip = buttonA.nextElementSibling.querySelector("[data-phase='" + phase[0] + "']").dataset.tip; buttonA.dataset.tip = buttonA.nextElementSibling.querySelector("[data-phase='" + phase[0] + "']").dataset.tip;
const buttonD = document.getElementById("battlePhase_defenders"); const buttonD = byId("battlePhase_defenders");
buttonD.className = "icon-button-" + this.defenders.phase; buttonD.className = "icon-button-" + this.defenders.phase;
buttonD.dataset.tip = buttonD.nextElementSibling.querySelector("[data-phase='" + phase[1] + "']").dataset.tip; buttonD.dataset.tip = buttonD.nextElementSibling.querySelector("[data-phase='" + phase[1] + "']").dataset.tip;
} }
@ -760,7 +742,7 @@ class Battle {
updateTable(side) { updateTable(side) {
for (const r of this[side].regiments) { for (const r of this[side].regiments) {
const tbody = document.getElementById("battle" + r.state + "-" + r.i); const tbody = byId("battle" + r.state + "-" + r.i);
const battleCasualties = tbody.querySelector(".battleCasualties"); const battleCasualties = tbody.querySelector(".battleCasualties");
const battleSurvivors = tbody.querySelector(".battleSurvivors"); const battleSurvivors = tbody.querySelector(".battleSurvivors");
@ -794,7 +776,7 @@ class Battle {
button.style.opacity = 0.5; button.style.opacity = 0.5;
div.style.display = "block"; div.style.display = "block";
document.getElementsByTagName("body")[0].addEventListener("click", hideSection, {once: true}); document.getElementsByTagName("body")[0].on("click", hideSection, {once: true});
} }
changeType(ev) { changeType(ev) {
@ -811,7 +793,7 @@ class Battle {
changePhase(ev, side) { changePhase(ev, side) {
if (ev.target.tagName !== "BUTTON") return; if (ev.target.tagName !== "BUTTON") return;
const phase = (this[side].phase = ev.target.dataset.phase); const phase = (this[side].phase = ev.target.dataset.phase);
const button = document.getElementById("battlePhase_" + side); const button = byId("battlePhase_" + side);
button.className = "icon-button-" + phase; button.className = "icon-button-" + phase;
button.dataset.tip = ev.target.dataset.tip; button.dataset.tip = ev.target.dataset.tip;
this.calculateStrength(side); this.calculateStrength(side);
@ -873,6 +855,8 @@ class Battle {
r.u = Object.assign({}, r.survivors); r.u = Object.assign({}, r.survivors);
r.a = d3.sum(Object.values(r.u)); // reg total r.a = d3.sum(Object.values(r.u)); // reg total
armies.select(`g#${id} > text`).text(Military.getTotal(r)); // update reg box armies.select(`g#${id} > text`).text(Military.getTotal(r)); // update reg box
moveRegiment(r, r.px, r.py); // move regiment back to initial position
} }
const i = last(pack.markers)?.i + 1 || 0; const i = last(pack.markers)?.i + 1 || 0;
@ -881,7 +865,7 @@ class Battle {
const marker = {i, x: this.x, y: this.y, cell: this.cell, icon: "⚔️", type: "battlefields", dy: 52}; const marker = {i, x: this.x, y: this.y, cell: this.cell, icon: "⚔️", type: "battlefields", dy: 52};
pack.markers.push(marker); pack.markers.push(marker);
const markerHTML = drawMarker(marker); const markerHTML = drawMarker(marker);
document.getElementById("markers").insertAdjacentHTML("beforeend", markerHTML); byId("markers").insertAdjacentHTML("beforeend", markerHTML);
} }
const getSide = (regs, n) => const getSide = (regs, n) =>
@ -909,7 +893,9 @@ class Battle {
cancelResults() { cancelResults() {
// move regiments back to initial positions // move regiments back to initial positions
this.attackers.regiments.concat(this.defenders.regiments).forEach(r => moveRegiment(r, r.px, r.py)); this.attackers.regiments.forEach(r => moveRegiment(r, r.px, r.py));
this.defenders.regiments.forEach(r => moveRegiment(r, r.px, r.py));
$("#battleScreen").dialog("close"); $("#battleScreen").dialog("close");
this.cleanData(); this.cleanData();
} }

View file

@ -12,7 +12,7 @@
* *
* Example: 1.102.2 -> Major version 1, Minor version 102, Patch version 2 * Example: 1.102.2 -> Major version 1, Minor version 102, Patch version 2
*/ */
const VERSION = "1.105.0"; const VERSION = "1.105.1";
if (parseMapVersion(VERSION) !== VERSION) alert("versioning.js: Invalid format or parsing function"); if (parseMapVersion(VERSION) !== VERSION) alert("versioning.js: Invalid format or parsing function");
{ {
@ -38,7 +38,7 @@ if (parseMapVersion(VERSION) !== VERSION) alert("versioning.js: Invalid format o
<strong>Latest changes:</strong> <strong>Latest changes:</strong>
<li>Azgaar Bot to answer questions and provide help</li> <li>Azgaar Bot to answer questions and provide help</li>
<li>Labels: ability to set letter spacing</li> <li>Labels: ability to set letter spacing</li>
<li>Zones update</li> <li>Zones performance improvement</li>
<li>Notes Editor: on-demand AI text generation</li> <li>Notes Editor: on-demand AI text generation</li>
<li>New style preset: Dark Seas</li> <li>New style preset: Dark Seas</li>
<li>New routes generation algorithm</li> <li>New routes generation algorithm</li>