From f129ff557304f745bb3edce66c458c1b1335e5b0 Mon Sep 17 00:00:00 2001
From: Azgaar <azgaar.fmg@yandex.com>
Date: Mon, 26 Aug 2024 02:12:30 +0200
Subject: [PATCH] feat: style - store emblem size mod in style (v1.99.10)

---
 index.html                 | 38 +++++++-------------------------------
 modules/ui/layers.js       |  6 +++---
 modules/ui/style.js        | 20 +++++++++++++++++---
 modules/ui/stylePresets.js |  3 +++
 modules/ui/submap.js       |  5 -----
 styles/ancient.json        |  9 +++++++++
 styles/atlas.json          |  9 +++++++++
 styles/clean.json          |  9 +++++++++
 styles/cyberpunk.json      | 11 ++++++++++-
 styles/darkSeas.json       |  9 +++++++++
 styles/default.json        |  9 +++++++++
 styles/gloom.json          |  9 +++++++++
 styles/light.json          |  9 +++++++++
 styles/monochrome.json     |  9 +++++++++
 styles/night.json          |  9 +++++++++
 styles/pale.json           |  9 +++++++++
 styles/watercolor.json     |  9 +++++++++
 versioning.js              |  2 +-
 18 files changed, 140 insertions(+), 44 deletions(-)

diff --git a/index.html b/index.html
index b2c55863..6b1ad48d 100644
--- a/index.html
+++ b/index.html
@@ -1341,45 +1341,21 @@
               <tr data-tip="Set state emblems size multiplier">
                 <td>State size</td>
                 <td>
-                  <input
-                    id="emblemsStateSizeInput"
-                    data-stored="emblemsStateSize"
-                    type="number"
-                    min="0"
-                    max="5"
-                    step=".02"
-                    value="1"
-                  />
+                  <slider-input id="emblemsStateSizeInput" min="0" max="5" step=".01"></slider-input>
                 </td>
               </tr>
 
               <tr data-tip="Set province emblems size multiplier">
                 <td>Province size</td>
                 <td>
-                  <input
-                    id="emblemsProvinceSizeInput"
-                    data-stored="emblemsProvinceSize"
-                    type="number"
-                    min="0"
-                    max="5"
-                    step=".02"
-                    value="1"
-                  />
+                  <slider-input id="emblemsProvinceSizeInput" min="0" max="5" step=".01"></slider-input>
                 </td>
               </tr>
 
               <tr data-tip="Set burg emblems size multiplier">
                 <td>Burg size</td>
                 <td>
-                  <input
-                    id="emblemsBurgSizeInput"
-                    data-stored="emblemsBurgSize"
-                    type="number"
-                    min="0"
-                    max="5"
-                    step=".02"
-                    value="1"
-                  />
+                  <slider-input id="emblemsBurgSizeInput" min="0" max="5" step=".01"></slider-input>
                 </td>
               </tr>
 
@@ -8015,7 +7991,7 @@
     <script src="config/heightmap-templates.js"></script>
     <script src="config/precreated-heightmaps.js"></script>
     <script src="modules/heightmap-generator.js?v=1.99.00"></script>
-    <script src="modules/ocean-layers.js?v=1.99.07"></script>
+    <script src="modules/ocean-layers.js?v=1.99.10"></script>
     <script src="modules/river-generator.js?v=1.99.05"></script>
     <script src="modules/lakes.js?v=1.99.00"></script>
     <script src="modules/biomes.js?v=1.99.00"></script>
@@ -8035,14 +8011,14 @@
     <script src="modules/fonts.js?v=1.99.03"></script>
     <script src="modules/ui/layers.js?v=1.99.05"></script>
     <script src="modules/ui/measurers.js?v=1.99.00"></script>
-    <script src="modules/ui/stylePresets.js?v=1.99.03"></script>
+    <script src="modules/ui/stylePresets.js?v=1.99.10"></script>
 
     <script src="modules/ui/general.js?v=1.99.05"></script>
     <script src="modules/ui/options.js?v=1.99.05"></script>
     <script src="main.js?v=1.99.00"></script>
 
     <script defer src="modules/relief-icons.js?v=1.99.05"></script>
-    <script defer src="modules/ui/style.js?v=1.99.08"></script>
+    <script defer src="modules/ui/style.js?v=1.99.10"></script>
     <script defer src="modules/ui/editors.js?v=1.99.05"></script>
     <script defer src="modules/ui/tools.js?v=1.99.06"></script>
     <script defer src="modules/ui/world-configurator.js?v=1.99.00"></script>
@@ -8079,7 +8055,7 @@
     <script defer src="modules/ui/emblems-editor.js?v=1.99.00"></script>
     <script defer src="modules/ui/markers-editor.js?v=1.99.00"></script>
     <script defer src="modules/ui/3d.js?v=1.99.00"></script>
-    <script defer src="modules/ui/submap.js?v=1.99.05"></script>
+    <script defer src="modules/ui/submap.js?v=1.99.10"></script>
     <script defer src="modules/ui/hotkeys.js?v=1.99.05"></script>
     <script defer src="modules/coa-renderer.js?v=1.99.00"></script>
     <script defer src="libs/rgbquant.min.js"></script>
diff --git a/modules/ui/layers.js b/modules/ui/layers.js
index 23fc836d..5572ef78 100644
--- a/modules/ui/layers.js
+++ b/modules/ui/layers.js
@@ -1908,21 +1908,21 @@ function drawEmblems() {
   const getStateEmblemsSize = () => {
     const startSize = minmax((graphHeight + graphWidth) / 40, 10, 100);
     const statesMod = 1 + validStates.length / 100 - (15 - validStates.length) / 200; // states number modifier
-    const sizeMod = +byId("emblemsStateSizeInput").value || 1;
+    const sizeMod = +emblems.select("#stateEmblems").attr("data-size") || 1;
     return rn((startSize / statesMod) * sizeMod); // target size ~50px on 1536x754 map with 15 states
   };
 
   const getProvinceEmblemsSize = () => {
     const startSize = minmax((graphHeight + graphWidth) / 100, 5, 70);
     const provincesMod = 1 + validProvinces.length / 1000 - (115 - validProvinces.length) / 1000; // states number modifier
-    const sizeMod = +byId("emblemsProvinceSizeInput").value || 1;
+    const sizeMod = +emblems.select("#provinceEmblems").attr("data-size") || 1;
     return rn((startSize / provincesMod) * sizeMod); // target size ~20px on 1536x754 map with 115 provinces
   };
 
   const getBurgEmblemSize = () => {
     const startSize = minmax((graphHeight + graphWidth) / 185, 2, 50);
     const burgsMod = 1 + validBurgs.length / 1000 - (450 - validBurgs.length) / 1000; // states number modifier
-    const sizeMod = +byId("emblemsBurgSizeInput").value || 1;
+    const sizeMod = +emblems.select("#burgEmblems").attr("data-size") || 1;
     return rn((startSize / burgsMod) * sizeMod); // target size ~8.5px on 1536x754 map with 450 burgs
   };
 
diff --git a/modules/ui/style.js b/modules/ui/style.js
index 19bce98b..aa481ad1 100644
--- a/modules/ui/style.js
+++ b/modules/ui/style.js
@@ -337,6 +337,9 @@ function selectStyleElement() {
     styleEmblems.style.display = "block";
     styleStrokeWidth.style.display = "block";
     styleStrokeWidthInput.value = el.attr("stroke-width") || 1;
+    emblemsStateSizeInput.value = emblems.select("#stateEmblems").attr("data-size") || 1;
+    emblemsProvinceSizeInput.value = emblems.select("#provinceEmblems").attr("data-size") || 1;
+    emblemsBurgSizeInput.value = emblems.select("#burgEmblems").attr("data-size") || 1;
   }
 
   // update group options
@@ -945,9 +948,20 @@ styleArmiesSize.addEventListener("input", e => {
   });
 });
 
-emblemsStateSizeInput.addEventListener("change", drawEmblems);
-emblemsProvinceSizeInput.addEventListener("change", drawEmblems);
-emblemsBurgSizeInput.addEventListener("change", drawEmblems);
+emblemsStateSizeInput.addEventListener("change", e => {
+  emblems.select("#stateEmblems").attr("data-size", e.target.value);
+  drawEmblems();
+});
+
+emblemsProvinceSizeInput.addEventListener("change", e => {
+  emblems.select("#provinceEmblems").attr("data-size", e.target.value);
+  drawEmblems();
+});
+
+emblemsBurgSizeInput.addEventListener("change", e => {
+  emblems.select("#burgEmblems").attr("data-size", e.target.value);
+  drawEmblems();
+});
 
 // request a URL to image to be used as a texture
 function textureProvideURL() {
diff --git a/modules/ui/stylePresets.js b/modules/ui/stylePresets.js
index d9233d2f..4ce4b2a5 100644
--- a/modules/ui/stylePresets.js
+++ b/modules/ui/stylePresets.js
@@ -238,6 +238,9 @@ function addStylePreset() {
       ],
       "#ice": ["opacity", "fill", "stroke", "stroke-width", "filter"],
       "#emblems": ["opacity", "stroke-width", "filter"],
+      "#emblems > #stateEmblems": ["data-size"],
+      "#emblems > #provinceEmblems": ["data-size"],
+      "#emblems > #burgEmblems": ["data-size"],
       "#texture": ["opacity", "filter", "mask", "data-x", "data-y", "data-href"],
       "#zones": ["opacity", "stroke", "stroke-width", "stroke-dasharray", "stroke-linecap", "filter", "mask"],
       "#oceanLayers": ["filter", "layers"],
diff --git a/modules/ui/submap.js b/modules/ui/submap.js
index c5f24972..d5e36fcc 100644
--- a/modules/ui/submap.js
+++ b/modules/ui/submap.js
@@ -316,11 +316,6 @@ window.UISubmap = (function () {
       bl.dataset["size"] = Math.max(rn((size + size / scale) / 2, 2), 1) * scale;
     }
 
-    // emblems
-    const emblemMod = minmax((scale - 1) * 0.3 + 1, 0.5, 5);
-    emblemsStateSizeInput.value = minmax(+emblemsStateSizeInput.value * emblemMod, 0.5, 5);
-    emblemsProvinceSizeInput.value = minmax(+emblemsProvinceSizeInput.value * emblemMod, 0.5, 5);
-    emblemsBurgSizeInput.value = minmax(+emblemsBurgSizeInput.value * emblemMod, 0.5, 5);
     drawEmblems();
   }
 
diff --git a/styles/ancient.json b/styles/ancient.json
index 17d210a5..8bc05ec2 100644
--- a/styles/ancient.json
+++ b/styles/ancient.json
@@ -258,6 +258,15 @@
     "stroke-width": 0.8,
     "filter": "url(#dropShadow05)"
   },
+  "#emblems > #stateEmblems": {
+    "data-size": 1
+  },
+  "#emblems > #provinceEmblems": {
+    "data-size": 1
+  },
+  "#emblems > #burgEmblems": {
+    "data-size": 1
+  },
   "#texture": {
     "opacity": 0.6,
     "filter": "",
diff --git a/styles/atlas.json b/styles/atlas.json
index d8936b65..d7990935 100644
--- a/styles/atlas.json
+++ b/styles/atlas.json
@@ -258,6 +258,15 @@
     "stroke-width": 1,
     "filter": null
   },
+  "#emblems > #stateEmblems": {
+    "data-size": 1
+  },
+  "#emblems > #provinceEmblems": {
+    "data-size": 1
+  },
+  "#emblems > #burgEmblems": {
+    "data-size": 1
+  },
   "#texture": {
     "opacity": 0.2,
     "filter": null,
diff --git a/styles/clean.json b/styles/clean.json
index ba6fc3a5..82681e28 100644
--- a/styles/clean.json
+++ b/styles/clean.json
@@ -260,6 +260,15 @@
     "stroke-width": 1,
     "filter": null
   },
+  "#emblems > #stateEmblems": {
+    "data-size": 1
+  },
+  "#emblems > #provinceEmblems": {
+    "data-size": 1
+  },
+  "#emblems > #burgEmblems": {
+    "data-size": 1
+  },
   "#texture": {
     "opacity": 0.2,
     "filter": null,
diff --git a/styles/cyberpunk.json b/styles/cyberpunk.json
index 152cd0cd..2821eb7f 100644
--- a/styles/cyberpunk.json
+++ b/styles/cyberpunk.json
@@ -256,7 +256,16 @@
   "#emblems": {
     "opacity": 0.75,
     "stroke-width": 0.5,
-    "filter": ""
+    "filter": null
+  },
+  "#emblems > #stateEmblems": {
+    "data-size": 1
+  },
+  "#emblems > #provinceEmblems": {
+    "data-size": 1
+  },
+  "#emblems > #burgEmblems": {
+    "data-size": 1
   },
   "#texture": {
     "opacity": 0.2,
diff --git a/styles/darkSeas.json b/styles/darkSeas.json
index 102043b8..9bed1ef2 100644
--- a/styles/darkSeas.json
+++ b/styles/darkSeas.json
@@ -247,6 +247,15 @@
     "stroke-width": 1,
     "filter": null
   },
+  "#emblems > #stateEmblems": {
+    "data-size": 1
+  },
+  "#emblems > #provinceEmblems": {
+    "data-size": 1
+  },
+  "#emblems > #burgEmblems": {
+    "data-size": 1
+  },
   "#texture": {
     "opacity": 0.2,
     "filter": null,
diff --git a/styles/default.json b/styles/default.json
index 5cf061ba..623e37f3 100644
--- a/styles/default.json
+++ b/styles/default.json
@@ -258,6 +258,15 @@
     "stroke-width": 1,
     "filter": null
   },
+  "#emblems > #stateEmblems": {
+    "data-size": 1
+  },
+  "#emblems > #provinceEmblems": {
+    "data-size": 1
+  },
+  "#emblems > #burgEmblems": {
+    "data-size": 1
+  },
   "#texture": {
     "opacity": null,
     "filter": null,
diff --git a/styles/gloom.json b/styles/gloom.json
index 766db87b..858c807c 100644
--- a/styles/gloom.json
+++ b/styles/gloom.json
@@ -260,6 +260,15 @@
     "stroke-width": 0.5,
     "filter": null
   },
+  "#emblems > #stateEmblems": {
+    "data-size": 1
+  },
+  "#emblems > #provinceEmblems": {
+    "data-size": 1
+  },
+  "#emblems > #burgEmblems": {
+    "data-size": 1
+  },
   "#texture": {
     "opacity": 0.8,
     "filter": null,
diff --git a/styles/light.json b/styles/light.json
index 30748daf..cf846e1b 100644
--- a/styles/light.json
+++ b/styles/light.json
@@ -258,6 +258,15 @@
     "stroke-width": 1,
     "filter": null
   },
+  "#emblems > #stateEmblems": {
+    "data-size": 1
+  },
+  "#emblems > #provinceEmblems": {
+    "data-size": 1
+  },
+  "#emblems > #burgEmblems": {
+    "data-size": 1
+  },
   "#texture": {
     "opacity": 0.4,
     "filter": null,
diff --git a/styles/monochrome.json b/styles/monochrome.json
index 6af0d6a1..20d3e588 100644
--- a/styles/monochrome.json
+++ b/styles/monochrome.json
@@ -261,6 +261,15 @@
     "stroke-width": 0.5,
     "filter": null
   },
+  "#emblems > #stateEmblems": {
+    "data-size": 1
+  },
+  "#emblems > #provinceEmblems": {
+    "data-size": 1
+  },
+  "#emblems > #burgEmblems": {
+    "data-size": 1
+  },
   "#zones": {
     "opacity": 0.6,
     "stroke": "#333333",
diff --git a/styles/night.json b/styles/night.json
index 790cad8d..90b40e75 100644
--- a/styles/night.json
+++ b/styles/night.json
@@ -258,6 +258,15 @@
     "stroke-width": null,
     "filter": null
   },
+  "#emblems > #stateEmblems": {
+    "data-size": 1
+  },
+  "#emblems > #provinceEmblems": {
+    "data-size": 1
+  },
+  "#emblems > #burgEmblems": {
+    "data-size": 1
+  },
   "#texture": {
     "opacity": 0.1,
     "filter": null,
diff --git a/styles/pale.json b/styles/pale.json
index 3a32ed6d..312009b9 100644
--- a/styles/pale.json
+++ b/styles/pale.json
@@ -258,6 +258,15 @@
     "stroke-width": 1,
     "filter": null
   },
+  "#emblems > #stateEmblems": {
+    "data-size": 1
+  },
+  "#emblems > #provinceEmblems": {
+    "data-size": 1
+  },
+  "#emblems > #burgEmblems": {
+    "data-size": 1
+  },
   "#texture": {
     "opacity": 0.4,
     "filter": null,
diff --git a/styles/watercolor.json b/styles/watercolor.json
index 4386940f..79cc9484 100644
--- a/styles/watercolor.json
+++ b/styles/watercolor.json
@@ -258,6 +258,15 @@
     "stroke-width": 1,
     "filter": null
   },
+  "#emblems > #stateEmblems": {
+    "data-size": 1
+  },
+  "#emblems > #provinceEmblems": {
+    "data-size": 1
+  },
+  "#emblems > #burgEmblems": {
+    "data-size": 1
+  },
   "#texture": {
     "opacity": 0.2,
     "filter": null,
diff --git a/versioning.js b/versioning.js
index da0012fb..b0b15315 100644
--- a/versioning.js
+++ b/versioning.js
@@ -1,7 +1,7 @@
 "use strict";
 
 // version and caching control
-const version = "1.99.09"; // generator version, update each time
+const version = "1.99.10"; // generator version, update each time
 
 {
   document.title += " v" + version;