feat: style - store emblem size mod in style (v1.99.10)

This commit is contained in:
Azgaar 2024-08-26 02:12:30 +02:00
parent 634ad6cd8e
commit f129ff5573
18 changed files with 140 additions and 44 deletions

View file

@ -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>

View file

@ -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
};

View file

@ -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() {

View file

@ -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"],

View file

@ -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();
}

View file

@ -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": "",

View file

@ -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,

View file

@ -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,

View file

@ -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,

View file

@ -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,

View file

@ -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,

View file

@ -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,

View file

@ -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,

View file

@ -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",

View file

@ -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,

View file

@ -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,

View file

@ -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,

View file

@ -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;