From 44c134ebd09de96651fda80598229a3e56d4aab5 Mon Sep 17 00:00:00 2001
From: Azgaar <maxganiev@yandex.ru>
Date: Fri, 31 Dec 2021 19:57:39 +0300
Subject: [PATCH] diplomacy - change relations from matrix

---
 index.html                     |  2 +-
 modules/ui/diplomacy-editor.js | 55 ++++++++++++++++++++--------------
 2 files changed, 33 insertions(+), 24 deletions(-)

diff --git a/index.html b/index.html
index 4467aee6..f4c9bda7 100644
--- a/index.html
+++ b/index.html
@@ -2749,7 +2749,7 @@
         <button id="diplomacyEditorRefresh" data-tip="Refresh the Editor" class="icon-cw"></button>
         <button id="diplomacyEditStyle" data-tip="Edit states (including diplomacy view) style in Style Editor" class="icon-adjust"></button>
         <button id="diplomacyRegenerate" data-tip="Regenerate diplomatical relations" class="icon-retweet"></button>
-        <button id="diplomacyReset" data-tip="Reset all diplomatical relations to Neutral" class="icon-eraser"></button>
+        <button id="diplomacyReset" data-tip="Reset diplomatical relations of selected state to Neutral" class="icon-eraser"></button>
         <button id="diplomacyHistory" data-tip="Show relations history" class="icon-hourglass-1"></button>
         <button id="diplomacyShowMatrix" data-tip="Show relations matrix" class="icon-list-bullet"></button>
         <button id="diplomacyExport" data-tip="Save state relations matrix as a text file (.csv)" class="icon-download"></button>
diff --git a/modules/ui/diplomacy-editor.js b/modules/ui/diplomacy-editor.js
index e28fe2d3..657f6b73 100644
--- a/modules/ui/diplomacy-editor.js
+++ b/modules/ui/diplomacy-editor.js
@@ -268,6 +268,10 @@ function editDiplomacy() {
     else chronicle.push(change());
 
     refreshDiplomacyEditor();
+    if (diplomacyMatrix.offsetParent) {
+      document.getElementById("diplomacyMatrixBody").innerHTML = "";
+      showRelationsMatrix();
+    }
   }
 
   function regenerateRelations() {
@@ -276,18 +280,16 @@ function editDiplomacy() {
   }
 
   function resetRelations() {
-    pack.states[0].diplomacy = [];
+    const selectedId = +body.querySelector("div.Self")?.dataset?.id;
+    if (!selectedId) return;
+    const states = pack.states;
 
-    for (const state of pack.states) {
-      if (!state.i || state.removed) continue;
-
-      const newRelations = state.diplomacy.map(relations => {
-        if (relations === "x") return "x";
-        return "Neutral";
-      });
-
-      state.diplomacy = newRelations;
-    }
+    states[selectedId].diplomacy.forEach((relations, index) => {
+      if (relations !== "x") {
+        states[selectedId].diplomacy[index] = "Neutral";
+        states[index].diplomacy[selectedId] = "Neutral";
+      }
+    });
 
     refreshDiplomacyEditor();
   }
@@ -339,7 +341,7 @@ function editDiplomacy() {
   function showRelationsMatrix() {
     const states = pack.states.filter(s => s.i && !s.removed);
     const valid = states.map(state => state.i);
-    const body = document.getElementById("diplomacyMatrixBody");
+    const diplomacyMatrixBody = document.getElementById("diplomacyMatrixBody");
 
     let table = `<table><thead><tr><th data-tip='&#8205;'></th>`;
     table += states.map(state => `<th data-tip='Relations to ${state.fullName}'>${state.name}</th>`).join("") + `</tr>`;
@@ -347,32 +349,39 @@ function editDiplomacy() {
 
     states.forEach(state => {
       table +=
-        `<tr><th data-tip='Relations of ${state.fullName}'>${state.name}</th>` +
+        `<tr data-id=${state.i}><th data-tip='Relations of ${state.fullName}'>${state.name}</th>` +
         state.diplomacy
           .filter((v, i) => valid.includes(i))
           .map((relation, index) => {
             const relationObj = relations[relation];
             if (!relationObj) return `<td class='${relation}'>${relation}</td>`;
 
-            const stateName = pack.states[valid[index]].fullName;
-            const tip = `${state.fullName} ${relationObj.inText} ${stateName}`;
-            return `<td data-tip='${tip}' class='${relation}'>${relation}</td>`;
+            const objectState = pack.states[valid[index]];
+            const tip = `${state.fullName} ${relationObj.inText} ${objectState.fullName}`;
+            return `<td data-id=${objectState.i} data-tip='${tip}' class='${relation}'>${relation}</td>`;
           })
           .join("") +
         "</tr>";
     });
 
     table += `</tbody></table>`;
-    body.innerHTML = table;
+    diplomacyMatrixBody.innerHTML = table;
 
-    const tableEl = body.querySelector("table");
-    tableEl.addEventListener("click", showRelationsDropdown);
+    const tableEl = diplomacyMatrixBody.querySelector("table");
+    tableEl.addEventListener("click", function (event) {
+      const el = event.target;
+      if (el.tagName !== "TD") return;
+
+      const currentRelation = el.innerText;
+      if (!relations[currentRelation]) return;
+
+      const subjectId = +el.closest("tr")?.dataset?.id;
+      const objectId = +el?.dataset?.id;
+
+      selectRelation(subjectId, objectId, currentRelation);
+    });
 
     $("#diplomacyMatrix").dialog({title: "Relations matrix", position: {my: "center", at: "center", of: "svg"}, buttons: {}});
-
-    function showRelationsDropdown() {
-      if (this.tagName !== "TD") return;
-    }
   }
 
   function downloadDiplomacyData() {