feat(#891): edit diplomatic relations in bulk

This commit is contained in:
Azgaar 2022-12-11 01:37:30 +03:00
parent f20029eac5
commit ce07c20fff
3 changed files with 53 additions and 16 deletions

View file

@ -7884,7 +7884,7 @@
<script defer src="modules/ui/burg-editor.js"></script> <script defer src="modules/ui/burg-editor.js"></script>
<script defer src="modules/ui/units-editor.js"></script> <script defer src="modules/ui/units-editor.js"></script>
<script defer src="modules/ui/notes-editor.js"></script> <script defer src="modules/ui/notes-editor.js"></script>
<script defer src="modules/ui/diplomacy-editor.js"></script> <script defer src="modules/ui/diplomacy-editor.js?v=1.88.04"></script>
<script defer src="modules/ui/zones-editor.js"></script> <script defer src="modules/ui/zones-editor.js"></script>
<script defer src="modules/ui/burgs-overview.js"></script> <script defer src="modules/ui/burgs-overview.js"></script>
<script defer src="modules/ui/rivers-overview.js"></script> <script defer src="modules/ui/rivers-overview.js"></script>

View file

@ -213,33 +213,70 @@ function editDiplomacy() {
function selectRelation(subjectId, objectId, currentRelation) { function selectRelation(subjectId, objectId, currentRelation) {
const states = pack.states; const states = pack.states;
const subject = states[subjectId]; const subject = states[subjectId];
const header = `<div style="margin-bottom: 0.3em"><svg class="coaIcon" viewBox="0 0 200 200"><use href="#stateCOA${subject.i}"></use></svg> <b>${subject.fullName}</b></div>`; const object = states[objectId];
const options = Object.entries(relations) const relationsSelector = Object.entries(relations)
.map( .map(
([relation, {color, inText, tip}]) => ([relation, {color, inText, tip}]) => /* html */ `
`<div style="margin-block: 0.2em" data-tip="${tip}"><label class="pointer"> <div data-tip="${tip}">
<input type="radio" name="relationSelect" value="${relation}" ${currentRelation === relation && "checked"} > <label class="pointer">
<fill-box fill="${color}" size=".8em"></fill-box> <input type="radio" name="relationSelect" value="${relation}"
${inText} ${currentRelation === relation && "checked"} >
</label></div>` <fill-box fill="${color}" size=".8em"></fill-box>
${inText}
</label>
</div>
`
) )
.join(""); .join("");
const object = states[objectId]; const objectsSelector = states
const footer = `<div style="margin-top: 0.7em"><svg class="coaIcon" viewBox="0 0 200 200"><use href="#stateCOA${object.i}"></use></svg> <b>${object.fullName}</b></div>`; .filter(s => s.i && !s.removed && s.i !== subjectId)
.map(
s => /* html */ `
<div data-tip="${s.fullName}">
<input id="selectState${s.i}" class="checkbox" type="checkbox" name="objectSelect" value="${s.i}"
${s.i === objectId && "checked"} />
<label for="selectState${s.i}" class="checkbox-label">
<svg class="coaIcon" viewBox="0 0 200 200">
<use href="#stateCOA${s.i}"></use>
</svg>
${s.fullName}
</label>
</div>
`
)
.join("");
alertMessage.innerHTML = /* html */ `<div style="overflow: hidden">${header} ${options} ${footer}</div>`; alertMessage.innerHTML = /* html */ `
<form id='relationsForm' style="overflow: hidden; display: flex; flex-direction: column; gap: .3em; padding: 0.1em 0;">
<header>
<svg class="coaIcon" viewBox="0 0 200 200">
<use href="#stateCOA${subject.i}"></use>
</svg>
<b>${subject.fullName}</b>
</header>
<main style='display: flex; gap: 1em;'>
<section style="display: flex; flex-direction: column; gap: .3em;">${relationsSelector}</section>
<section style="display: flex; flex-direction: column; gap: .3em;">${objectsSelector}</section>
</main>
</form>
`;
$("#alert").dialog({ $("#alert").dialog({
width: fitContent(), width: fitContent(),
title: `Change relations`, title: `Change relations`,
buttons: { buttons: {
Apply: function () { Apply: function () {
const newRelation = document.querySelector('input[name="relationSelect"]:checked')?.value; const formData = new FormData(byId("relationsForm"));
changeRelation(subjectId, objectId, currentRelation, newRelation); const newRelation = formData.get("relationSelect");
const objectIds = [...formData.getAll("objectSelect")].map(Number);
for (const objectId of objectIds) {
changeRelation(subjectId, objectId, currentRelation, newRelation);
}
$(this).dialog("close"); $(this).dialog("close");
}, },
Cancel: function () { Cancel: function () {

View file

@ -1,7 +1,7 @@
"use strict"; "use strict";
// version and caching control // version and caching control
const version = "1.88.03"; // generator version, update each time const version = "1.88.04"; // generator version, update each time
{ {
document.title += " v" + version; document.title += " v" + version;