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

fix merge conflicts

Browse source
This commit is contained in:
Azgaar 2021-08-05 00:13:49 +03:00 • committed by Peter
parent 54db8cbb67
commit bef3affa61
2 changed files with 78 additions and 78 deletions
Download patch file Download diff file Expand all files Collapse all files

22
main.js
View file

@ -517,13 +517,13 @@ function handleZoom(isScaleChanged, isPositionChanged) {
// zoom image converter overlay // zoom image converter overlay
if (customization === 1) { if (customization === 1) {
const canvas = document.getElementById("canvas"); const canvas = document.getElementById('canvas');
if (!canvas || canvas.style.opacity === "0") return; if (!canvas || canvas.style.opacity === '0') return;
const img = document.getElementById("imageToConvert"); const img = document.getElementById('imageToConvert');
if (!img) return; if (!img) return;
const ctx = canvas.getContext("2d"); const ctx = canvas.getContext('2d');
ctx.clearRect(0, 0, canvas.width, canvas.height); ctx.clearRect(0, 0, canvas.width, canvas.height);
ctx.setTransform(scale, 0, 0, scale, viewX, viewY); ctx.setTransform(scale, 0, 0, scale, viewX, viewY);
ctx.drawImage(img, 0, 0, canvas.width, canvas.height); ctx.drawImage(img, 0, 0, canvas.width, canvas.height);
@ -565,11 +565,11 @@ function invokeActiveZooming() {
if (this.id === "burgLabels") return; if (this.id === "burgLabels") return;
const desired = +this.dataset.size; const desired = +this.dataset.size;
const relative = Math.max(rn((desired + desired / scale) / 2, 2), 1); const relative = Math.max(rn((desired + desired / scale) / 2, 2), 1);
if (rescaleLabels.checked) this.setAttribute("font-size", relative); if (rescaleLabels.checked) this.setAttribute('font-size', relative);
const hidden = hideLabels.checked && (relative * scale < 6 || relative * scale > 60); const hidden = hideLabels.checked && (relative * scale < 6 || relative * scale > 60);
if (hidden) this.classList.add("hidden"); if (hidden) this.classList.add('hidden');
else this.classList.remove("hidden"); else this.classList.remove('hidden');
}); });
} }
@ -595,7 +595,7 @@ function invokeActiveZooming() {
if (!customization && !isOptimized) { if (!customization && !isOptimized) {
const desired = +statesHalo.attr("data-width"); const desired = +statesHalo.attr("data-width");
const haloSize = rn(desired / scale ** 0.8, 2); const haloSize = rn(desired / scale ** 0.8, 2);
statesHalo.attr("stroke-width", haloSize).style("display", haloSize > 0.1 ? "block" : "none"); statesHalo.attr('stroke-width', haloSize).style('display', haloSize > 0.1 ? 'block' : 'none');
} }
// rescale map markers // rescale map markers
@ -1432,9 +1432,9 @@ function reMarkFeatures() {
cells.haven = cells.i.length < 65535 ? new Uint16Array(cells.i.length) : new Uint32Array(cells.i.length); // cell haven (opposite water cell); cells.haven = cells.i.length < 65535 ? new Uint16Array(cells.i.length) : new Uint32Array(cells.i.length); // cell haven (opposite water cell);
cells.harbor = new Uint8Array(cells.i.length); // cell harbor (number of adjacent water cells); cells.harbor = new Uint8Array(cells.i.length); // cell harbor (number of adjacent water cells);
const defineHaven = i => { const defineHaven = (i) => {
const water = cells.c[i].filter(c => cells.h[c] < 20); const water = cells.c[i].filter((c) => cells.h[c] < 20);
const dist2 = water.map(c => (cells.p[i][0] - cells.p[c][0]) ** 2 + (cells.p[i][1] - cells.p[c][1]) ** 2); const dist2 = water.map((c) => (cells.p[i][0] - cells.p[c][0]) ** 2 + (cells.p[i][1] - cells.p[c][1]) ** 2);
const closest = water[dist2.indexOf(Math.min.apply(Math, dist2))]; const closest = water[dist2.indexOf(Math.min.apply(Math, dist2))];
cells.haven[i] = closest; cells.haven[i] = closest;

134
modules/ui/style.js
View file

@ -5,12 +5,12 @@
{ {
const filters = Array.from(document.getElementById("filters").querySelectorAll("filter")); const filters = Array.from(document.getElementById("filters").querySelectorAll("filter"));
const emptyOption = '<option value="" selected>None</option>'; const emptyOption = '<option value="" selected>None</option>';
const options = filters.map(filter => { const options = filters.map((filter) => {
const id = filter.getAttribute("id"); const id = filter.getAttribute('id');
const name = filter.getAttribute("name"); const name = filter.getAttribute('name');
return `<option value="url(#${id})">${name}</option>`; return `<option value="url(#${id})">${name}</option>`;
}); });
const allOptions = emptyOption + options.join(""); const allOptions = emptyOption + options.join('');
document.getElementById("styleFilterInput").innerHTML = allOptions; document.getElementById("styleFilterInput").innerHTML = allOptions;
document.getElementById("styleStatesBodyFilter").innerHTML = allOptions; document.getElementById("styleStatesBodyFilter").innerHTML = allOptions;
@ -43,29 +43,29 @@ function selectStyleElement() {
const sel = styleElementSelect.value; const sel = styleElementSelect.value;
let el = d3.select("#" + sel); let el = d3.select("#" + sel);
styleElements.querySelectorAll("tbody").forEach(e => (e.style.display = "none")); // hide all sections styleElements.querySelectorAll('tbody').forEach((e) => (e.style.display = 'none')); // hide all sections
// show alert line if layer is not visible // show alert line if layer is not visible
const isLayerOff = sel !== "ocean" && (el.style("display") === "none" || !el.selectAll("*").size()); const isLayerOff = sel !== 'ocean' && (el.style('display') === 'none' || !el.selectAll('*').size());
styleIsOff.style.display = isLayerOff ? "block" : "none"; styleIsOff.style.display = isLayerOff ? 'block' : 'none';
// active group element // active group element
const group = styleGroupSelect.value; const group = styleGroupSelect.value;
if (["routes", "labels", "coastline", "lakes", "anchors", "burgIcons", "borders"].includes(sel)) { if (['routes', 'labels', 'coastline', 'lakes', 'anchors', 'burgIcons', 'borders'].includes(sel)) {
const gEl = group && el.select("#" + group); const gEl = group && el.select('#' + group);
el = group && gEl.size() ? gEl : el.select("g"); el = group && gEl.size() ? gEl : el.select('g');
} }
// opacity // opacity
if (!["landmass", "ocean", "regions", "legend"].includes(sel)) { if (!['landmass', 'ocean', 'regions', 'legend'].includes(sel)) {
styleOpacity.style.display = "block"; styleOpacity.style.display = 'block';
styleOpacityInput.value = styleOpacityOutput.value = el.attr("opacity") || 1; styleOpacityInput.value = styleOpacityOutput.value = el.attr('opacity') || 1;
} }
// filter // filter
if (!["landmass", "legend", "regions"].includes(sel)) { if (!['landmass', 'legend', 'regions'].includes(sel)) {
styleFilter.style.display = "block"; styleFilter.style.display = 'block';
styleFilterInput.value = el.attr("filter") || ""; styleFilterInput.value = el.attr('filter') || '';
} }
// fill // fill
@ -100,15 +100,15 @@ function selectStyleElement() {
} }
// show specific sections // show specific sections
if (sel === "texture") styleTexture.style.display = "block"; if (sel === 'texture') styleTexture.style.display = 'block';
if (sel === "terrs") { if (sel === 'terrs') {
styleHeightmap.style.display = "block"; styleHeightmap.style.display = 'block';
styleHeightmapScheme.value = terrs.attr("scheme"); styleHeightmapScheme.value = terrs.attr('scheme');
styleHeightmapTerracingInput.value = styleHeightmapTerracingOutput.value = terrs.attr("terracing"); styleHeightmapTerracingInput.value = styleHeightmapTerracingOutput.value = terrs.attr('terracing');
styleHeightmapSkipInput.value = styleHeightmapSkipOutput.value = terrs.attr("skip"); styleHeightmapSkipInput.value = styleHeightmapSkipOutput.value = terrs.attr('skip');
styleHeightmapSimplificationInput.value = styleHeightmapSimplificationOutput.value = terrs.attr("relax"); styleHeightmapSimplificationInput.value = styleHeightmapSimplificationOutput.value = terrs.attr('relax');
styleHeightmapCurve.value = terrs.attr("curve"); styleHeightmapCurve.value = terrs.attr('curve');
} }
if (sel === 'markers') { if (sel === 'markers') {
@ -148,13 +148,13 @@ function selectStyleElement() {
styleStrokeWidthInput.value = styleStrokeWidthOutput.value = el.attr('stroke-width') || ''; styleStrokeWidthInput.value = styleStrokeWidthOutput.value = el.attr('stroke-width') || '';
} }
if (sel === "regions") { if (sel === 'regions') {
styleStates.style.display = "block"; styleStates.style.display = 'block';
styleStatesBodyOpacity.value = styleStatesBodyOpacityOutput.value = statesBody.attr("opacity") || 1; styleStatesBodyOpacity.value = styleStatesBodyOpacityOutput.value = statesBody.attr('opacity') || 1;
styleStatesBodyFilter.value = statesBody.attr("filter") || ""; styleStatesBodyFilter.value = statesBody.attr('filter') || '';
styleStatesHaloWidth.value = styleStatesHaloWidthOutput.value = statesHalo.attr("data-width") || 10; styleStatesHaloWidth.value = styleStatesHaloWidthOutput.value = statesHalo.attr('data-width') || 10;
styleStatesHaloOpacity.value = styleStatesHaloOpacityOutput.value = statesHalo.attr("opacity") || 1; styleStatesHaloOpacity.value = styleStatesHaloOpacityOutput.value = statesHalo.attr('opacity') || 1;
const blur = parseFloat(statesHalo.attr("filter")?.match(/blur\(([^)]+)\)/)?.[1]) || 0; const blur = parseFloat(statesHalo.attr('filter')?.match(/blur\(([^)]+)\)/)?.[1]) || 0;
styleStatesHaloBlur.value = styleStatesHaloBlurOutput.value = blur; styleStatesHaloBlur.value = styleStatesHaloBlurOutput.value = blur;
} }
@ -272,18 +272,18 @@ function selectStyleElement() {
// update group options // update group options
styleGroupSelect.options.length = 0; // remove all options styleGroupSelect.options.length = 0; // remove all options
if (["routes", "labels", "coastline", "lakes", "anchors", "burgIcons", "borders"].includes(sel)) { if (['routes', 'labels', 'coastline', 'lakes', 'anchors', 'burgIcons', 'borders'].includes(sel)) {
const groups = document.getElementById(sel).querySelectorAll("g"); const groups = document.getElementById(sel).querySelectorAll('g');
groups.forEach(el => { groups.forEach((el) => {
if (el.id === "burgLabels") return; if (el.id === 'burgLabels') return;
const option = new Option(`${el.id} (${el.childElementCount})`, el.id, false, false); const option = new Option(`${el.id} (${el.childElementCount})`, el.id, false, false);
styleGroupSelect.options.add(option); styleGroupSelect.options.add(option);
}); });
styleGroupSelect.value = el.attr("id"); styleGroupSelect.value = el.attr('id');
styleGroup.style.display = "block"; styleGroup.style.display = 'block';
} else { } else {
styleGroupSelect.options.add(new Option(sel, sel, false, true)); styleGroupSelect.options.add(new Option(sel, sel, false, true));
styleGroup.style.display = "none"; styleGroup.style.display = 'none';
} }
if (sel === "coastline" && styleGroupSelect.value === "sea_island") { if (sel === "coastline" && styleGroupSelect.value === "sea_island") {
@ -335,9 +335,9 @@ styleOpacityInput.addEventListener("input", function () {
getEl().attr("opacity", this.value); getEl().attr("opacity", this.value);
}); });
styleFilterInput.addEventListener("change", function () { styleFilterInput.addEventListener('change', function () {
if (styleGroupSelect.value === "ocean") return oceanLayers.attr("filter", this.value); if (styleGroupSelect.value === 'ocean') return oceanLayers.attr('filter', this.value);
getEl().attr("filter", this.value); getEl().attr('filter', this.value);
}); });
styleTextureInput.addEventListener("change", function () { styleTextureInput.addEventListener("change", function () {
@ -462,15 +462,15 @@ styleReliefSet.addEventListener("change", function () {
if (!layerIsOn('toggleRelief')) toggleRelief(); if (!layerIsOn('toggleRelief')) toggleRelief();
}); });
styleReliefSizeInput.addEventListener("change", function () { styleReliefSizeInput.addEventListener('change', function () {
terrain.attr("size", this.value); terrain.attr('size', this.value);
styleReliefSizeOutput.value = this.value; styleReliefSizeOutput.value = this.value;
ReliefIcons(); ReliefIcons();
if (!layerIsOn("toggleRelief")) toggleRelief(); if (!layerIsOn('toggleRelief')) toggleRelief();
}); });
styleReliefDensityInput.addEventListener("change", function () { styleReliefDensityInput.addEventListener('change', function () {
terrain.attr("density", this.value); terrain.attr('density', this.value);
styleReliefDensityOutput.value = this.value; styleReliefDensityOutput.value = this.value;
ReliefIcons(); ReliefIcons();
if (!layerIsOn('toggleRelief')) toggleRelief(); if (!layerIsOn('toggleRelief')) toggleRelief();
@ -597,10 +597,10 @@ styleFontMinus.addEventListener("click", function () {
function changeFontSize(el, size) { function changeFontSize(el, size) {
styleFontSize.value = size; styleFontSize.value = size;
const getSizeOnScale = element => { const getSizeOnScale = (element) => {
// some labels are rescaled on zoom // some labels are rescaled on zoom
if (element === "labels") return Math.max(rn((size + size / scale) / 2, 2), 1); if (element === 'labels') return Math.max(rn((size + size / scale) / 2, 2), 1);
if (element === "coordinates") return rn(size / scale ** 0.8, 2); if (element === 'coordinates') return rn(size / scale ** 0.8, 2);
// other has the same size // other has the same size
return size; return size;
@ -609,7 +609,7 @@ function changeFontSize(el, size) {
const scaleSize = getSizeOnScale(styleElementSelect.value); const scaleSize = getSizeOnScale(styleElementSelect.value);
el.attr("data-size", size).attr("font-size", scaleSize); el.attr("data-size", size).attr("font-size", scaleSize);
if (styleElementSelect.value === "legend") redrawLegend(); if (styleElementSelect.value === 'legend') redrawLegend();
} }
styleRadiusInput.addEventListener("change", function () { styleRadiusInput.addEventListener("change", function () {
@ -677,16 +677,16 @@ function changeIconSize(size, group) {
styleIconSizeInput.value = size; styleIconSizeInput.value = size;
} }
styleStatesBodyOpacity.addEventListener("input", function () { styleStatesBodyOpacity.addEventListener('input', function () {
styleStatesBodyOpacityOutput.value = this.value; styleStatesBodyOpacityOutput.value = this.value;
statesBody.attr("opacity", this.value); statesBody.attr('opacity', this.value);
}); });
styleStatesBodyFilter.addEventListener("change", function () { styleStatesBodyFilter.addEventListener('change', function () {
statesBody.attr("filter", this.value); statesBody.attr('filter', this.value);
}); });
styleStatesHaloWidth.addEventListener("input", function () { styleStatesHaloWidth.addEventListener('input', function () {
styleStatesHaloWidthOutput.value = this.value; styleStatesHaloWidthOutput.value = this.value;
statesHalo.attr('data-width', this.value).attr('stroke-width', this.value); statesHalo.attr('data-width', this.value).attr('stroke-width', this.value);
}); });
@ -696,14 +696,14 @@ styleStatesHaloOpacity.addEventListener("input", function () {
statesHalo.attr('opacity', this.value); statesHalo.attr('opacity', this.value);
}); });
styleStatesHaloBlur.addEventListener("input", function () { styleStatesHaloBlur.addEventListener('input', function () {
styleStatesHaloBlurOutput.value = this.value; styleStatesHaloBlurOutput.value = this.value;
const blur = +this.value > 0 ? `blur(${this.value}px)` : null; const blur = +this.value > 0 ? `blur(${this.value}px)` : null;
statesHalo.attr("filter", blur); statesHalo.attr('filter', blur);
}); });
styleArmiesFillOpacity.addEventListener("input", function () { styleArmiesFillOpacity.addEventListener('input', function () {
armies.attr("fill-opacity", this.value); armies.attr('fill-opacity', this.value);
styleArmiesFillOpacityOutput.value = this.value; styleArmiesFillOpacityOutput.value = this.value;
}); });
@ -717,9 +717,9 @@ styleArmiesSize.addEventListener("input", function () {
}); });
}); });
emblemsStateSizeInput.addEventListener("change", drawEmblems); emblemsStateSizeInput.addEventListener('change', drawEmblems);
emblemsProvinceSizeInput.addEventListener("change", drawEmblems); emblemsProvinceSizeInput.addEventListener('change', drawEmblems);
emblemsBurgSizeInput.addEventListener("change", drawEmblems); emblemsBurgSizeInput.addEventListener('change', drawEmblems);
styleResourcesCircle.addEventListener('change', function () { styleResourcesCircle.addEventListener('change', function () {
goods.attr('data-circle', +this.checked); goods.attr('data-circle', +this.checked);
@ -823,10 +823,10 @@ mapFilters.addEventListener('click', applyMapFilter);
function applyMapFilter(event) { function applyMapFilter(event) {
if (event.target.tagName !== 'BUTTON') return; if (event.target.tagName !== 'BUTTON') return;
const button = event.target; const button = event.target;
svg.attr("data-filter", null).attr("filter", null); svg.attr('data-filter', null).attr('filter', null);
if (button.classList.contains("pressed")) return button.classList.remove("pressed"); if (button.classList.contains('pressed')) return button.classList.remove('pressed');
mapFilters.querySelectorAll(".pressed").forEach(button => button.classList.remove("pressed")); mapFilters.querySelectorAll('.pressed').forEach((button) => button.classList.remove('pressed'));
button.classList.add("pressed"); button.classList.add('pressed');
svg.attr("data-filter", button.id).attr("filter", "url(#filter-" + button.id + ")"); svg.attr('data-filter', button.id).attr('filter', 'url(#filter-' + button.id + ')');
} }