mirror of
https://github.com/Azgaar/Fantasy-Map-Generator.git
synced 2025-12-23 12:31:24 +01:00
namespace for submap ui.
This commit is contained in:
Mészáros Gergely
parent
e85f5e39d6
commit
00a5938d6d
1 changed files with 147 additions and 156 deletions
|
|
@ -20,24 +20,24 @@ window.UISubmap = (function () {
|
||||||
$(this).dialog("close");
|
$(this).dialog("close");
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
});
|
||||||
});
|
}
|
||||||
}
|
|
||||||
|
|
||||||
function openRemapOptions() {
|
function openRemapOptions() {
|
||||||
resetZoom(0);
|
resetZoom(0);
|
||||||
$("#remapOptionsDialog").dialog({
|
$("#remapOptionsDialog").dialog({
|
||||||
title: "Resampler options",
|
title: "Resampler options",
|
||||||
resizable: false,
|
resizable: false,
|
||||||
width: fitContent(),
|
width: fitContent(),
|
||||||
position: {my: "right top", at: "right-10 top+10", of: "svg", collision: "fit"},
|
position: {my: "right top", at: "right-10 top+10", of: "svg", collision: "fit"},
|
||||||
buttons: {
|
buttons: {
|
||||||
Resample: function () {
|
Resample: function () {
|
||||||
$(this).dialog("close");
|
$(this).dialog("close");
|
||||||
resampleCurrentMap();
|
resampleCurrentMap();
|
||||||
},
|
},
|
||||||
Cancel: function () {
|
Cancel: function () {
|
||||||
$(this).dialog("close");
|
$(this).dialog("close");
|
||||||
|
}
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
@ -51,151 +51,142 @@ function openRemapOptions() {
|
||||||
console.error("Unknown cell number!");
|
console.error("Unknown cell number!");
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
});
|
changeCellsDensity(cellNumId);
|
||||||
}
|
WARN && console.warn("Resampling current map");
|
||||||
|
startResample({
|
||||||
|
lockMarkers: false,
|
||||||
|
lockBurgs: false,
|
||||||
|
depressRivers: false,
|
||||||
|
addLakesInDepressions: false,
|
||||||
|
promoteTowns: false,
|
||||||
|
smoothHeightMap: false,
|
||||||
|
rescaleStyles: false,
|
||||||
|
projection: (x, y) => [x, y],
|
||||||
|
inverse: (x, y) => [x, y]
|
||||||
|
});
|
||||||
|
}, 1000);
|
||||||
|
|
||||||
/* callbacks */
|
const generateSubmap = debounce(function () {
|
||||||
|
// Create submap from the current map
|
||||||
|
// submap limits defined by the current window size (canvas viewport)
|
||||||
|
|
||||||
const resampleCurrentMap = debounce(function () {
|
WARN && console.warn("Resampling current map");
|
||||||
// Resample the whole map to different cell resolution or shape
|
closeDialogs("#worldConfigurator, #options3d");
|
||||||
const cellNumId = Number(document.getElementById("submapPointsInput").value);
|
const checked = id => Boolean(document.getElementById(id).checked);
|
||||||
if (!cellsDensityConstants[cellNumId]) {
|
// Create projection func from current zoom extents
|
||||||
console.error("Unknown cell number!");
|
const [[x0, y0], [x1, y1]] = getViewBoxExtent();
|
||||||
return;
|
const origScale = scale;
|
||||||
}
|
|
||||||
changeCellsDensity(cellNumId);
|
|
||||||
WARN && console.warn("Resampling current map");
|
|
||||||
startResample({
|
|
||||||
lockMarkers: false,
|
|
||||||
lockBurgs: false,
|
|
||||||
depressRivers: false,
|
|
||||||
addLakesInDepressions: false,
|
|
||||||
promoteTowns: false,
|
|
||||||
smoothHeightMap: false,
|
|
||||||
rescaleStyles: false,
|
|
||||||
projection: (x, y) => [x, y],
|
|
||||||
inverse: (x, y) => [x, y]
|
|
||||||
});
|
|
||||||
}, 1000);
|
|
||||||
|
|
||||||
const generateSubmap = debounce(function () {
|
const options = {
|
||||||
// Create submap from the current map
|
lockMarkers: checked("submapLockMarkers"),
|
||||||
// submap limits defined by the current window size (canvas viewport)
|
lockBurgs: checked("submapLockBurgs"),
|
||||||
|
|
||||||
WARN && console.warn("Resampling current map");
|
depressRivers: checked("submapDepressRivers"),
|
||||||
closeDialogs("#worldConfigurator, #options3d");
|
addLakesInDepressions: checked("submapAddLakeInDepression"),
|
||||||
const checked = id => Boolean(document.getElementById(id).checked);
|
promoteTowns: checked("submapPromoteTowns"),
|
||||||
// Create projection func from current zoom extents
|
rescaleStyles: checked("submapRescaleStyles"),
|
||||||
const [[x0, y0], [x1, y1]] = getViewBoxExtent();
|
smoothHeightMap: scale > 2,
|
||||||
const origScale = scale;
|
inverse: (x, y) => [x / origScale + x0, y / origScale + y0],
|
||||||
|
projection: (x, y) => [(x - x0) * origScale, (y - y0) * origScale],
|
||||||
|
};
|
||||||
|
|
||||||
const options = {
|
// converting map position on the planet
|
||||||
lockMarkers: checked("submapLockMarkers"),
|
const mapSizeOutput = document.getElementById("mapSizeOutput");
|
||||||
lockBurgs: checked("submapLockBurgs"),
|
const latitudeOutput = document.getElementById("latitudeOutput");
|
||||||
|
const latN = 90 - ((180 - (mapSizeInput.value / 100) * 180) * latitudeOutput.value) / 100;
|
||||||
|
const newLatN = latN - ((y0 / graphHeight) * mapSizeOutput.value * 180) / 100;
|
||||||
|
mapSizeOutput.value /= scale;
|
||||||
|
latitudeOutput.value = ((90 - newLatN) / (180 - (mapSizeOutput.value / 100) * 180)) * 100;
|
||||||
|
document.getElementById("mapSizeInput").value = mapSizeOutput.value;
|
||||||
|
document.getElementById("latitudeInput").value = latitudeOutput.value;
|
||||||
|
|
||||||
depressRivers: checked("submapDepressRivers"),
|
// fix scale
|
||||||
addLakesInDepressions: checked("submapAddLakeInDepression"),
|
distanceScaleInput.value = distanceScaleOutput.value = rn((distanceScale = distanceScaleOutput.value / scale), 2);
|
||||||
promoteTowns: checked("submapPromoteTowns"),
|
populationRateInput.value = populationRateOutput.value = rn((populationRate = populationRateOutput.value / scale), 2);
|
||||||
rescaleStyles: checked("submapRescaleStyles"),
|
customization = 0;
|
||||||
smoothHeightMap: scale > 2,
|
startResample(options);
|
||||||
inverse: (x, y) => [x / origScale + x0, y / origScale + y0],
|
}, 1000);
|
||||||
projection: (x, y) => [(x - x0) * origScale, (y - y0) * origScale],
|
|
||||||
};
|
|
||||||
|
|
||||||
// converting map position on the planet
|
async function startResample(options) {
|
||||||
const mapSizeOutput = document.getElementById("mapSizeOutput");
|
// Do model changes with Submap.resample then do view changes if needed.
|
||||||
const latitudeOutput = document.getElementById("latitudeOutput");
|
undraw();
|
||||||
const latN = 90 - ((180 - (mapSizeInput.value / 100) * 180) * latitudeOutput.value) / 100;
|
resetZoom(0);
|
||||||
const newLatN = latN - ((y0 / graphHeight) * mapSizeOutput.value * 180) / 100;
|
let oldstate = {
|
||||||
mapSizeOutput.value /= scale;
|
grid: deepCopy(grid),
|
||||||
latitudeOutput.value = ((90 - newLatN) / (180 - (mapSizeOutput.value / 100) * 180)) * 100;
|
pack: deepCopy(pack),
|
||||||
document.getElementById("mapSizeInput").value = mapSizeOutput.value;
|
seed,
|
||||||
document.getElementById("latitudeInput").value = latitudeOutput.value;
|
graphWidth,
|
||||||
|
graphHeight
|
||||||
|
};
|
||||||
|
|
||||||
// fix scale
|
try {
|
||||||
distanceScaleInput.value = distanceScaleOutput.value = rn((distanceScale = distanceScaleOutput.value / scale), 2);
|
const oldScale = scale;
|
||||||
populationRateInput.value = populationRateOutput.value = rn((populationRate = populationRateOutput.value / scale), 2);
|
await Submap.resample(oldstate, options);
|
||||||
customization = 0;
|
if (options.promoteTowns) {
|
||||||
startResample(options);
|
const groupName = "largetowns";
|
||||||
}, 1000);
|
moveAllBurgsToGroup("towns", groupName);
|
||||||
|
changeRadius(rn(oldScale * 0.8, 2), groupName);
|
||||||
async function startResample(options) {
|
changeFontSize(svg.select(`#labels #${groupName}`), rn(oldScale * 2, 2));
|
||||||
// Do model changes with Submap.resample then do view changes if needed.
|
invokeActiveZooming();
|
||||||
undraw();
|
|
||||||
resetZoom(0);
|
|
||||||
let oldstate = {
|
|
||||||
grid: deepCopy(grid),
|
|
||||||
pack: deepCopy(pack),
|
|
||||||
seed,
|
|
||||||
graphWidth,
|
|
||||||
graphHeight
|
|
||||||
};
|
|
||||||
|
|
||||||
try {
|
|
||||||
const oldScale = scale;
|
|
||||||
await Submap.resample(oldstate, options);
|
|
||||||
if (options.promoteTowns) {
|
|
||||||
const groupName = "largetowns";
|
|
||||||
moveAllBurgsToGroup("towns", groupName);
|
|
||||||
changeRadius(rn(oldScale * 0.8, 2), groupName);
|
|
||||||
changeFontSize(svg.select(`#labels #${groupName}`), rn(oldScale * 2, 2));
|
|
||||||
invokeActiveZooming();
|
|
||||||
}
|
|
||||||
if (options.rescaleStyles) changeStyles(oldScale);
|
|
||||||
} catch (error) {
|
|
||||||
showSubmapErrorHandler(error);
|
|
||||||
}
|
|
||||||
|
|
||||||
oldstate = null; // destroy old state to free memory
|
|
||||||
|
|
||||||
restoreLayers();
|
|
||||||
turnButtonOn("toggleMarkers");
|
|
||||||
if (ThreeD.options.isOn) ThreeD.redraw();
|
|
||||||
if ($("#worldConfigurator").is(":visible")) editWorld();
|
|
||||||
}
|
|
||||||
|
|
||||||
function changeStyles(scale) {
|
|
||||||
// resize burgIcons
|
|
||||||
const burgIcons = [...document.getElementById("burgIcons").querySelectorAll("g")];
|
|
||||||
for (const bi of burgIcons) {
|
|
||||||
const newRadius = rn(minmax(scale, 0.2, 10) * 0.8, 2);
|
|
||||||
styleRadiusInput.value = newRadius;
|
|
||||||
changeRadius(newRadius, bi.id);
|
|
||||||
const swAttr = bi.attributes['stroke-width'];
|
|
||||||
swAttr.value = +swAttr.value * scale;
|
|
||||||
}
|
|
||||||
|
|
||||||
// burglabels
|
|
||||||
const burgLabels= [...document.getElementById("burgLabels").querySelectorAll("g")];
|
|
||||||
for (const bl of burgLabels) {
|
|
||||||
const size = +bl.dataset['size'];
|
|
||||||
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();
|
|
||||||
}
|
|
||||||
|
|
||||||
function showSubmapErrorHandler(error) {
|
|
||||||
ERROR && console.error(error);
|
|
||||||
clearMainTip();
|
|
||||||
|
|
||||||
alertMessage.innerHTML = `Map resampling failed :_(.
|
|
||||||
<br>You may retry after clearing stored data or contact us at discord.
|
|
||||||
<p id="errorBox">${parseError(error)}</p>`;
|
|
||||||
$("#alert").dialog({
|
|
||||||
resizable: false,
|
|
||||||
title: "Generation error",
|
|
||||||
width: "32em",
|
|
||||||
buttons: {
|
|
||||||
Ok: function () {
|
|
||||||
$(this).dialog("close");
|
|
||||||
}
|
}
|
||||||
},
|
if (options.rescaleStyles) changeStyles(oldScale);
|
||||||
position: {my: "center", at: "center", of: "svg"}
|
} catch (error) {
|
||||||
});
|
showSubmapErrorHandler(error);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
oldstate = null; // destroy old state to free memory
|
||||||
|
|
||||||
|
restoreLayers();
|
||||||
|
turnButtonOn("toggleMarkers");
|
||||||
|
if (ThreeD.options.isOn) ThreeD.redraw();
|
||||||
|
if ($("#worldConfigurator").is(":visible")) editWorld();
|
||||||
|
}
|
||||||
|
|
||||||
|
function changeStyles(scale) {
|
||||||
|
// resize burgIcons
|
||||||
|
const burgIcons = [...document.getElementById("burgIcons").querySelectorAll("g")];
|
||||||
|
for (const bi of burgIcons) {
|
||||||
|
const newRadius = rn(minmax(scale, 0.2, 10) * 0.8, 2);
|
||||||
|
styleRadiusInput.value = newRadius;
|
||||||
|
changeRadius(newRadius, bi.id);
|
||||||
|
const swAttr = bi.attributes['stroke-width'];
|
||||||
|
swAttr.value = +swAttr.value * scale;
|
||||||
|
}
|
||||||
|
|
||||||
|
// burglabels
|
||||||
|
const burgLabels= [...document.getElementById("burgLabels").querySelectorAll("g")];
|
||||||
|
for (const bl of burgLabels) {
|
||||||
|
const size = +bl.dataset['size'];
|
||||||
|
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();
|
||||||
|
}
|
||||||
|
|
||||||
|
function showSubmapErrorHandler(error) {
|
||||||
|
ERROR && console.error(error);
|
||||||
|
clearMainTip();
|
||||||
|
|
||||||
|
alertMessage.innerHTML = `Map resampling failed :_(.
|
||||||
|
<br>You may retry after clearing stored data or contact us at discord.
|
||||||
|
<p id="errorBox">${parseError(error)}</p>`;
|
||||||
|
$("#alert").dialog({
|
||||||
|
resizable: false,
|
||||||
|
title: "Generation error",
|
||||||
|
width: "32em",
|
||||||
|
buttons: {
|
||||||
|
Ok: function () {
|
||||||
|
$(this).dialog("close");
|
||||||
|
}
|
||||||
|
},
|
||||||
|
position: {my: "center", at: "center", of: "svg"}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
return {openSubmapOptions, openRemapOptions}
|
||||||
|
})();
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue