backups/Fantasy-Map-Generator
1
0
Fork 0
mirror of https://github.com/Azgaar/Fantasy-Map-Generator.git synced 2025-12-17 09:41:24 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions

v1.5.18 - emblems style settings

Browse source
This commit is contained in:
Azgaar 2021-02-11 15:27:51 +03:00
parent 7b272839a1
commit 222baaf9bc
8 changed files with 102 additions and 29 deletions
Download patch file Download diff file Expand all files Collapse all files

7
modules/ui/emblems-editor.js
View file

@ -299,6 +299,8 @@ function editEmblem(type, id, el) {
d3.timeout(runDownload, timeout);
function runDownload() {
const back = `<a href="javascript:history.back()">Go Back</a>`;
const stateSection = `<div><h2>States</h2>` + validStates.map(state => {
const el = document.getElementById("stateCOA"+state.i);
const svg = getSVG(el, state.coa, 200);
@ -312,7 +314,7 @@ function editEmblem(type, id, el) {
const svg = getSVG(el, province.coa, 200);
return `<figure id="province_${province.i}"><a href="#burgs_${province.i}"><figcaption>${province.fullName}</figcaption>${svg}</a></figure>`;
}).join("");
return stateProvinces.length ? `<div id="provinces_${state.i}"><h2>${state.fullName} provinces</h2>${figures}</div>` : "";
return stateProvinces.length ? `<div id="provinces_${state.i}">${back}<h2>${state.fullName} provinces</h2>${figures}</div>` : "";
}).join("");
const burgSections = validStates.map(state => {
@ -324,7 +326,7 @@ function editEmblem(type, id, el) {
const svg = getSVG(el, burg.coa, 200);
return `<figure id="burg_${burg.i}"><figcaption>${burg.name}</figcaption>${svg}</figure>`;
}).join("");
return provinceBurgs.length ? `<div id="burgs_${province.i}"><h2>${province.fullName} burgs</h2>${provinceBurgFigures}</div>` : "";
return provinceBurgs.length ? `<div id="burgs_${province.i}">${back}<h2>${province.fullName} burgs</h2>${provinceBurgFigures}</div>` : "";
}).join("");
const stateBurgOutOfProvinces = stateBurgs.filter(b => !pack.cells.province[b.cell]);
@ -356,6 +358,7 @@ function editEmblem(type, id, el) {
figcaption { text-align: center; margin: .4em 0; width: 200px; font-family: 'Overlock SC' }
figure > a { color: black; text-decoration: none; }
address { width: 100%; max-width: 1018px; margin: 0 auto; }
div > a { float: right; font-family: monospace; margin-top: .8em; }
</style>
<link href="https://fonts.googleapis.com/css2?family=Forum&family=Overlock+SC" rel="stylesheet">
<body>

2
modules/ui/general.js
View file

@ -432,6 +432,7 @@ function showInfo() {
// prevent default browser behavior for FMG-used hotkeys
document.addEventListener("keydown", event => {
if (event.altKey && event.keyCode !== 18) event.preventDefault(); // disallow alt key combinations
if (event.ctrlKey && event.code === "KeyS") event.preventDefault(); // disallow CTRL + C
if ([112, 113, 117, 120, 9].includes(event.keyCode)) event.preventDefault(); // F1, F2, F6, F9, Tab
});
@ -460,6 +461,7 @@ document.addEventListener("keyup", event => {
else if (key === 79 && canvas3d) toggle3dOptions(); // "O" to toggle 3d options
else if (ctrl && key === 81) toggleSaveReminder(); // Ctrl + "Q" to toggle save reminder
else if (ctrl && key === 83) saveMap(); // Ctrl + "S" to save .map file
else if (undo.offsetParent && ctrl && key === 90) undo.click(); // Ctrl + "Z" to undo
else if (redo.offsetParent && ctrl && key === 89) redo.click(); // Ctrl + "Y" to redo

20
modules/ui/layers.js
View file

@ -1249,28 +1249,26 @@ function drawEmblems() {
const validStates = states.filter(s => s.i && !s.removed && s.coa);
const validProvinces = provinces.filter(p => p.i && !p.removed && p.coa);
const validBurgs = burgs.filter(b => b.i && !b.removed && b.coa);
const sizeMod = +emblems.attr("size-modifier") || 1;
const getStateEmblemsSize = () => {
const startSize = (graphHeight + graphWidth) / 40;
const startSize = Math.min(Math.max((graphHeight + graphWidth) / 40, 10), 100);
const statesMod = (1 + validStates.length / 100) - (15 - validStates.length) / 200; // states number modifier
const size = rn(startSize / statesMod * sizeMod); // target size ~50px on 1536x754 map with 15 states
return Math.min(Math.max(size, 10), 100);
const sizeMod = +document.getElementById("styleEmblemsStateSizeInput").value || 1;
return rn(startSize / statesMod * sizeMod); // target size ~50px on 1536x754 map with 15 states
};
const getProvinceEmblemsSize = () => {
const startSize = (graphHeight + graphWidth) / 80;
const startSize = Math.min(Math.max((graphHeight + graphWidth) / 80, 5), 75);
const provincesMod = (1 + validProvinces.length / 1000) - (115 - validProvinces.length) / 1000; // states number modifier
const size = rn(startSize / provincesMod * sizeMod); // target size ~26px on 1536x754 map with 115 provinces
return Math.min(Math.max(size, 5), 75);
const sizeMod = +document.getElementById("styleEmblemsProvinceSizeInput").value || 1;
return rn(startSize / provincesMod * sizeMod); // target size ~26px on 1536x754 map with 115 provinces
}
const getBurgEmblemSize = () => {
const startSize = (graphHeight + graphWidth) / 150;
const startSize = Math.min(Math.max((graphHeight + graphWidth) / 150, 5), 50);
const burgsMod = (1 + validBurgs.length / 1000) - (450 - validBurgs.length) / 1000; // states number modifier
const size = rn(startSize / burgsMod * sizeMod); // target size ~10px on 1536x754 map with 450 burgs
return Math.min(Math.max(size, 5), 50);
const sizeMod = +document.getElementById("styleEmblemsBurgSizeInput").value || 1;
return rn(startSize / burgsMod * sizeMod); // target size ~10px on 1536x754 map with 450 burgs
}
const sizeBurgs = getBurgEmblemSize();

26
modules/ui/style.js
View file

@ -1,6 +1,11 @@
// UI module to control the style
"use strict";
// store some style inputs as options
styleElements.addEventListener("change", function(ev) {
if (ev.target.dataset.stored) lock(ev.target.dataset.stored);
});
// select element to be edited
function editStyle(element, group) {
showOptions();
@ -226,6 +231,10 @@ function selectStyleElement() {
styleArmiesSize.value = styleArmiesSizeOutput.value = el.attr("box-size");
}
if (sel === "emblems") {
styleEmblems.style.display = "block";
}
// update group options
styleGroupSelect.options.length = 0; // remove all options
if (sel === "routes" || sel === "labels" || sel === "coastline" || sel === "lakes" || sel === "anchors" || sel === "burgIcons" || sel === "borders") {
@ -614,6 +623,21 @@ styleArmiesSize.addEventListener("input", function() {
});
});
styleEmblemsStateSizeInput.addEventListener("input", function() {
styleEmblemsStateSizeOutput.value = this.value;
drawEmblems();
});
styleEmblemsProvinceSizeInput.addEventListener("input", function() {
styleEmblemsProvinceSizeOutput.value = this.value;
drawEmblems();
});
styleEmblemsBurgSizeInput.addEventListener("input", function() {
styleEmblemsBurgSizeOutput.value = this.value;
drawEmblems();
});
// request a URL to image to be used as a texture
function textureProvideURL() {
alertMessage.innerHTML = `Provide an image URL to be used as a texture:
@ -790,7 +814,7 @@ function applyDefaultStyle() {
labels.select("#addedLabels").attr("fill", "#3e3e4b").attr("opacity", 1).attr("stroke", "#3a3a3a").attr("stroke-width", 0).attr("font-family", "Almendra SC").attr("data-font", "Almendra+SC").attr("font-size", 18).attr("data-size", 18).attr("filter", null);
fogging.attr("opacity", .98).attr("fill", "#30426f");
emblems.attr("opacity", .9).attr("size-modifier", 1).attr("filter", null)
emblems.attr("opacity", .9).attr("size-modifier", 1).attr("filter", null);
}
// apply style settings in JSON