From f31022bad1d75e9595b948947b0062cef80a5584 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=C3=81ngel=20Montero=20Lamas?= <angel.montero1@gmail.com>
Date: Tue, 2 Jan 2024 14:47:29 +0100
Subject: [PATCH 1/6] Added Burgs column to province editor

Added to province editor:
+ Burgs column
+ the number of Burgs, p.burgs.length
+ "icon-dot-circled" to go to overviewBurgs.
+ overviewBurgs Filtered by state id.
+ Fixed some typos.
---
 index.html                               |  9 ++++++++-
 modules/dynamic/editors/states-editor.js |  4 ++--
 modules/ui/provinces-editor.js           | 24 +++++++++++++++++++-----
 3 files changed, 29 insertions(+), 8 deletions(-)

diff --git a/index.html b/index.html
index 6f7cf509e..e75b7d399 100644
--- a/index.html
+++ b/index.html
@@ -4450,7 +4450,7 @@
       </div>
 
       <div id="provincesEditor" class="dialog stable" style="display: none">
-        <div id="provincesHeader" class="header" style="grid-template-columns: 11em 8em 8em 8em 5em 8em">
+        <div id="provincesHeader" class="header" style="grid-template-columns: 11em 8em 8em 6em 6em 7em 8em">
           <div data-tip="Click to sort by province name" class="sortable alphabetically" data-sortby="name">
             Province&nbsp;
           </div>
@@ -4463,6 +4463,7 @@
           <div data-tip="Click to sort by province owner" class="sortable alphabetically" data-sortby="state">
             State&nbsp;
           </div>
+          <div data-tip="Click to sort by province burgs count" class="sortable hide" data-sortby="burgs">Burgs&nbsp;</div>
           <div data-tip="Click to sort by province area" class="sortable hide" data-sortby="area">Area&nbsp;</div>
           <div data-tip="Click to sort by province population" class="sortable hide" data-sortby="population">
             Population&nbsp;
@@ -4475,6 +4476,12 @@
           <div data-tip="Provinces displayed" style="margin-left: 4px">
             Provinces:&nbsp;<span id="provincesFooterNumber">0</span>
           </div>
+          <div data-tip="Total land cells number" style="margin-left: 12px">
+            Cells:&nbsp;<span id="provincesFooterCells">0</span>
+          </div>
+          <div data-tip="Total burgs number" style="margin-left: 12px">
+            Burgs:&nbsp;<span id="provincesFooterBurgs">0</span>
+		  </div>
           <div data-tip="Average area" style="margin-left: 14px">
             Mean area:&nbsp;<span id="provincesFooterArea">0</span>
           </div>
diff --git a/modules/dynamic/editors/states-editor.js b/modules/dynamic/editors/states-editor.js
index 810f1f9c4..24a63bb61 100644
--- a/modules/dynamic/editors/states-editor.js
+++ b/modules/dynamic/editors/states-editor.js
@@ -434,13 +434,13 @@ function editStateName(state) {
   modules.editStateName = true;
 
   // add listeners
-  byId("stateNameEditorShortCulture").on("click", regenerateShortNameCuture);
+  byId("stateNameEditorShortCulture").on("click", regenerateShortNameCulture);
   byId("stateNameEditorShortRandom").on("click", regenerateShortNameRandom);
   byId("stateNameEditorAddForm").on("click", addCustomForm);
   byId("stateNameEditorCustomForm").on("change", addCustomForm);
   byId("stateNameEditorFullRegenerate").on("click", regenerateFullName);
 
-  function regenerateShortNameCuture() {
+  function regenerateShortNameCulture() {
     const state = +stateNameEditor.dataset.state;
     const culture = pack.states[state].culture;
     const name = Names.getState(Names.getCultureShort(culture), culture);
diff --git a/modules/ui/provinces-editor.js b/modules/ui/provinces-editor.js
index 07ee522d0..6a947dab1 100644
--- a/modules/ui/provinces-editor.js
+++ b/modules/ui/provinces-editor.js
@@ -44,12 +44,14 @@ function editProvinces() {
       cl = el.classList,
       line = el.parentNode,
       p = +line.dataset.id;
+    const stateId = +document.getElementById("provincesFilterState").value;
 
     if (el.tagName === "FILL-BOX") changeFill(el);
     else if (cl.contains("name")) editProvinceName(p);
     else if (cl.contains("coaIcon")) editEmblem("province", "provinceCOA" + p, pack.provinces[p]);
     else if (cl.contains("icon-star-empty")) capitalZoomIn(p);
     else if (cl.contains("icon-flag-empty")) triggerIndependencePromps(p);
+    else if (cl.contains("icon-dot-circled")) overviewBurgs({stateId}); // {stateId}, filtered view for that state
     else if (cl.contains("culturePopulation")) changePopulation(p);
     else if (cl.contains("icon-pin")) toggleFog(p, cl);
     else if (cl.contains("icon-trash-empty")) removeProvince(p);
@@ -107,7 +109,7 @@ function editProvinces() {
     statesSorted.forEach(s => stateFilter.options.add(new Option(s.name, s.i, false, s.i == selectedState)));
   }
 
-  // add line for each state
+  // add line for each province
   function provincesEditorAddLines() {
     const unit = " " + getAreaUnit();
     const selectedState = +document.getElementById("provincesFilterState").value;
@@ -117,6 +119,7 @@ function editProvinces() {
     let lines = "",
       totalArea = 0,
       totalPopulation = 0;
+    let totalBurgs = 0;
 
     for (const p of filtered) {
       const area = getArea(p.area);
@@ -128,6 +131,7 @@ function editProvinces() {
         rural
       )}; Urban population: ${si(urban)}`;
       totalPopulation += population;
+      totalBurgs += p.burgs.length;
 
       const stateName = pack.states[p.state].name;
       const capital = p.burg ? pack.burgs[p.burg].name : "";
@@ -144,6 +148,7 @@ function editProvinces() {
         data-state="${stateName}"
         data-area=${area}
         data-population=${population}
+        data-burgs=${p.burgs.length}
       >
         <fill-box fill="${p.color}"></fill-box>
         <input data-tip="Province name. Click to change" class="name pointer" value="${p.name}" readonly />
@@ -163,6 +168,8 @@ function editProvinces() {
           ${p.burgs.length ? getCapitalOptions(p.burgs, p.burg) : ""}
         </select>
         <input data-tip="Province owner" class="provinceOwner" value="${stateName}" disabled">
+        <span data-tip="Click to overview province burgs" style="padding-right: 1px" class="icon-dot-circled pointer hide"></span>
+        <div data-tip="Burgs count" class="provinceBurgs hide">${p.burgs.length}</div>
         <span data-tip="Province area" style="padding-right: 4px" class="icon-map-o hide"></span>
         <div data-tip="Province area" class="biomeArea hide">${si(area) + unit}</div>
         <span data-tip="${populationTip}" class="icon-male hide"></span>
@@ -180,6 +187,8 @@ function editProvinces() {
 
     // update footer
     provincesFooterNumber.innerHTML = filtered.length;
+    byId("provincesFooterCells").innerHTML = pack.cells.h.filter(h => h >= 20).length;
+    byId("provincesFooterBurgs").innerHTML = totalBurgs;
     provincesFooterArea.innerHTML = filtered.length ? si(totalArea / filtered.length) + unit : 0 + unit;
     provincesFooterPopulation.innerHTML = filtered.length ? si(totalPopulation / filtered.length) : 0;
     provincesFooterArea.dataset.area = totalArea;
@@ -520,12 +529,12 @@ function editProvinces() {
     modules.editProvinceName = true;
 
     // add listeners
-    document.getElementById("provinceNameEditorShortCulture").addEventListener("click", regenerateShortNameCuture);
+    document.getElementById("provinceNameEditorShortCulture").addEventListener("click", regenerateShortNameCulture);
     document.getElementById("provinceNameEditorShortRandom").addEventListener("click", regenerateShortNameRandom);
     document.getElementById("provinceNameEditorAddForm").addEventListener("click", addCustomForm);
     document.getElementById("provinceNameEditorFullRegenerate").addEventListener("click", regenerateFullName);
 
-    function regenerateShortNameCuture() {
+    function regenerateShortNameCulture() {
       const province = +provinceNameEditor.dataset.province;
       const culture = pack.cells.culture[pack.provinces[province].center];
       const name = Names.getState(Names.getCultureShort(culture), culture);
@@ -576,12 +585,17 @@ function editProvinces() {
   function togglePercentageMode() {
     if (body.dataset.type === "absolute") {
       body.dataset.type = "percentage";
+      const totalCells = +byId("statesFooterCells").innerText;
+      const totalBurgs = +byId("provincesFooterBurgs").innerText;
       const totalArea = +provincesFooterArea.dataset.area;
       const totalPopulation = +provincesFooterPopulation.dataset.population;
 
       body.querySelectorAll(":scope > div").forEach(function (el) {
-        el.querySelector(".biomeArea").innerHTML = rn((+el.dataset.area / totalArea) * 100) + "%";
-        el.querySelector(".culturePopulation").innerHTML = rn((+el.dataset.population / totalPopulation) * 100) + "%";
+        const {cells, burgs, area, population} = el.dataset;
+        el.querySelector(".provinceCells").innerText = rn((+cells / totalCells) * 100) + "%";
+        el.querySelector(".provinceBurgs").innerText = rn((+burgs / totalBurgs) * 100) + "%";
+        el.querySelector(".biomeArea").innerHTML = rn((+area / totalArea) * 100) + "%";
+        el.querySelector(".culturePopulation").innerHTML = rn((+population / totalPopulation) * 100) + "%";
       });
     } else {
       body.dataset.type = "absolute";

From 18cbe2979e8fb3de38b6591de3ff694dbeaa5a8e Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=C3=81ngel=20Montero=20Lamas?= <angel.montero1@gmail.com>
Date: Tue, 2 Jan 2024 17:22:44 +0100
Subject: [PATCH 2/6] fixed code as Azgaar suggested

+ Corrected provincesHeader distance in em.
+ const stateId = pack.provinces[p].state;
- Deleted cell count.
---
 index.html                     | 2 +-
 modules/ui/provinces-editor.js | 5 ++---
 2 files changed, 3 insertions(+), 4 deletions(-)

diff --git a/index.html b/index.html
index e75b7d399..230f69952 100644
--- a/index.html
+++ b/index.html
@@ -4450,7 +4450,7 @@
       </div>
 
       <div id="provincesEditor" class="dialog stable" style="display: none">
-        <div id="provincesHeader" class="header" style="grid-template-columns: 11em 8em 8em 6em 6em 7em 8em">
+        <div id="provincesHeader" class="header" style="grid-template-columns: 11em 8em 8em 6em 6em 6em 8em">
           <div data-tip="Click to sort by province name" class="sortable alphabetically" data-sortby="name">
             Province&nbsp;
           </div>
diff --git a/modules/ui/provinces-editor.js b/modules/ui/provinces-editor.js
index 6a947dab1..08e5fbea9 100644
--- a/modules/ui/provinces-editor.js
+++ b/modules/ui/provinces-editor.js
@@ -44,14 +44,14 @@ function editProvinces() {
       cl = el.classList,
       line = el.parentNode,
       p = +line.dataset.id;
-    const stateId = +document.getElementById("provincesFilterState").value;
+    const stateId = pack.provinces[p].state;
 
     if (el.tagName === "FILL-BOX") changeFill(el);
     else if (cl.contains("name")) editProvinceName(p);
     else if (cl.contains("coaIcon")) editEmblem("province", "provinceCOA" + p, pack.provinces[p]);
     else if (cl.contains("icon-star-empty")) capitalZoomIn(p);
     else if (cl.contains("icon-flag-empty")) triggerIndependencePromps(p);
-    else if (cl.contains("icon-dot-circled")) overviewBurgs({stateId}); // {stateId}, filtered view for that state
+    else if (cl.contains("icon-dot-circled")) overviewBurgs({stateId});
     else if (cl.contains("culturePopulation")) changePopulation(p);
     else if (cl.contains("icon-pin")) toggleFog(p, cl);
     else if (cl.contains("icon-trash-empty")) removeProvince(p);
@@ -187,7 +187,6 @@ function editProvinces() {
 
     // update footer
     provincesFooterNumber.innerHTML = filtered.length;
-    byId("provincesFooterCells").innerHTML = pack.cells.h.filter(h => h >= 20).length;
     byId("provincesFooterBurgs").innerHTML = totalBurgs;
     provincesFooterArea.innerHTML = filtered.length ? si(totalArea / filtered.length) + unit : 0 + unit;
     provincesFooterPopulation.innerHTML = filtered.length ? si(totalPopulation / filtered.length) : 0;

From f3253380c528526ce3bc8c3f39c00d0132494b33 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=C3=81ngel=20Montero=20Lamas?= <angel.montero1@gmail.com>
Date: Tue, 2 Jan 2024 17:33:57 +0100
Subject: [PATCH 3/6] deleted HTML code for provincesFooter cells

- Deleted Total land cells number HTML from provincesFooter.
---
 index.html | 3 ---
 1 file changed, 3 deletions(-)

diff --git a/index.html b/index.html
index 230f69952..4feb593a7 100644
--- a/index.html
+++ b/index.html
@@ -4476,9 +4476,6 @@
           <div data-tip="Provinces displayed" style="margin-left: 4px">
             Provinces:&nbsp;<span id="provincesFooterNumber">0</span>
           </div>
-          <div data-tip="Total land cells number" style="margin-left: 12px">
-            Cells:&nbsp;<span id="provincesFooterCells">0</span>
-          </div>
           <div data-tip="Total burgs number" style="margin-left: 12px">
             Burgs:&nbsp;<span id="provincesFooterBurgs">0</span>
 		  </div>

From 8b57426dc8d1da2df35cfcc53aa7d25a7b3aa36a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=C3=81ngel=20Montero=20Lamas?= <angel.montero1@gmail.com>
Date: Tue, 16 Jan 2024 19:30:17 +0100
Subject: [PATCH 4/6] deleting totalCells in the code, maybe i will add
 provinceCells in the future.

Deleted lines for const totalCells and for (+cells / totalCells) * 100 + "%";
---
 modules/ui/provinces-editor.js | 2 --
 1 file changed, 2 deletions(-)

diff --git a/modules/ui/provinces-editor.js b/modules/ui/provinces-editor.js
index 08e5fbea9..7ca02fdbc 100644
--- a/modules/ui/provinces-editor.js
+++ b/modules/ui/provinces-editor.js
@@ -584,14 +584,12 @@ function editProvinces() {
   function togglePercentageMode() {
     if (body.dataset.type === "absolute") {
       body.dataset.type = "percentage";
-      const totalCells = +byId("statesFooterCells").innerText;
       const totalBurgs = +byId("provincesFooterBurgs").innerText;
       const totalArea = +provincesFooterArea.dataset.area;
       const totalPopulation = +provincesFooterPopulation.dataset.population;
 
       body.querySelectorAll(":scope > div").forEach(function (el) {
         const {cells, burgs, area, population} = el.dataset;
-        el.querySelector(".provinceCells").innerText = rn((+cells / totalCells) * 100) + "%";
         el.querySelector(".provinceBurgs").innerText = rn((+burgs / totalBurgs) * 100) + "%";
         el.querySelector(".biomeArea").innerHTML = rn((+area / totalArea) * 100) + "%";
         el.querySelector(".culturePopulation").innerHTML = rn((+population / totalPopulation) * 100) + "%";

From 64ce8cc6e4df16bf319b5061346183d95acdfe16 Mon Sep 17 00:00:00 2001
From: Azgaar <azgaar.fmg@yandex.com>
Date: Wed, 14 Feb 2024 20:20:30 +0100
Subject: [PATCH 5/6] refactor: cleanup

---
 modules/ui/provinces-editor.js | 30 ++++++++++++++----------------
 1 file changed, 14 insertions(+), 16 deletions(-)

diff --git a/modules/ui/provinces-editor.js b/modules/ui/provinces-editor.js
index 7ca02fdbc..70f6f777b 100644
--- a/modules/ui/provinces-editor.js
+++ b/modules/ui/provinces-editor.js
@@ -73,9 +73,8 @@ function editProvinces() {
   }
 
   function collectStatistics() {
-    const cells = pack.cells,
-      provinces = pack.provinces,
-      burgs = pack.burgs;
+    const {cells, provinces, burgs} = pack;
+
     provinces.forEach(p => {
       if (!p.i || p.removed) return;
       p.area = p.rural = p.urban = 0;
@@ -116,9 +115,10 @@ function editProvinces() {
     let filtered = pack.provinces.filter(p => p.i && !p.removed); // all valid burgs
     if (selectedState != -1) filtered = filtered.filter(p => p.state === selectedState); // filtered by state
     body.innerHTML = "";
-    let lines = "",
-      totalArea = 0,
-      totalPopulation = 0;
+
+    let lines = "";
+    let totalArea = 0;
+    let totalPopulation = 0;
     let totalBurgs = 0;
 
     for (const p of filtered) {
@@ -186,12 +186,12 @@ function editProvinces() {
     body.innerHTML = lines;
 
     // update footer
-    provincesFooterNumber.innerHTML = filtered.length;
+    byId("provincesFooterNumber").innerHTML = filtered.length;
     byId("provincesFooterBurgs").innerHTML = totalBurgs;
-    provincesFooterArea.innerHTML = filtered.length ? si(totalArea / filtered.length) + unit : 0 + unit;
-    provincesFooterPopulation.innerHTML = filtered.length ? si(totalPopulation / filtered.length) : 0;
-    provincesFooterArea.dataset.area = totalArea;
-    provincesFooterPopulation.dataset.population = totalPopulation;
+    byId("provincesFooterArea").innerHTML = filtered.length ? si(totalArea / filtered.length) + unit : 0 + unit;
+    byId("provincesFooterPopulation").innerHTML = filtered.length ? si(totalPopulation / filtered.length) : 0;
+    byId("provincesFooterArea").dataset.area = totalArea;
+    byId("provincesFooterPopulation").dataset.population = totalPopulation;
 
     body.querySelectorAll("div.states").forEach(el => {
       el.addEventListener("click", selectProvinceOnLineClick);
@@ -1075,10 +1075,7 @@ function editProvinces() {
 
   function downloadProvincesData() {
     const unit = areaUnit.value === "square" ? distanceUnitInput.value + "2" : areaUnit.value;
-    let data =
-      "Id,Province,Full Name,Form,State,Color,Capital,Area " +
-      unit +
-      ",Total Population,Rural Population,Urban Population\n"; // headers
+    let data = `Id,Province,Full Name,Form,State,Color,Capital,Area ${unit},Total Population,Rural Population,Urban Population,Burgs\n`; // headers
 
     body.querySelectorAll(":scope > div").forEach(function (el) {
       const key = parseInt(el.dataset.id);
@@ -1093,7 +1090,8 @@ function editProvinces() {
       data += el.dataset.area + ",";
       data += el.dataset.population + ",";
       data += `${Math.round(provincePack.rural * populationRate)},`;
-      data += `${Math.round(provincePack.urban * populationRate * urbanization)}\n`;
+      data += `${Math.round(provincePack.urban * populationRate * urbanization)},`;
+      data += el.dataset.burgs + "\n";
     });
 
     const name = getFileName("Provinces") + ".csv";

From 2a97c95a7fe30e371d36f70639954dd2eada2f2c Mon Sep 17 00:00:00 2001
From: Azgaar <azgaar.fmg@yandex.com>
Date: Wed, 14 Feb 2024 20:21:27 +0100
Subject: [PATCH 6/6] refactor: cleanup

---
 modules/ui/provinces-editor.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/modules/ui/provinces-editor.js b/modules/ui/provinces-editor.js
index 70f6f777b..99f3cc8d7 100644
--- a/modules/ui/provinces-editor.js
+++ b/modules/ui/provinces-editor.js
@@ -1089,8 +1089,8 @@ function editProvinces() {
       data += el.dataset.capital + ",";
       data += el.dataset.area + ",";
       data += el.dataset.population + ",";
-      data += `${Math.round(provincePack.rural * populationRate)},`;
-      data += `${Math.round(provincePack.urban * populationRate * urbanization)},`;
+      data += Math.round(provincePack.rural * populationRate) + ",";
+      data += Math.round(provincePack.urban * populationRate * urbanization) + ",";
       data += el.dataset.burgs + "\n";
     });