diff --git a/index.html b/index.html index cdbf6b73..7fafb2e1 100644 --- a/index.html +++ b/index.html @@ -7662,8 +7662,8 @@ - - + + diff --git a/src/layers/renderers/drawBiomes.js b/src/layers/renderers/drawBiomes.js index cd0c30ee..e1d7424f 100644 --- a/src/layers/renderers/drawBiomes.js +++ b/src/layers/renderers/drawBiomes.js @@ -1,4 +1,4 @@ -import {clipPoly} from "/src/utils/lineUtils"; +import {clipPoly} from "utils/lineUtils"; export function drawBiomes() { TIME && console.time("drawBiomes"); diff --git a/src/layers/renderers/drawCells.js b/src/layers/renderers/drawCells.js index 47821a47..a5601f7d 100644 --- a/src/layers/renderers/drawCells.js +++ b/src/layers/renderers/drawCells.js @@ -1,4 +1,4 @@ -import {getGridPolygon} from "/src/utils/graphUtils"; +import {getGridPolygon} from "utils/graphUtils"; export function drawCells() { cells.selectAll("path").remove(); diff --git a/src/layers/renderers/drawCoordinates.js b/src/layers/renderers/drawCoordinates.js index 633200c5..96a236f0 100644 --- a/src/layers/renderers/drawCoordinates.js +++ b/src/layers/renderers/drawCoordinates.js @@ -1,6 +1,6 @@ -import {rn} from "/src/utils/numberUtils"; -import {round} from "/src/utils/stringUtils"; -import {byId} from "/src/utils/shorthands"; +import {rn} from "utils/numberUtils"; +import {round} from "utils/stringUtils"; +import {byId} from "utils/shorthands"; export function drawCoordinates() { coordinates.selectAll("*").remove(); // remove every time diff --git a/src/layers/renderers/drawEmblems.js b/src/layers/renderers/drawEmblems.js index cf3c0dc9..5db39430 100644 --- a/src/layers/renderers/drawEmblems.js +++ b/src/layers/renderers/drawEmblems.js @@ -1,6 +1,6 @@ import {getProvincesVertices} from "./drawProvinces"; -import {minmax, rn} from "/src/utils/numberUtils"; -import {byId} from "/src/utils/shorthands"; +import {minmax, rn} from "utils/numberUtils"; +import {byId} from "utils/shorthands"; export function drawEmblems() { const {states, provinces, burgs} = pack; diff --git a/src/layers/renderers/drawHeightmap.js b/src/layers/renderers/drawHeightmap.js index 37641bb8..1deb4fda 100644 --- a/src/layers/renderers/drawHeightmap.js +++ b/src/layers/renderers/drawHeightmap.js @@ -1,4 +1,4 @@ -import {getColorScheme, getHeightColor} from "/src/utils/colorUtils"; +import {getColorScheme, getHeightColor} from "utils/colorUtils"; export function drawHeightmap() { terrs.selectAll("*").remove(); diff --git a/src/layers/renderers/drawIce.js b/src/layers/renderers/drawIce.js index c6564bd5..659e336e 100644 --- a/src/layers/renderers/drawIce.js +++ b/src/layers/renderers/drawIce.js @@ -1,4 +1,4 @@ -import {getGridPolygon} from "/src/utils/graphUtils"; +import {getGridPolygon} from "utils/graphUtils"; export function drawIce() { const {cells, vertices} = grid; diff --git a/src/layers/renderers/drawMarkers.js b/src/layers/renderers/drawMarkers.js index 52a89321..d4682250 100644 --- a/src/layers/renderers/drawMarkers.js +++ b/src/layers/renderers/drawMarkers.js @@ -1,4 +1,4 @@ -import {rn} from "/src/utils/numberUtils"; +import {rn} from "utils/numberUtils"; const pinShapeMap = { bubble: (stroke, fill) => diff --git a/src/layers/renderers/drawTemperature.js b/src/layers/renderers/drawTemperature.js index 227731ba..cc2ee432 100644 --- a/src/layers/renderers/drawTemperature.js +++ b/src/layers/renderers/drawTemperature.js @@ -1,4 +1,4 @@ -import {convertTemperature} from "/src/utils/unitUtils"; +import {convertTemperature} from "utils/unitUtils"; export function drawTemperature() { temperature.selectAll("*").remove(); diff --git a/src/layers/renderers/index.js b/src/layers/renderers/index.js index 48933470..d85b1567 100644 --- a/src/layers/renderers/index.js +++ b/src/layers/renderers/index.js @@ -1,4 +1,4 @@ -import {TIME} from "/src/config/logging"; +import {TIME} from "config/logging"; import {drawBiomes} from "./drawBiomes"; import {drawBorders} from "./drawBorders"; import {drawCells} from "./drawCells"; diff --git a/src/layers/toggles.js b/src/layers/toggles.js index 82ba99da..b9730dde 100644 --- a/src/layers/toggles.js +++ b/src/layers/toggles.js @@ -1,6 +1,6 @@ -import {tip} from "/src/scripts/tooltips"; -import {getBase64} from "/src/utils/functionUtils"; -import {isCtrlClick} from "/src/utils/keyboardUtils"; +import {tip} from "scripts/tooltips"; +import {getBase64} from "utils/functionUtils"; +import {isCtrlClick} from "utils/keyboardUtils"; import {turnLayerButtonOn, turnLayerButtonOff, layerIsOn} from "./utils"; import {renderLayer} from "./renderers"; diff --git a/src/modules/activeZooming.js b/src/modules/activeZooming.js index 0bb74bb7..aa093928 100644 --- a/src/modules/activeZooming.js +++ b/src/modules/activeZooming.js @@ -1,5 +1,5 @@ -import {rn} from "/src/utils/numberUtils"; -import {layerIsOn, renderLayer} from "/src/layers"; +import {rn} from "utils/numberUtils"; +import {layerIsOn, renderLayer} from "layers"; import {drawScaleBar} from "/src/modules/measurers"; export function handleZoom(isScaleChanged, isPositionChanged) { diff --git a/src/modules/burgs-and-states.js b/src/modules/burgs-and-states.js index 60588e77..63964140 100644 --- a/src/modules/burgs-and-states.js +++ b/src/modules/burgs-and-states.js @@ -1,13 +1,13 @@ -import {TIME} from "/src/config/logging"; -import {layerIsOn} from "/src/layers"; +import {TIME} from "config/logging"; +import {layerIsOn} from "layers"; import {Voronoi} from "/src/modules/voronoi"; -import {getColors, getMixedColor, getRandomColor} from "/src/utils/colorUtils"; -import {findCell} from "/src/utils/graphUtils"; -import {getAdjective, trimVowels} from "/src/utils/languageUtils"; -import {getMiddlePoint} from "/src/utils/lineUtils"; -import {minmax, rn} from "/src/utils/numberUtils"; -import {each, gauss, generateSeed, P, ra, rand, rw} from "/src/utils/probabilityUtils"; -import {round, splitInTwo} from "/src/utils/stringUtils"; +import {getColors, getMixedColor, getRandomColor} from "utils/colorUtils"; +import {findCell} from "utils/graphUtils"; +import {getAdjective, trimVowels} from "utils/languageUtils"; +import {getMiddlePoint} from "utils/lineUtils"; +import {minmax, rn} from "utils/numberUtils"; +import {each, gauss, generateSeed, P, ra, rand, rw} from "utils/probabilityUtils"; +import {round, splitInTwo} from "utils/stringUtils"; window.BurgsAndStates = (function () { const generate = function () { diff --git a/src/modules/coa-generator.js b/src/modules/coa-generator.js index 7ce88e4d..14c383a5 100644 --- a/src/modules/coa-generator.js +++ b/src/modules/coa-generator.js @@ -1,4 +1,4 @@ -import {P, rw} from "/src/utils/probabilityUtils"; +import {P, rw} from "utils/probabilityUtils"; window.COA = (function () { const tinctures = { diff --git a/src/modules/cultures-generator.js b/src/modules/cultures-generator.js index ef72d8fc..5bd38a75 100644 --- a/src/modules/cultures-generator.js +++ b/src/modules/cultures-generator.js @@ -1,8 +1,8 @@ -import {TIME} from "/src/config/logging"; -import {getColors} from "/src/utils/colorUtils"; -import {rn, minmax} from "/src/utils/numberUtils"; -import {rand, P, rw, biased} from "/src/utils/probabilityUtils"; -import {abbreviate} from "/src/utils/languageUtils"; +import {TIME} from "config/logging"; +import {getColors} from "utils/colorUtils"; +import {rn, minmax} from "utils/numberUtils"; +import {rand, P, rw, biased} from "utils/probabilityUtils"; +import {abbreviate} from "utils/languageUtils"; window.Cultures = (function () { let cells; diff --git a/src/modules/dynamic/auto-update.js b/src/modules/dynamic/auto-update.js index da883359..dcc73a0b 100644 --- a/src/modules/dynamic/auto-update.js +++ b/src/modules/dynamic/auto-update.js @@ -1,8 +1,8 @@ -import {findCell} from "/src/utils/graphUtils"; -import {rn} from "/src/utils/numberUtils"; -import {rand, P, rw} from "/src/utils/probabilityUtils"; -import {parseTransform} from "/src/utils/stringUtils"; -import {turnLayerButtonOn, turnLayerButtonOff} from "/src/layers"; +import {findCell} from "utils/graphUtils"; +import {rn} from "utils/numberUtils"; +import {rand, P, rw} from "utils/probabilityUtils"; +import {parseTransform} from "utils/stringUtils"; +import {turnLayerButtonOn, turnLayerButtonOff} from "layers"; // update old .map version to the current one export function resolveVersionConflicts(version) { diff --git a/src/modules/dynamic/editors/cultures-editor.js b/src/modules/dynamic/editors/cultures-editor.js index 9de7766d..76e9d247 100644 --- a/src/modules/dynamic/editors/cultures-editor.js +++ b/src/modules/dynamic/editors/cultures-editor.js @@ -1,12 +1,12 @@ -import {restoreDefaultEvents} from "/src/scripts/events"; -import {findAll, findCell, getPackPolygon, isLand} from "/src/utils/graphUtils"; -import {tip, showMainTip, clearMainTip} from "/src/scripts/tooltips"; -import {byId} from "/src/utils/shorthands"; -import {rn} from "/src/utils/numberUtils"; -import {capitalize} from "/src/utils/stringUtils"; -import {si} from "/src/utils/unitUtils"; -import {abbreviate} from "/src/utils/languageUtils"; -import {debounce} from "/src/utils/functionUtils"; +import {restoreDefaultEvents} from "scripts/events"; +import {findAll, findCell, getPackPolygon, isLand} from "utils/graphUtils"; +import {tip, showMainTip, clearMainTip} from "scripts/tooltips"; +import {byId} from "utils/shorthands"; +import {rn} from "utils/numberUtils"; +import {capitalize} from "utils/stringUtils"; +import {si} from "utils/unitUtils"; +import {abbreviate} from "utils/languageUtils"; +import {debounce} from "utils/functionUtils"; const $body = insertEditorHtml(); addListeners(); diff --git a/src/modules/dynamic/editors/religions-editor.js b/src/modules/dynamic/editors/religions-editor.js index f6a10c6a..3cf86784 100644 --- a/src/modules/dynamic/editors/religions-editor.js +++ b/src/modules/dynamic/editors/religions-editor.js @@ -1,11 +1,11 @@ -import {restoreDefaultEvents} from "/src/scripts/events"; -import {findAll, findCell, getPackPolygon, isLand} from "/src/utils/graphUtils"; -import {tip, showMainTip, clearMainTip} from "/src/scripts/tooltips"; -import {byId} from "/src/utils/shorthands"; -import {rn} from "/src/utils/numberUtils"; -import {si} from "/src/utils/unitUtils"; -import {abbreviate} from "/src/utils/languageUtils"; -import {debounce} from "/src/utils/functionUtils"; +import {restoreDefaultEvents} from "scripts/events"; +import {findAll, findCell, getPackPolygon, isLand} from "utils/graphUtils"; +import {tip, showMainTip, clearMainTip} from "scripts/tooltips"; +import {byId} from "utils/shorthands"; +import {rn} from "utils/numberUtils"; +import {si} from "utils/unitUtils"; +import {abbreviate} from "utils/languageUtils"; +import {debounce} from "utils/functionUtils"; const $body = insertEditorHtml(); addListeners(); diff --git a/src/modules/dynamic/editors/states-editor.js b/src/modules/dynamic/editors/states-editor.js index 50d2aaca..e277ef71 100644 --- a/src/modules/dynamic/editors/states-editor.js +++ b/src/modules/dynamic/editors/states-editor.js @@ -1,12 +1,12 @@ -import {restoreDefaultEvents} from "/src/scripts/events"; -import {findAll, findCell, getPackPolygon, isLand} from "/src/utils/graphUtils"; -import {byId} from "/src/utils/shorthands"; -import {tip, showMainTip, clearMainTip} from "/src/scripts/tooltips"; -import {getRandomColor, getMixedColor} from "/src/utils/colorUtils"; -import {rn} from "/src/utils/numberUtils"; -import {rand, P} from "/src/utils/probabilityUtils"; -import {si} from "/src/utils/unitUtils"; -import {getAdjective} from "/src/utils/languageUtils"; +import {restoreDefaultEvents} from "scripts/events"; +import {findAll, findCell, getPackPolygon, isLand} from "utils/graphUtils"; +import {byId} from "utils/shorthands"; +import {tip, showMainTip, clearMainTip} from "scripts/tooltips"; +import {getRandomColor, getMixedColor} from "utils/colorUtils"; +import {rn} from "utils/numberUtils"; +import {rand, P} from "utils/probabilityUtils"; +import {si} from "utils/unitUtils"; +import {getAdjective} from "utils/languageUtils"; const $body = insertEditorHtml(); addListeners(); @@ -403,18 +403,21 @@ function stateChangeFill(el) { } function editStateName(state) { + const $stateNameEditorCustomForm = byId("stateNameEditorCustomForm"); + const $stateNameEditorSelectForm = byId("stateNameEditorSelectForm"); + // reset input value and close add mode - stateNameEditorCustomForm.value = ""; - const addModeActive = stateNameEditorCustomForm.style.display === "inline-block"; + $stateNameEditorCustomForm.value = ""; + const addModeActive = $stateNameEditorCustomForm.style.display === "inline-block"; if (addModeActive) { - stateNameEditorCustomForm.style.display = "none"; - stateNameEditorSelectForm.style.display = "inline-block"; + $stateNameEditorCustomForm.style.display = "none"; + $stateNameEditorSelectForm.style.display = "inline-block"; } const s = pack.states[state]; byId("stateNameEditor").dataset.state = state; byId("stateNameEditorShort").value = s.name || ""; - applyOption(stateNameEditorSelectForm, s.formName); + applyDropdownOption($stateNameEditorSelectForm, s.formName); byId("stateNameEditorFull").value = s.fullName || ""; $("#stateNameEditor").dialog({ @@ -456,11 +459,15 @@ function editStateName(state) { } function addCustomForm() { - const value = stateNameEditorCustomForm.value; - const addModeActive = stateNameEditorCustomForm.style.display === "inline-block"; - stateNameEditorCustomForm.style.display = addModeActive ? "none" : "inline-block"; - stateNameEditorSelectForm.style.display = addModeActive ? "inline-block" : "none"; - if (value && addModeActive) applyOption(stateNameEditorSelectForm, value); + const $stateNameEditorCustomForm = byId("stateNameEditorCustomForm"); + const $stateNameEditorSelectForm = byId("stateNameEditorSelectForm"); + + const value = $stateNameEditorCustomForm.value; + const addModeActive = $stateNameEditorCustomForm.style.display === "inline-block"; + $stateNameEditorCustomForm.style.display = addModeActive ? "none" : "inline-block"; + $stateNameEditorSelectForm.style.display = addModeActive ? "inline-block" : "none"; + + if (value && addModeActive) applyDropdownOption($stateNameEditorSelectForm, value); stateNameEditorCustomForm.value = ""; } diff --git a/src/modules/dynamic/export-json.js b/src/modules/dynamic/export-json.js index b9f25e44..b3a822a6 100644 --- a/src/modules/dynamic/export-json.js +++ b/src/modules/dynamic/export-json.js @@ -1,4 +1,4 @@ -import {tip} from "/src/scripts/tooltips"; +import {tip} from "scripts/tooltips"; export function exportToJson(type) { if (customization) diff --git a/src/modules/dynamic/heightmap-selection.js b/src/modules/dynamic/heightmap-selection.js index 41f38f9b..e0b457e9 100644 --- a/src/modules/dynamic/heightmap-selection.js +++ b/src/modules/dynamic/heightmap-selection.js @@ -1,7 +1,7 @@ -import {shouldRegenerateGrid, generateGrid} from "/src/utils/graphUtils"; -import {byId} from "/src/utils/shorthands"; -import {generateSeed} from "/src/utils/probabilityUtils"; -import {getColorScheme} from "/src/utils/colorUtils"; +import {shouldRegenerateGrid, generateGrid} from "utils/graphUtils"; +import {byId} from "utils/shorthands"; +import {generateSeed} from "utils/probabilityUtils"; +import {getColorScheme} from "utils/colorUtils"; const initialSeed = generateSeed(); let graph = getGraph(grid); @@ -27,14 +27,14 @@ export function open() { }, Select: function () { const id = getSelected(); - applyOption($templateInput, id, getName(id)); + applyDropdownOption($templateInput, id, getName(id)); lock("template"); $(this).dialog("close"); }, "New Map": function () { const id = getSelected(); - applyOption($templateInput, id, getName(id)); + applyDropdownOption($templateInput, id, getName(id)); lock("template"); const seed = getSeed(); diff --git a/src/modules/dynamic/hierarchy-tree.js b/src/modules/dynamic/hierarchy-tree.js index 94b74a85..de68ca6e 100644 --- a/src/modules/dynamic/hierarchy-tree.js +++ b/src/modules/dynamic/hierarchy-tree.js @@ -1,6 +1,6 @@ -import {byId} from "/src/utils/shorthands"; -import {tip} from "/src/scripts/tooltips"; -import {capitalize} from "/src/utils/stringUtils"; +import {byId} from "utils/shorthands"; +import {tip} from "scripts/tooltips"; +import {capitalize} from "utils/stringUtils"; appendStyleSheet(); insertHtml(); diff --git a/src/modules/dynamic/installation.js b/src/modules/dynamic/installation.js index c6bee118..2d6ae90f 100644 --- a/src/modules/dynamic/installation.js +++ b/src/modules/dynamic/installation.js @@ -1,4 +1,4 @@ -import {tip} from "/src/scripts/tooltips"; +import {tip} from "scripts/tooltips"; // module to prompt PWA installation let installButton = null; diff --git a/src/modules/dynamic/overview/charts-overview.js b/src/modules/dynamic/overview/charts-overview.js index 49a3756d..3a97f91a 100644 --- a/src/modules/dynamic/overview/charts-overview.js +++ b/src/modules/dynamic/overview/charts-overview.js @@ -1,10 +1,10 @@ -import {isWater} from "/src/utils/graphUtils"; -import {tip} from "/src/scripts/tooltips"; -import {byId} from "/src/utils/shorthands"; -import {rn} from "/src/utils/numberUtils"; -import {capitalize} from "/src/utils/stringUtils"; -import {si, convertTemperature} from "/src/utils/unitUtils"; -import {rollups} from "/src/utils/functionUtils"; +import {isWater} from "utils/graphUtils"; +import {tip} from "scripts/tooltips"; +import {byId} from "utils/shorthands"; +import {rn} from "utils/numberUtils"; +import {capitalize} from "utils/stringUtils"; +import {si, convertTemperature, getFriendlyPrecipitation} from "utils/unitUtils"; +import {rollups} from "utils/functionUtils"; const entitiesMap = { states: { @@ -157,8 +157,8 @@ const quantizationMap = { label: "Annual mean precipitation", quantize: cellId => grid.cells.prec[pack.cells.g[cellId]], aggregate: values => rn(d3.mean(values)), - formatTicks: value => getPrecipitation(rn(value)), - stringify: value => getPrecipitation(rn(value)), + formatTicks: value => getFriendlyPrecipitation(rn(value)), + stringify: value => getFriendlyPrecipitation(rn(value)), stackable: false, landOnly: true }, @@ -166,8 +166,8 @@ const quantizationMap = { label: "Mean annual maximum precipitation", quantize: cellId => grid.cells.prec[pack.cells.g[cellId]], aggregate: values => rn(d3.max(values)), - formatTicks: value => getPrecipitation(rn(value)), - stringify: value => getPrecipitation(rn(value)), + formatTicks: value => getFriendlyPrecipitation(rn(value)), + stringify: value => getFriendlyPrecipitation(rn(value)), stackable: false, landOnly: true }, @@ -175,8 +175,8 @@ const quantizationMap = { label: "Mean annual minimum precipitation", quantize: cellId => grid.cells.prec[pack.cells.g[cellId]], aggregate: values => rn(d3.min(values)), - formatTicks: value => getPrecipitation(rn(value)), - stringify: value => getPrecipitation(rn(value)), + formatTicks: value => getFriendlyPrecipitation(rn(value)), + stringify: value => getFriendlyPrecipitation(rn(value)), stackable: false, landOnly: true }, diff --git a/src/modules/fonts.js b/src/modules/fonts.js index 80bec57b..aa02879a 100644 --- a/src/modules/fonts.js +++ b/src/modules/fonts.js @@ -1,4 +1,4 @@ -import {tip} from "/src/scripts/tooltips"; +import {tip} from "scripts/tooltips"; const fonts = [ {family: "Arial"}, diff --git a/src/modules/heightmap-generator.js b/src/modules/heightmap-generator.js index 8f2a052c..b285f904 100644 --- a/src/modules/heightmap-generator.js +++ b/src/modules/heightmap-generator.js @@ -1,10 +1,10 @@ import {ERROR} from "../config/logging"; import {lim, minmax} from "../utils/numberUtils"; -import {TIME} from "/src/config/logging"; -import {createTypedArray} from "/src/utils/arrayUtils"; -import {findGridCell} from "/src/utils/graphUtils"; -import {getNumberInRange, P, rand} from "/src/utils/probabilityUtils"; -import {byId} from "/src/utils/shorthands"; +import {TIME} from "config/logging"; +import {createTypedArray} from "utils/arrayUtils"; +import {findGridCell} from "utils/graphUtils"; +import {getNumberInRange, P, rand} from "utils/probabilityUtils"; +import {byId} from "utils/shorthands"; window.HeightmapGenerator = (function () { let grid = null; diff --git a/src/modules/io/cloud.js b/src/modules/io/cloud.js index 998d2338..18da11a2 100644 --- a/src/modules/io/cloud.js +++ b/src/modules/io/cloud.js @@ -1,4 +1,4 @@ -import {tip} from "/src/scripts/tooltips"; +import {tip} from "scripts/tooltips"; /* Cloud provider implementations (Dropbox only as now) diff --git a/src/modules/io/export.js b/src/modules/io/export.js index bd81913c..cfdddc76 100644 --- a/src/modules/io/export.js +++ b/src/modules/io/export.js @@ -1,10 +1,11 @@ -import {getGridPolygon} from "/src/utils/graphUtils"; -import {unique} from "/src/utils/arrayUtils"; -import {tip} from "/src/scripts/tooltips"; -import {getCoordinates} from "/src/utils/coordinateUtils"; -import {rn} from "/src/utils/numberUtils"; -import {getBase64} from "/src/utils/functionUtils"; -import {getColorScheme, getHeightColor} from "/src/utils/colorUtils"; +import {getGridPolygon} from "utils/graphUtils"; +import {unique} from "utils/arrayUtils"; +import {tip} from "scripts/tooltips"; +import {getCoordinates} from "utils/coordinateUtils"; +import {rn} from "utils/numberUtils"; +import {getBase64} from "utils/functionUtils"; +import {getColorScheme, getHeightColor} from "utils/colorUtils"; +import {getFriendlyHeight, getCellPopulation} from "utils/unitUtils"; // download map as SVG async function saveSVG() { diff --git a/src/modules/io/load.js b/src/modules/io/load.js index dc0309fc..4a0c7e69 100644 --- a/src/modules/io/load.js +++ b/src/modules/io/load.js @@ -1,12 +1,12 @@ -import {updatePresetInput} from "/src/layers"; -import {restoreDefaultEvents} from "/src/scripts/events"; -import {ldb} from "/src/scripts/indexedDB"; -import {tip} from "/src/scripts/tooltips"; -import {last} from "/src/utils/arrayUtils"; -import {parseError} from "/src/utils/errorUtils"; -import {calculateVoronoi, findCell} from "/src/utils/graphUtils"; -import {link} from "/src/utils/linkUtils"; -import {minmax, rn} from "/src/utils/numberUtils"; +import {updatePresetInput} from "layers"; +import {restoreDefaultEvents} from "scripts/events"; +import {ldb} from "scripts/indexedDB"; +import {tip} from "scripts/tooltips"; +import {last} from "utils/arrayUtils"; +import {parseError} from "utils/errorUtils"; +import {calculateVoronoi, findCell} from "utils/graphUtils"; +import {link} from "utils/linkUtils"; +import {minmax, rn} from "utils/numberUtils"; function quickLoad() { ldb.get("lastMap", blob => { @@ -211,10 +211,10 @@ async function parseLoadedData(data) { void (function parseSettings() { const settings = data[1].split("|"); - if (settings[0]) applyOption(distanceUnitInput, settings[0]); + if (settings[0]) applyDropdownOption(byId("distanceUnitInput"), settings[0]); if (settings[1]) distanceScale = distanceScaleInput.value = distanceScaleOutput.value = settings[1]; if (settings[2]) areaUnit.value = settings[2]; - if (settings[3]) applyOption(heightUnit, settings[3]); + if (settings[3]) applyDropdownOption(byId("heightUnit"), settings[3]); if (settings[4]) heightExponentInput.value = heightExponentOutput.value = settings[4]; if (settings[5]) temperatureScale.value = settings[5]; if (settings[6]) barSizeInput.value = barSizeOutput.value = settings[6]; diff --git a/src/modules/io/save.js b/src/modules/io/save.js index 8bec8945..dd77e11f 100644 --- a/src/modules/io/save.js +++ b/src/modules/io/save.js @@ -1,7 +1,7 @@ -import {tip} from "/src/scripts/tooltips"; -import {rn} from "/src/utils/numberUtils"; -import {ldb} from "/src/scripts/indexedDB"; -import {ra} from "/src/utils/probabilityUtils"; +import {tip} from "scripts/tooltips"; +import {rn} from "utils/numberUtils"; +import {ldb} from "scripts/indexedDB"; +import {ra} from "utils/probabilityUtils"; // functions to save project as .map file diff --git a/src/modules/lakes.js b/src/modules/lakes.js index a78bad36..802af65c 100644 --- a/src/modules/lakes.js +++ b/src/modules/lakes.js @@ -1,4 +1,4 @@ -import {rn} from "/src/utils/numberUtils"; +import {rn} from "utils/numberUtils"; window.Lakes = (function () { const setClimateData = function (h) { diff --git a/src/modules/legend.js b/src/modules/legend.js index be851510..29fb2225 100644 --- a/src/modules/legend.js +++ b/src/modules/legend.js @@ -1,5 +1,5 @@ import {rn} from "../utils/numberUtils"; -import {parseTransform} from "/src/utils/stringUtils"; +import {parseTransform} from "utils/stringUtils"; export function drawLegend(name, data) { legend.selectAll("*").remove(); // fully redraw every time diff --git a/src/modules/markers-generator.js b/src/modules/markers-generator.js index d40acdca..bc61175d 100644 --- a/src/modules/markers-generator.js +++ b/src/modules/markers-generator.js @@ -1,11 +1,10 @@ -import {TIME} from "/src/config/logging"; -import {getFriendlyHeight} from "./ui/general"; -import {last} from "/src/utils/arrayUtils"; -import {rn} from "/src/utils/numberUtils"; -import {rand, P, gauss, ra, rw} from "/src/utils/probabilityUtils"; -import {capitalize} from "/src/utils/stringUtils"; -import {convertTemperature} from "/src/utils/unitUtils"; -import {getAdjective, list} from "/src/utils/languageUtils"; +import {TIME} from "config/logging"; +import {last} from "utils/arrayUtils"; +import {rn} from "utils/numberUtils"; +import {rand, P, gauss, ra, rw} from "utils/probabilityUtils"; +import {capitalize} from "utils/stringUtils"; +import {convertTemperature, getFriendlyHeight} from "utils/unitUtils"; +import {getAdjective} from "utils/languageUtils"; window.Markers = (function () { let config = []; diff --git a/src/modules/measurers.js b/src/modules/measurers.js index 25393e19..3bc20989 100644 --- a/src/modules/measurers.js +++ b/src/modules/measurers.js @@ -1,9 +1,9 @@ -import {findCell} from "/src/utils/graphUtils"; -import {last} from "/src/utils/arrayUtils"; -import {getSegmentId} from "/src/utils/lineUtils"; -import {rn} from "/src/utils/numberUtils"; -import {round, parseTransform} from "/src/utils/stringUtils"; -import {si} from "/src/utils/unitUtils"; +import {findCell} from "utils/graphUtils"; +import {last} from "utils/arrayUtils"; +import {getSegmentId} from "utils/lineUtils"; +import {rn} from "utils/numberUtils"; +import {round, parseTransform} from "utils/stringUtils"; +import {si} from "utils/unitUtils"; export class Rulers { constructor() { diff --git a/src/modules/military-generator.js b/src/modules/military-generator.js index 68bea42e..bf3be081 100644 --- a/src/modules/military-generator.js +++ b/src/modules/military-generator.js @@ -1,8 +1,8 @@ -import {TIME} from "/src/config/logging"; -import {rn, minmax} from "/src/utils/numberUtils"; -import {rand, gauss, ra} from "/src/utils/probabilityUtils"; -import {si} from "/src/utils/unitUtils"; -import {nth} from "/src/utils/languageUtils"; +import {TIME} from "config/logging"; +import {rn, minmax} from "utils/numberUtils"; +import {rand, gauss, ra} from "utils/probabilityUtils"; +import {si} from "utils/unitUtils"; +import {nth} from "utils/languageUtils"; window.Military = (function () { const generate = function () { diff --git a/src/modules/names-generator.js b/src/modules/names-generator.js index 8327a629..cb5cfe72 100644 --- a/src/modules/names-generator.js +++ b/src/modules/names-generator.js @@ -1,9 +1,9 @@ -import {last} from "/src/utils/arrayUtils"; -import {locked} from "/src/scripts/options/lock"; -import {tip} from "/src/scripts/tooltips"; -import {rand, P, ra} from "/src/utils/probabilityUtils"; -import {capitalize} from "/src/utils/stringUtils"; -import {vowel} from "/src/utils/languageUtils"; +import {last} from "utils/arrayUtils"; +import {locked} from "scripts/options/lock"; +import {tip} from "scripts/tooltips"; +import {rand, P, ra} from "utils/probabilityUtils"; +import {capitalize} from "utils/stringUtils"; +import {vowel} from "utils/languageUtils"; window.Names = (function () { let chains = []; diff --git a/src/modules/ocean-layers.js b/src/modules/ocean-layers.js index 6a103b9e..1927e4f2 100644 --- a/src/modules/ocean-layers.js +++ b/src/modules/ocean-layers.js @@ -1,8 +1,8 @@ -import {TIME} from "/src/config/logging"; -import {clipPoly} from "/src/utils/lineUtils"; -import {rn} from "/src/utils/numberUtils"; -import {P} from "/src/utils/probabilityUtils"; -import {round} from "/src/utils/stringUtils"; +import {TIME} from "config/logging"; +import {clipPoly} from "utils/lineUtils"; +import {rn} from "utils/numberUtils"; +import {P} from "utils/probabilityUtils"; +import {round} from "utils/stringUtils"; window.OceanLayers = (function () { let cells, vertices, pointsN, used; diff --git a/src/modules/relief-icons.js b/src/modules/relief-icons.js index 87602126..616fc2c7 100644 --- a/src/modules/relief-icons.js +++ b/src/modules/relief-icons.js @@ -1,6 +1,6 @@ -import {getPackPolygon} from "/src/utils/graphUtils"; -import {rn, minmax} from "/src/utils/numberUtils"; -import {rand} from "/src/utils/probabilityUtils"; +import {getPackPolygon} from "utils/graphUtils"; +import {rn, minmax} from "utils/numberUtils"; +import {rand} from "utils/probabilityUtils"; window.ReliefIcons = (function () { const ReliefIcons = function () { diff --git a/src/modules/religions-generator.js b/src/modules/religions-generator.js index a7b03d55..04091340 100644 --- a/src/modules/religions-generator.js +++ b/src/modules/religions-generator.js @@ -1,10 +1,10 @@ -import {TIME} from "/src/config/logging"; -import {findAll} from "/src/utils/graphUtils"; -import {unique} from "/src/utils/arrayUtils"; -import {getRandomColor, getMixedColor} from "/src/utils/colorUtils"; -import {rn} from "/src/utils/numberUtils"; -import {rand, P, ra, rw, biased, gauss} from "/src/utils/probabilityUtils"; -import {trimVowels, getAdjective, abbreviate} from "/src/utils/languageUtils"; +import {TIME} from "config/logging"; +import {findAll} from "utils/graphUtils"; +import {unique} from "utils/arrayUtils"; +import {getRandomColor, getMixedColor} from "utils/colorUtils"; +import {rn} from "utils/numberUtils"; +import {rand, P, ra, rw, biased, gauss} from "utils/probabilityUtils"; +import {trimVowels, getAdjective, abbreviate} from "utils/languageUtils"; window.Religions = (function () { // name generation approach and relative chance to be selected diff --git a/src/modules/river-generator.js b/src/modules/river-generator.js index 34913653..0ea7a4ff 100644 --- a/src/modules/river-generator.js +++ b/src/modules/river-generator.js @@ -1,8 +1,8 @@ -import {TIME, WARN} from "/src/config/logging"; -import {last} from "/src/utils/arrayUtils"; -import {rn} from "/src/utils/numberUtils"; -import {round} from "/src/utils/stringUtils"; -import {rw, each} from "/src/utils/probabilityUtils"; +import {TIME, WARN} from "config/logging"; +import {last} from "utils/arrayUtils"; +import {rn} from "utils/numberUtils"; +import {round} from "utils/stringUtils"; +import {rw, each} from "utils/probabilityUtils"; window.Rivers = (function () { const generate = function (allowErosion = true) { diff --git a/src/modules/routes-generator.js b/src/modules/routes-generator.js index c0f0253c..d4fc6aa9 100644 --- a/src/modules/routes-generator.js +++ b/src/modules/routes-generator.js @@ -1,7 +1,7 @@ -import {TIME} from "/src/config/logging"; -import {findCell} from "/src/utils/graphUtils"; -import {last} from "/src/utils/arrayUtils"; -import {round} from "/src/utils/stringUtils"; +import {TIME} from "config/logging"; +import {findCell} from "utils/graphUtils"; +import {last} from "utils/arrayUtils"; +import {round} from "utils/stringUtils"; window.Routes = (function () { const getRoads = function () { diff --git a/src/modules/submap.js b/src/modules/submap.js index dec90236..84e131a2 100644 --- a/src/modules/submap.js +++ b/src/modules/submap.js @@ -1,6 +1,6 @@ -import {findCell} from "/src/utils/graphUtils"; -import {getMiddlePoint} from "/src/utils/lineUtils"; -import {rn} from "/src/utils/numberUtils"; +import {findCell} from "utils/graphUtils"; +import {getMiddlePoint} from "utils/lineUtils"; +import {rn} from "utils/numberUtils"; window.Submap = (function () { const isWater = (pack, id) => pack.cells.h[id] < 20; diff --git a/src/modules/ui/3d.js b/src/modules/ui/3d.js index 1c1d5e69..54880947 100644 --- a/src/modules/ui/3d.js +++ b/src/modules/ui/3d.js @@ -1,6 +1,6 @@ -import {tip} from "/src/scripts/tooltips"; -import {rn} from "/src/utils/numberUtils"; -import {throttle} from "/src/utils/functionUtils"; +import {tip} from "scripts/tooltips"; +import {rn} from "utils/numberUtils"; +import {throttle} from "utils/functionUtils"; window.ThreeD = (function () { const options = { diff --git a/src/modules/ui/battle-screen.js b/src/modules/ui/battle-screen.js index 54457da7..09060c94 100644 --- a/src/modules/ui/battle-screen.js +++ b/src/modules/ui/battle-screen.js @@ -1,10 +1,10 @@ -import {last} from "/src/utils/arrayUtils"; -import {tip} from "/src/scripts/tooltips"; -import {wiki} from "/src/utils/linkUtils"; -import {rn, minmax} from "/src/utils/numberUtils"; -import {rand, P, Pint} from "/src/utils/probabilityUtils"; -import {capitalize} from "/src/utils/stringUtils"; -import {getAdjective, list} from "/src/utils/languageUtils"; +import {last} from "utils/arrayUtils"; +import {tip} from "scripts/tooltips"; +import {wiki} from "utils/linkUtils"; +import {rn, minmax} from "utils/numberUtils"; +import {rand, P, Pint} from "utils/probabilityUtils"; +import {capitalize} from "utils/stringUtils"; +import {getAdjective, list} from "utils/languageUtils"; export class Battle { constructor(attacker, defender) { diff --git a/src/modules/ui/biomes-editor.js b/src/modules/ui/biomes-editor.js index a594143e..56113fa0 100644 --- a/src/modules/ui/biomes-editor.js +++ b/src/modules/ui/biomes-editor.js @@ -1,10 +1,10 @@ -import {restoreDefaultEvents} from "/src/scripts/events"; -import {findAll, findCell, getPackPolygon, isLand} from "/src/utils/graphUtils"; -import {tip, showMainTip, clearMainTip} from "/src/scripts/tooltips"; -import {getRandomColor} from "/src/utils/colorUtils"; -import {openURL} from "/src/utils/linkUtils"; -import {rn} from "/src/utils/numberUtils"; -import {si} from "/src/utils/unitUtils"; +import {restoreDefaultEvents} from "scripts/events"; +import {findAll, findCell, getPackPolygon, isLand} from "utils/graphUtils"; +import {tip, showMainTip, clearMainTip} from "scripts/tooltips"; +import {getRandomColor} from "utils/colorUtils"; +import {openURL} from "utils/linkUtils"; +import {rn} from "utils/numberUtils"; +import {si} from "utils/unitUtils"; export function editBiomes() { if (customization) return; diff --git a/src/modules/ui/burg-editor.js b/src/modules/ui/burg-editor.js index 4411a38d..00f856f0 100644 --- a/src/modules/ui/burg-editor.js +++ b/src/modules/ui/burg-editor.js @@ -1,9 +1,10 @@ -import {findCell} from "/src/utils/graphUtils"; -import {tip, clearMainTip} from "/src/scripts/tooltips"; -import {rn} from "/src/utils/numberUtils"; -import {prompt} from "/src/scripts/prompt"; -import {rand} from "/src/utils/probabilityUtils"; -import {parseTransform} from "/src/utils/stringUtils"; +import {findCell} from "utils/graphUtils"; +import {tip, clearMainTip} from "scripts/tooltips"; +import {rn} from "utils/numberUtils"; +import {prompt} from "scripts/prompt"; +import {rand} from "utils/probabilityUtils"; +import {parseTransform} from "utils/stringUtils"; +import {getHeight} from "utils/unitUtils"; export function editBurg(id) { if (customization) return; diff --git a/src/modules/ui/burgs-overview.js b/src/modules/ui/burgs-overview.js index 346e74b8..52a0f295 100644 --- a/src/modules/ui/burgs-overview.js +++ b/src/modules/ui/burgs-overview.js @@ -1,9 +1,10 @@ -import {restoreDefaultEvents} from "/src/scripts/events"; -import {findCell} from "/src/utils/graphUtils"; -import {tip, clearMainTip} from "/src/scripts/tooltips"; -import {getCoordinates} from "/src/utils/coordinateUtils"; -import {rn} from "/src/utils/numberUtils"; -import {si, siToInteger} from "/src/utils/unitUtils"; +import {restoreDefaultEvents} from "scripts/events"; +import {findCell} from "utils/graphUtils"; +import {tip, clearMainTip} from "scripts/tooltips"; +import {getCoordinates} from "utils/coordinateUtils"; +import {rn} from "utils/numberUtils"; +import {si, siToInteger} from "utils/unitUtils"; +import {getHeight} from "utils/unitUtils"; export function overviewBurgs() { if (customization) return; diff --git a/src/modules/ui/cell-info.js b/src/modules/ui/cell-info.js new file mode 100644 index 00000000..b28af147 --- /dev/null +++ b/src/modules/ui/cell-info.js @@ -0,0 +1,64 @@ +import {getHeight, getCellIdPrecipitation, getFriendlyPopulation} from "utils/unitUtils.ts"; + +// get cell info on mouse move +export function updateCellInfo(point, i, g) { + const cells = pack.cells; + const x = (infoX.innerHTML = rn(point[0])); + const y = (infoY.innerHTML = rn(point[1])); + const f = cells.f[i]; + + const [lon, lat] = getCoordinates(x, y, 4); + infoLat.innerHTML = toDMS(lat, "lat"); + infoLon.innerHTML = toDMS(lon, "lon"); + + infoCell.innerHTML = i; + infoArea.innerHTML = cells.area[i] ? si(getArea(cells.area[i])) + " " + getAreaUnit() : "n/a"; + infoEvelation.innerHTML = getElevation(pack.features[f], pack.cells.h[i]); + infoDepth.innerHTML = getDepth(pack.features[f], point); + infoTemp.innerHTML = convertTemperature(grid.cells.temp[g]); + infoPrec.innerHTML = cells.h[i] >= 20 ? getCellIdPrecipitation(i) : "n/a"; + infoRiver.innerHTML = cells.h[i] >= 20 && cells.r[i] ? getRiverInfo(cells.r[i]) : "no"; + infoState.innerHTML = + cells.h[i] >= 20 + ? cells.state[i] + ? `${pack.states[cells.state[i]].fullName} (${cells.state[i]})` + : "neutral lands (0)" + : "no"; + infoProvince.innerHTML = cells.province[i] + ? `${pack.provinces[cells.province[i]].fullName} (${cells.province[i]})` + : "no"; + infoCulture.innerHTML = cells.culture[i] ? `${pack.cultures[cells.culture[i]].name} (${cells.culture[i]})` : "no"; + infoReligion.innerHTML = cells.religion[i] + ? `${pack.religions[cells.religion[i]].name} (${cells.religion[i]})` + : "no"; + infoPopulation.innerHTML = getFriendlyPopulation(i); + infoBurg.innerHTML = cells.burg[i] ? pack.burgs[cells.burg[i]].name + " (" + cells.burg[i] + ")" : "no"; + infoFeature.innerHTML = f ? pack.features[f].group + " (" + f + ")" : "n/a"; + infoBiome.innerHTML = biomesData.name[cells.biome[i]]; +} + +// get surface elevation +function getElevation(f, h) { + if (f.land) return getHeight(h) + " (" + h + ")"; // land: usual height + if (f.border) return "0 " + heightUnit.value; // ocean: 0 + if (f.type === "lake") return getHeight(f.height) + " (" + f.height + ")"; // lake: defined on river generation +} + +// get water depth +function getDepth(f, p) { + if (f.land) return "0 " + heightUnit.value; // land: 0 + + // lake: difference between surface and bottom + const gridH = grid.cells.h[findGridCell(p[0], p[1], grid)]; + if (f.type === "lake") { + const depth = gridH === 19 ? f.height / 2 : gridH; + return getHeight(depth, true); + } + + return getHeight(gridH, true); // ocean: grid height +} + +function getRiverInfo(id) { + const r = pack.rivers.find(r => r.i == id); + return r ? `${r.name} ${r.type} (${id})` : "n/a"; +} diff --git a/src/modules/ui/coastline-editor.js b/src/modules/ui/coastline-editor.js index 36bd1ed1..5d7e8e51 100644 --- a/src/modules/ui/coastline-editor.js +++ b/src/modules/ui/coastline-editor.js @@ -1,9 +1,9 @@ -import {getPackPolygon} from "/src/utils/graphUtils"; -import {tip} from "/src/scripts/tooltips"; -import {clipPoly} from "/src/utils/lineUtils"; -import {rn} from "/src/utils/numberUtils"; -import {round} from "/src/utils/stringUtils"; -import {si} from "/src/utils/unitUtils"; +import {getPackPolygon} from "utils/graphUtils"; +import {tip} from "scripts/tooltips"; +import {clipPoly} from "utils/lineUtils"; +import {rn} from "utils/numberUtils"; +import {round} from "utils/stringUtils"; +import {si} from "utils/unitUtils"; export function editCoastline(node = d3.event.target) { if (customization) return; diff --git a/src/modules/ui/diplomacy-editor.js b/src/modules/ui/diplomacy-editor.js index 9559ac6f..bcacd399 100644 --- a/src/modules/ui/diplomacy-editor.js +++ b/src/modules/ui/diplomacy-editor.js @@ -1,6 +1,6 @@ -import {restoreDefaultEvents} from "/src/scripts/events"; -import {findCell} from "/src/utils/graphUtils"; -import {tip, clearMainTip} from "/src/scripts/tooltips"; +import {restoreDefaultEvents} from "scripts/events"; +import {findCell} from "utils/graphUtils"; +import {tip, clearMainTip} from "scripts/tooltips"; export function editDiplomacy() { if (customization) return; diff --git a/src/modules/ui/editors.js b/src/modules/ui/editors.js index 6d05834f..c4f78b92 100644 --- a/src/modules/ui/editors.js +++ b/src/modules/ui/editors.js @@ -1,9 +1,9 @@ -import {restoreDefaultEvents} from "/src/scripts/events"; -import {findCell} from "/src/utils/graphUtils"; -import {byId} from "/src/utils/shorthands"; -import {tip} from "/src/scripts/tooltips"; -import {rn, minmax, normalize} from "/src/utils/numberUtils"; -import {parseTransform} from "/src/utils/stringUtils"; +import {restoreDefaultEvents} from "scripts/events"; +import {findCell} from "utils/graphUtils"; +import {byId} from "utils/shorthands"; +import {tip} from "scripts/tooltips"; +import {rn, minmax, normalize} from "utils/numberUtils"; +import {parseTransform} from "utils/stringUtils"; // clear elSelected variable export function unselect() { diff --git a/src/modules/ui/elevation-profile.js b/src/modules/ui/elevation-profile.js index 9b808544..7d485696 100644 --- a/src/modules/ui/elevation-profile.js +++ b/src/modules/ui/elevation-profile.js @@ -1,6 +1,7 @@ -import {findCell} from "/src/utils/graphUtils"; -import {rn} from "/src/utils/numberUtils"; -import {getColorScheme, getHeightColor} from "/src/utils/colorUtils"; +import {findCell} from "utils/graphUtils"; +import {rn} from "utils/numberUtils"; +import {getColorScheme, getHeightColor} from "utils/colorUtils"; +import {getHeight} from "utils/unitUtils.ts"; export function showEPForRoute(node) { const points = []; diff --git a/src/modules/ui/emblems-editor.js b/src/modules/ui/emblems-editor.js index 0158d3a1..a31f9e13 100644 --- a/src/modules/ui/emblems-editor.js +++ b/src/modules/ui/emblems-editor.js @@ -1,8 +1,8 @@ -import {clearMainTip} from "/src/scripts/tooltips"; -import {tip} from "/src/scripts/tooltips"; -import {openURL} from "/src/utils/linkUtils"; -import {rn} from "/src/utils/numberUtils"; -import {parseTransform} from "/src/utils/stringUtils"; +import {clearMainTip} from "scripts/tooltips"; +import {tip} from "scripts/tooltips"; +import {openURL} from "utils/linkUtils"; +import {rn} from "utils/numberUtils"; +import {parseTransform} from "utils/stringUtils"; export function editEmblem(type, id, el) { if (customization) return; @@ -179,7 +179,59 @@ export function editEmblem(type, id, el) { } function showArea() { - highlightEmblemElement(type, el); + const i = el.i; + const cells = pack.cells; + const animation = d3.transition().duration(1000).ease(d3.easeSinIn); + + if (type === "burg") { + const {x, y} = el; + debug + .append("circle") + .attr("cx", x) + .attr("cy", y) + .attr("r", 0) + .attr("fill", "none") + .attr("stroke", "#d0240f") + .attr("stroke-width", 1) + .attr("opacity", 1) + .transition(animation) + .attr("r", 20) + .attr("opacity", 0.1) + .attr("stroke-width", 0) + .remove(); + return; + } + + const [x, y] = el.pole || pack.cells.p[el.center]; + const obj = type === "state" ? cells.state : cells.province; + const borderCells = cells.i.filter(id => obj[id] === i && cells.c[id].some(n => obj[n] !== i)); + const data = Array.from(borderCells) + .filter((c, i) => !(i % 2)) + .map(i => cells.p[i]) + .map(i => [i[0], i[1], Math.hypot(i[0] - x, i[1] - y)]); + + debug + .selectAll("line") + .data(data) + .enter() + .append("line") + .attr("x1", x) + .attr("y1", y) + .attr("x2", d => d[0]) + .attr("y2", d => d[1]) + .attr("stroke", "#d0240f") + .attr("stroke-width", 0.5) + .attr("opacity", 0.2) + .attr("stroke-dashoffset", d => d[2]) + .attr("stroke-dasharray", d => d[2]) + .transition(animation) + .attr("stroke-dashoffset", 0) + .attr("opacity", 1) + .transition(animation) + .delay(1000) + .attr("stroke-dashoffset", d => d[2]) + .attr("opacity", 0) + .remove(); } function changeSize() { diff --git a/src/modules/ui/general.js b/src/modules/ui/general.js deleted file mode 100644 index c8e227f8..00000000 --- a/src/modules/ui/general.js +++ /dev/null @@ -1,270 +0,0 @@ -import {findCell, findGridCell} from "/src/utils/graphUtils"; -import {rn} from "/src/utils/numberUtils"; -import {link} from "/src/utils/linkUtils"; -import {getCoordinates, toDMS} from "/src/utils/coordinateUtils"; -import {si, convertTemperature} from "/src/utils/unitUtils"; -import {stored} from "/src/utils/shorthands"; - -// fit full-screen map if window is resized -window.addEventListener("resize", function (e) { - if (stored("mapWidth") && stored("mapHeight")) return; - mapWidthInput.value = window.innerWidth; - mapHeightInput.value = window.innerHeight; - changeMapSize(); -}); - -if (location.hostname && location.hostname !== "localhost" && location.hostname !== "127.0.0.1") { - window.onbeforeunload = () => "Are you sure you want to navigate away?"; -} - -function highlightEditorLine(editor, id, timeout = 10000) { - Array.from(editor.getElementsByClassName("states hovered")).forEach(el => el.classList.remove("hovered")); // clear all hovered - const hovered = Array.from(editor.querySelectorAll("div")).find(el => el.dataset.id == id); - if (hovered) hovered.classList.add("hovered"); // add hovered class - if (timeout) - setTimeout(() => { - hovered && hovered.classList.remove("hovered"); - }, timeout); -} - -// get cell info on mouse move -function updateCellInfo(point, i, g) { - const cells = pack.cells; - const x = (infoX.innerHTML = rn(point[0])); - const y = (infoY.innerHTML = rn(point[1])); - const f = cells.f[i]; - - const [lon, lat] = getCoordinates(x, y, 4); - infoLat.innerHTML = toDMS(lat, "lat"); - infoLon.innerHTML = toDMS(lon, "lon"); - - infoCell.innerHTML = i; - infoArea.innerHTML = cells.area[i] ? si(getArea(cells.area[i])) + " " + getAreaUnit() : "n/a"; - infoEvelation.innerHTML = getElevation(pack.features[f], pack.cells.h[i]); - infoDepth.innerHTML = getDepth(pack.features[f], point); - infoTemp.innerHTML = convertTemperature(grid.cells.temp[g]); - infoPrec.innerHTML = cells.h[i] >= 20 ? getFriendlyPrecipitation(i) : "n/a"; - infoRiver.innerHTML = cells.h[i] >= 20 && cells.r[i] ? getRiverInfo(cells.r[i]) : "no"; - infoState.innerHTML = - cells.h[i] >= 20 - ? cells.state[i] - ? `${pack.states[cells.state[i]].fullName} (${cells.state[i]})` - : "neutral lands (0)" - : "no"; - infoProvince.innerHTML = cells.province[i] - ? `${pack.provinces[cells.province[i]].fullName} (${cells.province[i]})` - : "no"; - infoCulture.innerHTML = cells.culture[i] ? `${pack.cultures[cells.culture[i]].name} (${cells.culture[i]})` : "no"; - infoReligion.innerHTML = cells.religion[i] - ? `${pack.religions[cells.religion[i]].name} (${cells.religion[i]})` - : "no"; - infoPopulation.innerHTML = getFriendlyPopulation(i); - infoBurg.innerHTML = cells.burg[i] ? pack.burgs[cells.burg[i]].name + " (" + cells.burg[i] + ")" : "no"; - infoFeature.innerHTML = f ? pack.features[f].group + " (" + f + ")" : "n/a"; - infoBiome.innerHTML = biomesData.name[cells.biome[i]]; -} - -// get surface elevation -function getElevation(f, h) { - if (f.land) return getHeight(h) + " (" + h + ")"; // land: usual height - if (f.border) return "0 " + heightUnit.value; // ocean: 0 - if (f.type === "lake") return getHeight(f.height) + " (" + f.height + ")"; // lake: defined on river generation -} - -// get water depth -function getDepth(f, p) { - if (f.land) return "0 " + heightUnit.value; // land: 0 - - // lake: difference between surface and bottom - const gridH = grid.cells.h[findGridCell(p[0], p[1], grid)]; - if (f.type === "lake") { - const depth = gridH === 19 ? f.height / 2 : gridH; - return getHeight(depth, "abs"); - } - - return getHeight(gridH, "abs"); // ocean: grid height -} - -// get user-friendly (real-world) height value from map data -export function getFriendlyHeight([x, y]) { - const packH = pack.cells.h[findCell(x, y)]; - const gridH = grid.cells.h[findGridCell(x, y, grid)]; - const h = packH < 20 ? gridH : packH; - return getHeight(h); -} - -function getHeight(h, abs) { - const unit = heightUnit.value; - let unitRatio = 3.281; // default calculations are in feet - if (unit === "m") unitRatio = 1; // if meter - else if (unit === "f") unitRatio = 0.5468; // if fathom - - let height = -990; - if (h >= 20) height = Math.pow(h - 18, +heightExponentInput.value); - else if (h < 20 && h > 0) height = ((h - 20) / h) * 50; - - if (abs) height = Math.abs(height); - return rn(height * unitRatio) + " " + unit; -} - -function getPrecipitation(prec) { - return prec * 100 + " mm"; -} - -// get user-friendly (real-world) precipitation value from map data -function getFriendlyPrecipitation(i) { - const prec = grid.cells.prec[pack.cells.g[i]]; - return getPrecipitation(prec); -} - -function getRiverInfo(id) { - const r = pack.rivers.find(r => r.i == id); - return r ? `${r.name} ${r.type} (${id})` : "n/a"; -} - -function getCellPopulation(i) { - const rural = pack.cells.pop[i] * populationRate; - const urban = pack.cells.burg[i] ? pack.burgs[pack.cells.burg[i]].population * populationRate * urbanization : 0; - return [rural, urban]; -} - -// get user-friendly (real-world) population value from map data -function getFriendlyPopulation(i) { - const [rural, urban] = getCellPopulation(i); - return `${si(rural + urban)} (${si(rural)} rural, urban ${si(urban)})`; -} - -function getPopulationTip(i) { - const [rural, urban] = getCellPopulation(i); - return `Cell population: ${si(rural + urban)}; Rural: ${si(rural)}; Urban: ${si(urban)}`; -} - -function highlightEmblemElement(type, el) { - const i = el.i, - cells = pack.cells; - const animation = d3.transition().duration(1000).ease(d3.easeSinIn); - - if (type === "burg") { - const {x, y} = el; - debug - .append("circle") - .attr("cx", x) - .attr("cy", y) - .attr("r", 0) - .attr("fill", "none") - .attr("stroke", "#d0240f") - .attr("stroke-width", 1) - .attr("opacity", 1) - .transition(animation) - .attr("r", 20) - .attr("opacity", 0.1) - .attr("stroke-width", 0) - .remove(); - return; - } - - const [x, y] = el.pole || pack.cells.p[el.center]; - const obj = type === "state" ? cells.state : cells.province; - const borderCells = cells.i.filter(id => obj[id] === i && cells.c[id].some(n => obj[n] !== i)); - const data = Array.from(borderCells) - .filter((c, i) => !(i % 2)) - .map(i => cells.p[i]) - .map(i => [i[0], i[1], Math.hypot(i[0] - x, i[1] - y)]); - - debug - .selectAll("line") - .data(data) - .enter() - .append("line") - .attr("x1", x) - .attr("y1", y) - .attr("x2", d => d[0]) - .attr("y2", d => d[1]) - .attr("stroke", "#d0240f") - .attr("stroke-width", 0.5) - .attr("opacity", 0.2) - .attr("stroke-dashoffset", d => d[2]) - .attr("stroke-dasharray", d => d[2]) - .transition(animation) - .attr("stroke-dashoffset", 0) - .attr("opacity", 1) - .transition(animation) - .delay(1000) - .attr("stroke-dashoffset", d => d[2]) - .attr("opacity", 0) - .remove(); -} - -// assign skeaker behaviour -Array.from(document.getElementsByClassName("speaker")).forEach(el => { - const input = el.previousElementSibling; - el.addEventListener("click", () => speak(input.value)); -}); - -function speak(text) { - const speaker = new SpeechSynthesisUtterance(text); - const voices = speechSynthesis.getVoices(); - if (voices.length) { - const voiceId = +document.getElementById("speakerVoice").value; - speaker.voice = voices[voiceId]; - } - speechSynthesis.speak(speaker); -} - -// apply drop-down menu option. If the value is not in options, add it -export function applyOption($select, value, name = value) { - const isExisting = Array.from($select.options).some(o => o.value === value); - if (!isExisting) $select.options.add(new Option(name, value)); - $select.value = value; -} - -// show info about the generator in a popup -function showInfo() { - const Discord = link("https://discordapp.com/invite/X7E84HU", "Discord"); - const Reddit = link("https://www.reddit.com/r/FantasyMapGenerator", "Reddit"); - const Patreon = link("https://www.patreon.com/azgaar", "Patreon"); - const Armoria = link("https://azgaar.github.io/Armoria", "Armoria"); - - const QuickStart = link( - "https://github.com/Azgaar/Fantasy-Map-Generator/wiki/Quick-Start-Tutorial", - "Quick start tutorial" - ); - const QAA = link("https://github.com/Azgaar/Fantasy-Map-Generator/wiki/Q&A", "Q&A page"); - const VideoTutorial = link("https://youtube.com/playlist?list=PLtgiuDC8iVR2gIG8zMTRn7T_L0arl9h1C", "Video tutorial"); - - alertMessage.innerHTML = /* html */ `Fantasy Map Generator (FMG) is a free open-source application. It means that you own all created maps and can use them as - you wish. - -

- The development is community-backed, you can donate on ${Patreon}. You can also help creating overviews, tutorials and spreding the word about the - Generator. -

- -

- The best way to get help is to contact the community on ${Discord} and ${Reddit}. Before asking questions, please check out the ${QuickStart}, the ${QAA}, - and ${VideoTutorial}. -

- -

Check out our another project: ${Armoria} — heraldry generator and editor.

- - `; - - $("#alert").dialog({ - resizable: false, - title: document.title, - width: "28em", - buttons: { - OK: function () { - $(this).dialog("close"); - } - }, - position: {my: "center", at: "center", of: "svg"} - }); -} diff --git a/src/modules/ui/heightmap-editor.js b/src/modules/ui/heightmap-editor.js index 1f160a46..dca8b59e 100644 --- a/src/modules/ui/heightmap-editor.js +++ b/src/modules/ui/heightmap-editor.js @@ -1,14 +1,15 @@ -import {turnLayerButtonOff, turnLayerButtonOn, updatePresetInput} from "/src/layers"; -import {restoreDefaultEvents} from "/src/scripts/events"; -import {prompt} from "/src/scripts/prompt"; -import {clearMainTip, showMainTip, tip} from "/src/scripts/tooltips"; -import {createTypedArray, last} from "/src/utils/arrayUtils"; -import {getColorScheme, getHeightColor} from "/src/utils/colorUtils"; -import {throttle} from "/src/utils/functionUtils"; -import {findCell, findGridAll, findGridCell, getGridPolygon, getPackPolygon} from "/src/utils/graphUtils"; -import {link} from "/src/utils/linkUtils"; -import {lim, minmax, rn} from "/src/utils/numberUtils"; -import {byId} from "/src/utils/shorthands"; +import {createTypedArray, last} from "utils/arrayUtils"; +import {getColorScheme, getHeightColor} from "utils/colorUtils"; +import {throttle} from "utils/functionUtils"; +import {findCell, findGridAll, findGridCell, getGridPolygon, getPackPolygon} from "utils/graphUtils"; +import {link} from "utils/linkUtils"; +import {lim, minmax, rn} from "utils/numberUtils"; +import {byId} from "utils/shorthands"; +import {getHeight} from "utils/unitUtils"; +import {turnLayerButtonOff, turnLayerButtonOn, updatePresetInput} from "layers"; +import {restoreDefaultEvents} from "scripts/events"; +import {prompt} from "scripts/prompt"; +import {clearMainTip, showMainTip, tip} from "scripts/tooltips"; export function editHeightmap(options) { const {mode, tool} = options || {}; @@ -143,21 +144,6 @@ export function editHeightmap(options) { moveCircle(x, y, brushRadius.valueAsNumber, "#333"); } - // get user-friendly (real-world) height value from map data - function getHeight(h) { - const unit = heightUnit.value; - let unitRatio = 3.281; // default calculations are in feet - if (unit === "m") unitRatio = 1; - // if meter - else if (unit === "f") unitRatio = 0.5468; // if fathom - - let height = -990; - if (h >= 20) height = Math.pow(h - 18, +heightExponentInput.value); - else if (h < 20 && h > 0) height = ((h - 20) / h) * 50; - - return rn(height * unitRatio) + " " + unit; - } - // Exit customization mode function finalizeHeightmap() { if (viewbox.select("#heights").selectAll("*").size() < 200) diff --git a/src/modules/ui/hotkeys.js b/src/modules/ui/hotkeys.js index e52e82eb..29784c47 100644 --- a/src/modules/ui/hotkeys.js +++ b/src/modules/ui/hotkeys.js @@ -1,5 +1,6 @@ -import {byId} from "/src/utils/shorthands"; -import {toggleLayer} from "/src/layers"; +import {byId} from "utils/shorthands"; +import {toggleLayer} from "layers"; +import {showAboutDialog} from "scripts/options/about"; // Hotkeys, see github.com/Azgaar/Fantasy-Map-Generator/wiki/Hotkeys document.on("keydown", handleKeydown); @@ -24,7 +25,7 @@ function handleKeyup(event) { const shift = shiftKey || key === "Shift"; const alt = altKey || key === "Alt"; - if (code === "F1") showInfo(); + if (code === "F1") showAboutDialog(); else if (code === "F2") regeneratePrompt(); else if (code === "F6") quickSave(); else if (code === "F9") quickLoad(); diff --git a/src/modules/ui/ice-editor.js b/src/modules/ui/ice-editor.js index 13ff3f66..af10a3aa 100644 --- a/src/modules/ui/ice-editor.js +++ b/src/modules/ui/ice-editor.js @@ -1,8 +1,8 @@ -import {findGridCell, getGridPolygon} from "/src/utils/graphUtils"; -import {tip, clearMainTip} from "/src/scripts/tooltips"; -import {rn} from "/src/utils/numberUtils"; -import {ra} from "/src/utils/probabilityUtils"; -import {parseTransform} from "/src/utils/stringUtils"; +import {findGridCell, getGridPolygon} from "utils/graphUtils"; +import {tip, clearMainTip} from "scripts/tooltips"; +import {rn} from "utils/numberUtils"; +import {ra} from "utils/probabilityUtils"; +import {parseTransform} from "utils/stringUtils"; export function editIce() { if (customization) return; diff --git a/src/modules/ui/labels-editor.js b/src/modules/ui/labels-editor.js index 7a81ee51..5e766b02 100644 --- a/src/modules/ui/labels-editor.js +++ b/src/modules/ui/labels-editor.js @@ -1,6 +1,6 @@ -import {findCell} from "/src/utils/graphUtils"; -import {tip, showMainTip} from "/src/scripts/tooltips"; -import {round, parseTransform} from "/src/utils/stringUtils"; +import {findCell} from "utils/graphUtils"; +import {tip, showMainTip} from "scripts/tooltips"; +import {round, parseTransform} from "utils/stringUtils"; export function editLabel() { if (customization) return; diff --git a/src/modules/ui/lakes-editor.js b/src/modules/ui/lakes-editor.js index 56595afb..e6359dd1 100644 --- a/src/modules/ui/lakes-editor.js +++ b/src/modules/ui/lakes-editor.js @@ -1,9 +1,9 @@ -import {getPackPolygon} from "/src/utils/graphUtils"; -import {tip} from "/src/scripts/tooltips"; -import {rn} from "/src/utils/numberUtils"; -import {rand} from "/src/utils/probabilityUtils"; -import {round} from "/src/utils/stringUtils"; -import {si} from "/src/utils/unitUtils"; +import {getPackPolygon} from "utils/graphUtils"; +import {tip} from "scripts/tooltips"; +import {rn} from "utils/numberUtils"; +import {rand} from "utils/probabilityUtils"; +import {round} from "utils/stringUtils"; +import {si, getHeight} from "utils/unitUtils"; export function editLake() { if (customization) return; @@ -61,8 +61,8 @@ export function editLake() { const heights = lakeCells.map(i => cells.h[i]); document.getElementById("lakeElevation").value = getHeight(l.height); - document.getElementById("lakeAvarageDepth").value = getHeight(d3.mean(heights), "abs"); - document.getElementById("lakeMaxDepth").value = getHeight(d3.min(heights), "abs"); + document.getElementById("lakeAvarageDepth").value = getHeight(d3.mean(heights), true); + document.getElementById("lakeMaxDepth").value = getHeight(d3.min(heights), true); document.getElementById("lakeFlux").value = l.flux; document.getElementById("lakeEvaporation").value = l.evaporation; diff --git a/src/modules/ui/markers-editor.js b/src/modules/ui/markers-editor.js index 45571ba3..fec2cf8a 100644 --- a/src/modules/ui/markers-editor.js +++ b/src/modules/ui/markers-editor.js @@ -1,7 +1,7 @@ -import {restoreDefaultEvents} from "/src/scripts/events"; -import {findCell} from "/src/utils/graphUtils"; -import {clearMainTip} from "/src/scripts/tooltips"; -import {rn} from "/src/utils/numberUtils"; +import {restoreDefaultEvents} from "scripts/events"; +import {findCell} from "utils/graphUtils"; +import {clearMainTip} from "scripts/tooltips"; +import {rn} from "utils/numberUtils"; export function editMarker(markerI) { if (customization) return; diff --git a/src/modules/ui/markers-overview.js b/src/modules/ui/markers-overview.js index b799a9d3..bb7d9a00 100644 --- a/src/modules/ui/markers-overview.js +++ b/src/modules/ui/markers-overview.js @@ -1,5 +1,5 @@ -import {restoreDefaultEvents} from "/src/scripts/events"; -import {clearMainTip} from "/src/scripts/tooltips"; +import {restoreDefaultEvents} from "scripts/events"; +import {clearMainTip} from "scripts/tooltips"; export function overviewMarkers() { if (customization) return; diff --git a/src/modules/ui/military-overview.js b/src/modules/ui/military-overview.js index 199a0858..40b0c23f 100644 --- a/src/modules/ui/military-overview.js +++ b/src/modules/ui/military-overview.js @@ -1,8 +1,8 @@ -import {tip} from "/src/scripts/tooltips"; -import {wiki} from "/src/utils/linkUtils"; -import {rn} from "/src/utils/numberUtils"; -import {capitalize} from "/src/utils/stringUtils"; -import {si} from "/src/utils/unitUtils"; +import {tip} from "scripts/tooltips"; +import {wiki} from "utils/linkUtils"; +import {rn} from "utils/numberUtils"; +import {capitalize} from "utils/stringUtils"; +import {si} from "utils/unitUtils"; export function overviewMilitary() { if (customization) return; diff --git a/src/modules/ui/namesbase-editor.js b/src/modules/ui/namesbase-editor.js index 1fce3c1b..a37b8a33 100644 --- a/src/modules/ui/namesbase-editor.js +++ b/src/modules/ui/namesbase-editor.js @@ -1,7 +1,7 @@ -import {unique} from "/src/utils/arrayUtils"; -import {tip} from "/src/scripts/tooltips"; -import {openURL} from "/src/utils/linkUtils"; -import {rn} from "/src/utils/numberUtils"; +import {unique} from "utils/arrayUtils"; +import {tip} from "scripts/tooltips"; +import {openURL} from "utils/linkUtils"; +import {rn} from "utils/numberUtils"; export function editNamesbase() { if (customization) return; diff --git a/src/modules/ui/notes-editor.js b/src/modules/ui/notes-editor.js index 94bfca85..46b8c53d 100644 --- a/src/modules/ui/notes-editor.js +++ b/src/modules/ui/notes-editor.js @@ -1,4 +1,4 @@ -import {tip} from "/src/scripts/tooltips"; +import {tip} from "scripts/tooltips"; export function editNotes(id, name) { // elements diff --git a/src/modules/ui/options.js b/src/modules/ui/options.js index 0e2f1d0c..cfda99b9 100644 --- a/src/modules/ui/options.js +++ b/src/modules/ui/options.js @@ -1,10 +1,10 @@ -import {applyOption} from "./general"; -import {lock, locked} from "/src/scripts/options/lock"; -import {clearMainTip, tip} from "/src/scripts/tooltips"; -import {last} from "/src/utils/arrayUtils"; -import {minmax, rn} from "/src/utils/numberUtils"; -import {gauss, P, rand, rw} from "/src/utils/probabilityUtils"; -import {byId, stored} from "/src/utils/shorthands"; +import {lock, locked} from "scripts/options/lock"; +import {clearMainTip, tip} from "scripts/tooltips"; +import {last} from "utils/arrayUtils"; +import {applyDropdownOption} from "utils/nodeUtils"; +import {minmax, rn} from "utils/numberUtils"; +import {gauss, P, rand, rw} from "utils/probabilityUtils"; +import {byId, stored} from "utils/shorthands"; $("#optionsContainer").draggable({handle: ".drag-trigger", snap: "svg", snapMode: "both"}); $("#exitCustomization").draggable({handle: "div"}); @@ -167,6 +167,19 @@ function mapSizeInputChange() { localStorage.setItem("mapHeight", mapHeightInput.value); } +export function addResizeListener() { + // fit full-screen map if window is resized + window.addEventListener("resize", function () { + if (stored("mapWidth") && stored("mapHeight")) return; + + const {innerWidth, innerHeight} = window; + byId("mapWidthInput").value = innerWidth; + byId("mapHeightInput").value = innerHeight; + + changeMapSize(); + }); +} + // change svg size on manual size change or window resize, do not change graph size function changeMapSize() { svgWidth = Math.min(+mapWidthInput.value, window.innerWidth); @@ -475,11 +488,11 @@ export function applyStoredOptions() { const heightmapId = stored("template"); if (heightmapId) { const name = heightmapTemplates[heightmapId]?.name || precreatedHeightmaps[heightmapId]?.name || heightmapId; - applyOption(byId("templateInput"), heightmapId, name); + applyDropdownOption(byId("templateInput"), heightmapId, name); } - if (stored("distanceUnit")) applyOption(distanceUnitInput, stored("distanceUnit")); - if (stored("heightUnit")) applyOption(heightUnit, stored("heightUnit")); + if (stored("distanceUnit")) applyDropdownOption(byId("distanceUnitInput"), stored("distanceUnit")); + if (stored("heightUnit")) applyDropdownOption(byId("heightUnit"), stored("heightUnit")); for (let i = 0; i < localStorage.length; i++) { const key = localStorage.key(i); @@ -494,7 +507,7 @@ export function applyStoredOptions() { lock(key); // add saved style presets to options - if (key.slice(0, 5) === "style") applyOption(stylePreset, key, key.slice(5)); + if (key.slice(0, 5) === "style") applyDropdownOption(byId("stylePreset"), key, key.slice(5)); } if (stored("winds")) @@ -572,7 +585,7 @@ function randomizeHeightmapTemplate() { } const template = rw(templates); const name = heightmapTemplates[template].name; - applyOption(byId("templateInput"), template, name); + applyDropdownOption(byId("templateInput"), template, name); } // select culture set pseudo-randomly diff --git a/src/modules/ui/provinces-editor.js b/src/modules/ui/provinces-editor.js index c939fdc2..92ec9db0 100644 --- a/src/modules/ui/provinces-editor.js +++ b/src/modules/ui/provinces-editor.js @@ -1,13 +1,14 @@ -import {restoreDefaultEvents} from "/src/scripts/events"; -import {findAll, findCell, getPackPolygon, isLand} from "/src/utils/graphUtils"; -import {unique} from "/src/utils/arrayUtils"; -import {tip, showMainTip, clearMainTip} from "/src/scripts/tooltips"; -import {getRandomColor} from "/src/utils/colorUtils"; -import {rn} from "/src/utils/numberUtils"; -import {rand, P} from "/src/utils/probabilityUtils"; -import {parseTransform} from "/src/utils/stringUtils"; -import {si} from "/src/utils/unitUtils"; -import {turnLayerButtonOff} from "/src/layers"; +import {restoreDefaultEvents} from "scripts/events"; +import {findAll, findCell, getPackPolygon, isLand} from "utils/graphUtils"; +import {unique} from "utils/arrayUtils"; +import {tip, showMainTip, clearMainTip} from "scripts/tooltips"; +import {getRandomColor} from "utils/colorUtils"; +import {rn} from "utils/numberUtils"; +import {rand, P} from "utils/probabilityUtils"; +import {parseTransform} from "utils/stringUtils"; +import {si} from "utils/unitUtils"; +import {turnLayerButtonOff} from "layers"; +import {byId} from "utils/shorthands"; export function editProvinces() { if (customization) return; @@ -18,7 +19,7 @@ export function editProvinces() { if (layerIsOn("toggleCultures")) toggleCultures(); provs.selectAll("text").call(d3.drag().on("drag", dragLabel)).classed("draggable", true); - const body = document.getElementById("provincesBodySection"); + const body = byId("provincesBodySection"); refreshProvincesEditor(); if (fmg.modules.editProvinces) return; @@ -33,20 +34,20 @@ export function editProvinces() { }); // add listeners - document.getElementById("provincesEditorRefresh").addEventListener("click", refreshProvincesEditor); - document.getElementById("provincesEditStyle").addEventListener("click", () => editStyle("provs")); - document.getElementById("provincesFilterState").addEventListener("change", provincesEditorAddLines); - document.getElementById("provincesPercentage").addEventListener("click", togglePercentageMode); - document.getElementById("provincesChart").addEventListener("click", showChart); - document.getElementById("provincesToggleLabels").addEventListener("click", toggleLabels); - document.getElementById("provincesExport").addEventListener("click", downloadProvincesData); - document.getElementById("provincesRemoveAll").addEventListener("click", removeAllProvinces); - document.getElementById("provincesManually").addEventListener("click", enterProvincesManualAssignent); - document.getElementById("provincesManuallyApply").addEventListener("click", applyProvincesManualAssignent); - document.getElementById("provincesManuallyCancel").addEventListener("click", () => exitProvincesManualAssignment()); - document.getElementById("provincesRelease").addEventListener("click", triggerProvincesRelease); - document.getElementById("provincesAdd").addEventListener("click", enterAddProvinceMode); - document.getElementById("provincesRecolor").addEventListener("click", recolorProvinces); + byId("provincesEditorRefresh").addEventListener("click", refreshProvincesEditor); + byId("provincesEditStyle").addEventListener("click", () => editStyle("provs")); + byId("provincesFilterState").addEventListener("change", provincesEditorAddLines); + byId("provincesPercentage").addEventListener("click", togglePercentageMode); + byId("provincesChart").addEventListener("click", showChart); + byId("provincesToggleLabels").addEventListener("click", toggleLabels); + byId("provincesExport").addEventListener("click", downloadProvincesData); + byId("provincesRemoveAll").addEventListener("click", removeAllProvinces); + byId("provincesManually").addEventListener("click", enterProvincesManualAssignent); + byId("provincesManuallyApply").addEventListener("click", applyProvincesManualAssignent); + byId("provincesManuallyCancel").addEventListener("click", () => exitProvincesManualAssignment()); + byId("provincesRelease").addEventListener("click", triggerProvincesRelease); + byId("provincesAdd").addEventListener("click", enterAddProvinceMode); + byId("provincesRecolor").addEventListener("click", recolorProvinces); body.addEventListener("click", function (ev) { if (customization) return; @@ -108,7 +109,7 @@ export function editProvinces() { } function updateFilter() { - const stateFilter = document.getElementById("provincesFilterState"); + const stateFilter = byId("provincesFilterState"); const selectedState = stateFilter.value || 1; stateFilter.options.length = 0; // remove all options stateFilter.options.add(new Option(`all`, -1, false, selectedState == -1)); @@ -119,7 +120,7 @@ export function editProvinces() { // add line for each state function provincesEditorAddLines() { const unit = " " + getAreaUnit(); - const selectedState = +document.getElementById("provincesFilterState").value; + const selectedState = +byId("provincesFilterState").value; let filtered = pack.provinces.filter(p => p.i && !p.removed); // all valid burgs if (selectedState != -1) filtered = filtered.filter(p => p.state === selectedState); // filtered by state body.innerHTML = ""; @@ -306,7 +307,7 @@ export function editProvinces() { const {cell: center, culture} = burgs[burgId]; const color = getRandomColor(); const coa = province.coa; - const coaEl = document.getElementById("provinceCOA" + provinceId); + const coaEl = byId("provinceCOA" + provinceId); if (coaEl) coaEl.id = "stateCOA" + newStateId; emblems.select(`#provinceEmblems > use[data-i='${provinceId}']`).remove(); @@ -482,7 +483,7 @@ export function editProvinces() { unfog("focusProvince" + p); const coaId = "provinceCOA" + p; - if (document.getElementById(coaId)) document.getElementById(coaId).remove(); + if (byId(coaId)) byId(coaId).remove(); emblems.select(`#provinceEmblems > use[data-i='${p}']`).remove(); pack.provinces[p] = {i: p, removed: true}; @@ -504,10 +505,10 @@ export function editProvinces() { function editProvinceName(province) { const p = pack.provinces[province]; - document.getElementById("provinceNameEditor").dataset.province = province; - document.getElementById("provinceNameEditorShort").value = p.name; - applyOption(provinceNameEditorSelectForm, p.formName); - document.getElementById("provinceNameEditorFull").value = p.fullName; + byId("provinceNameEditor").dataset.province = province; + byId("provinceNameEditorShort").value = p.name; + applyDropdownOption(byId("provinceNameEditorSelectForm"), p.formName); + byId("provinceNameEditorFull").value = p.fullName; $("#provinceNameEditor").dialog({ resizable: false, @@ -528,36 +529,39 @@ export function editProvinces() { fmg.modules.editProvinceName = true; // add listeners - document.getElementById("provinceNameEditorShortCulture").addEventListener("click", regenerateShortNameCuture); - document.getElementById("provinceNameEditorShortRandom").addEventListener("click", regenerateShortNameRandom); - document.getElementById("provinceNameEditorAddForm").addEventListener("click", addCustomForm); - document.getElementById("provinceNameEditorFullRegenerate").addEventListener("click", regenerateFullName); + byId("provinceNameEditorShortCulture").addEventListener("click", regenerateShortNameCuture); + byId("provinceNameEditorShortRandom").addEventListener("click", regenerateShortNameRandom); + byId("provinceNameEditorAddForm").addEventListener("click", addCustomForm); + byId("provinceNameEditorFullRegenerate").addEventListener("click", regenerateFullName); function regenerateShortNameCuture() { const province = +provinceNameEditor.dataset.province; const culture = pack.cells.culture[pack.provinces[province].center]; const name = Names.getState(Names.getCultureShort(culture), culture); - document.getElementById("provinceNameEditorShort").value = name; + byId("provinceNameEditorShort").value = name; } function regenerateShortNameRandom() { const base = rand(nameBases.length - 1); const name = Names.getState(Names.getBase(base), undefined, base); - document.getElementById("provinceNameEditorShort").value = name; + byId("provinceNameEditorShort").value = name; } function addCustomForm() { - const value = provinceNameEditorCustomForm.value; - const displayed = provinceNameEditorCustomForm.style.display === "inline-block"; - provinceNameEditorCustomForm.style.display = displayed ? "none" : "inline-block"; - provinceNameEditorSelectForm.style.display = displayed ? "inline-block" : "none"; - if (displayed) applyOption(provinceNameEditorSelectForm, value); + const $provinceNameEditorCustomForm = byId("provinceNameEditorCustomForm"); + const $provinceNameEditorSelectForm = byId("provinceNameEditorSelectForm"); + + const value = $provinceNameEditorCustomForm.value; + const displayed = $provinceNameEditorCustomForm.style.display === "inline-block"; + $provinceNameEditorCustomForm.style.display = displayed ? "none" : "inline-block"; + $provinceNameEditorSelectForm.style.display = displayed ? "inline-block" : "none"; + if (displayed) applyDropdownOption($provinceNameEditorSelectForm, value); } function regenerateFullName() { - const short = document.getElementById("provinceNameEditorShort").value; - const form = document.getElementById("provinceNameEditorSelectForm").value; - document.getElementById("provinceNameEditorFull").value = getFullName(); + const short = byId("provinceNameEditorShort").value; + const form = byId("provinceNameEditorSelectForm").value; + byId("provinceNameEditorFull").value = getFullName(); function getFullName() { if (!form) return short; @@ -567,9 +571,9 @@ export function editProvinces() { } function applyNameChange(p) { - p.name = document.getElementById("provinceNameEditorShort").value; - p.formName = document.getElementById("provinceNameEditorSelectForm").value; - p.fullName = document.getElementById("provinceNameEditorFull").value; + p.name = byId("provinceNameEditorShort").value; + p.formName = byId("provinceNameEditorSelectForm").value; + p.fullName = byId("provinceNameEditorFull").value; provs.select("#provinceLabel" + p.i).text(p.name); refreshProvincesEditor(); } @@ -645,7 +649,7 @@ export function editProvinces() { .attr("height", height) .attr("font-size", "10px"); const graph = svg.append("g").attr("transform", `translate(10, 0)`); - document.getElementById("provincesTreeType").addEventListener("change", updateChart); + byId("provincesTreeType").addEventListener("change", updateChart); treeLayout(root); @@ -682,7 +686,7 @@ export function editProvinces() { function hideInfo(ev) { provinceHighlightOff(ev); - if (!document.getElementById("provinceInfo")) return; + if (!byId("provinceInfo")) return; provinceInfo.innerHTML = "‍"; d3.select(ev.target).select("rect").classed("selected", 0); } @@ -820,7 +824,7 @@ export function editProvinces() { .attr("stroke-width", 1); document.querySelectorAll("#provincesBottom > *").forEach(el => (el.style.display = "none")); - document.getElementById("provincesManuallyButtons").style.display = "inline-block"; + byId("provincesManuallyButtons").style.display = "inline-block"; provincesEditor.querySelectorAll(".hide").forEach(el => el.classList.add("hidden")); provincesHeader.querySelector("div[data-sortby='state']").style.left = "7.7em"; @@ -964,7 +968,7 @@ export function editProvinces() { debug.selectAll("path.selected").remove(); document.querySelectorAll("#provincesBottom > *").forEach(el => (el.style.display = "inline-block")); - document.getElementById("provincesManuallyButtons").style.display = "none"; + byId("provincesManuallyButtons").style.display = "none"; provincesEditor.querySelectorAll(".hide:not(.show)").forEach(el => el.classList.remove("hidden")); provincesHeader.querySelector("div[data-sortby='state']").style.left = "22em"; @@ -1043,7 +1047,7 @@ export function editProvinces() { if (!layerIsOn("toggleProvinces")) toggleProvinces(); else drawProvinces(); collectStatistics(); - document.getElementById("provincesFilterState").value = state; + byId("provincesFilterState").value = state; provincesEditorAddLines(); } @@ -1056,7 +1060,7 @@ export function editProvinces() { } function recolorProvinces() { - const state = +document.getElementById("provincesFilterState").value; + const state = +byId("provincesFilterState").value; pack.provinces.forEach(p => { if (!p || p.removed) return; diff --git a/src/modules/ui/regiment-editor.js b/src/modules/ui/regiment-editor.js index bd5a7223..2c26151c 100644 --- a/src/modules/ui/regiment-editor.js +++ b/src/modules/ui/regiment-editor.js @@ -1,9 +1,9 @@ -import {restoreDefaultEvents} from "/src/scripts/events"; -import {findCell} from "/src/utils/graphUtils"; -import {last} from "/src/utils/arrayUtils"; -import {tip, clearMainTip} from "/src/scripts/tooltips"; -import {rn} from "/src/utils/numberUtils"; -import {capitalize} from "/src/utils/stringUtils"; +import {restoreDefaultEvents} from "scripts/events"; +import {findCell} from "utils/graphUtils"; +import {last} from "utils/arrayUtils"; +import {tip, clearMainTip} from "scripts/tooltips"; +import {rn} from "utils/numberUtils"; +import {capitalize} from "utils/stringUtils"; export function editRegiment(selector) { if (customization) return; diff --git a/src/modules/ui/regiments-overview.js b/src/modules/ui/regiments-overview.js index 8dc02bfe..8a48d3e9 100644 --- a/src/modules/ui/regiments-overview.js +++ b/src/modules/ui/regiments-overview.js @@ -1,9 +1,9 @@ -import {findCell} from "/src/utils/graphUtils"; -import {last} from "/src/utils/arrayUtils"; -import {tip, clearMainTip} from "/src/scripts/tooltips"; -import {rn} from "/src/utils/numberUtils"; -import {capitalize} from "/src/utils/stringUtils"; -import {si} from "/src/utils/unitUtils"; +import {findCell} from "utils/graphUtils"; +import {last} from "utils/arrayUtils"; +import {tip, clearMainTip} from "scripts/tooltips"; +import {rn} from "utils/numberUtils"; +import {capitalize} from "utils/stringUtils"; +import {si} from "utils/unitUtils"; export function overviewRegiments(state) { if (customization) return; diff --git a/src/modules/ui/relief-editor.js b/src/modules/ui/relief-editor.js index ec7fa6d9..e3cc76f5 100644 --- a/src/modules/ui/relief-editor.js +++ b/src/modules/ui/relief-editor.js @@ -1,7 +1,7 @@ -import {restoreDefaultEvents} from "/src/scripts/events"; -import {findCell} from "/src/utils/graphUtils"; -import {tip, showMainTip, clearMainTip} from "/src/scripts/tooltips"; -import {rn} from "/src/utils/numberUtils"; +import {restoreDefaultEvents} from "scripts/events"; +import {findCell} from "utils/graphUtils"; +import {tip, showMainTip, clearMainTip} from "scripts/tooltips"; +import {rn} from "utils/numberUtils"; export function editReliefIcon() { if (customization) return; diff --git a/src/modules/ui/rivers-creator.js b/src/modules/ui/rivers-creator.js index 5b561e8c..185b258a 100644 --- a/src/modules/ui/rivers-creator.js +++ b/src/modules/ui/rivers-creator.js @@ -1,8 +1,8 @@ -import {restoreDefaultEvents} from "/src/scripts/events"; -import {getPackPolygon, findCell} from "/src/utils/graphUtils"; -import {last} from "/src/utils/arrayUtils"; -import {tip, clearMainTip} from "/src/scripts/tooltips"; -import {rn} from "/src/utils/numberUtils"; +import {restoreDefaultEvents} from "scripts/events"; +import {getPackPolygon, findCell} from "utils/graphUtils"; +import {last} from "utils/arrayUtils"; +import {tip, clearMainTip} from "scripts/tooltips"; +import {rn} from "utils/numberUtils"; export function createRiver() { if (customization) return; diff --git a/src/modules/ui/rivers-editor.js b/src/modules/ui/rivers-editor.js index 97bc625a..8fe3df63 100644 --- a/src/modules/ui/rivers-editor.js +++ b/src/modules/ui/rivers-editor.js @@ -1,8 +1,8 @@ -import {findCell, getPackPolygon} from "/src/utils/graphUtils"; -import {tip, clearMainTip} from "/src/scripts/tooltips"; -import {getSegmentId} from "/src/utils/lineUtils"; -import {rn} from "/src/utils/numberUtils"; -import {rand} from "/src/utils/probabilityUtils"; +import {findCell, getPackPolygon} from "utils/graphUtils"; +import {tip, clearMainTip} from "scripts/tooltips"; +import {getSegmentId} from "utils/lineUtils"; +import {rn} from "utils/numberUtils"; +import {rand} from "utils/probabilityUtils"; export function editRiver(id) { if (customization) return; diff --git a/src/modules/ui/rivers-overview.js b/src/modules/ui/rivers-overview.js index 16186259..f477a8bb 100644 --- a/src/modules/ui/rivers-overview.js +++ b/src/modules/ui/rivers-overview.js @@ -1,4 +1,4 @@ -import {rn} from "/src/utils/numberUtils"; +import {rn} from "utils/numberUtils"; export function overviewRivers() { if (customization) return; diff --git a/src/modules/ui/routes-editor.js b/src/modules/ui/routes-editor.js index 8655e69c..858f7770 100644 --- a/src/modules/ui/routes-editor.js +++ b/src/modules/ui/routes-editor.js @@ -1,8 +1,8 @@ -import {tip, showMainTip, clearMainTip} from "/src/scripts/tooltips"; -import {getSegmentId} from "/src/utils/lineUtils"; -import {rn} from "/src/utils/numberUtils"; -import {getNextId} from "/src/utils/nodeUtils"; -import {round} from "/src/utils/stringUtils"; +import {tip, showMainTip, clearMainTip} from "scripts/tooltips"; +import {getSegmentId} from "utils/lineUtils"; +import {rn} from "utils/numberUtils"; +import {getNextId} from "utils/nodeUtils"; +import {round} from "utils/stringUtils"; export function editRoute(onClick) { if (customization) return; diff --git a/src/modules/ui/style.js b/src/modules/ui/style.js index b57c5c63..9e8355a3 100644 --- a/src/modules/ui/style.js +++ b/src/modules/ui/style.js @@ -1,7 +1,7 @@ -import {tip} from "/src/scripts/tooltips"; -import {rn} from "/src/utils/numberUtils"; -import {parseTransform} from "/src/utils/stringUtils"; -import {getBase64} from "/src/utils/functionUtils"; +import {tip} from "scripts/tooltips"; +import {rn} from "utils/numberUtils"; +import {parseTransform} from "utils/stringUtils"; +import {getBase64} from "utils/functionUtils"; // add available filters to lists { diff --git a/src/modules/ui/stylePresets.js b/src/modules/ui/stylePresets.js index 7d07e026..8f5fccd8 100644 --- a/src/modules/ui/stylePresets.js +++ b/src/modules/ui/stylePresets.js @@ -1,5 +1,6 @@ -import {tip} from "/src/scripts/tooltips"; -import {isJsonValid} from "/src/utils/stringUtils"; +import {tip} from "scripts/tooltips"; +import {isJsonValid} from "utils/stringUtils"; +import {byId} from "utils/shorthands"; const systemPresets = [ "default", @@ -337,7 +338,7 @@ function addStylePreset() { return tip("You cannot overwrite default preset, please change the name", false, "error"); const presetName = customPresetPrefix + desiredName; - applyOption(stylePreset, presetName, desiredName + " [custom]"); + applyDropdownOption(byId("stylePreset"), presetName, desiredName + " [custom]"); localStorage.setItem("presetStyle", presetName); localStorage.setItem(presetName, styleJSON); diff --git a/src/modules/ui/submap.js b/src/modules/ui/submap.js index 0e71381f..36180a7a 100644 --- a/src/modules/ui/submap.js +++ b/src/modules/ui/submap.js @@ -1,9 +1,9 @@ -import {byId} from "/src/utils/shorthands"; -import {clearMainTip} from "/src/scripts/tooltips"; -import {parseError} from "/src/utils/errorUtils"; -import {rn, minmax} from "/src/utils/numberUtils"; -import {debounce} from "/src/utils/functionUtils"; -import {restoreLayers} from "/src/layers"; +import {byId} from "utils/shorthands"; +import {clearMainTip} from "scripts/tooltips"; +import {parseError} from "utils/errorUtils"; +import {rn, minmax} from "utils/numberUtils"; +import {debounce} from "utils/functionUtils"; +import {restoreLayers} from "layers"; window.UISubmap = (function () { byId("submapPointsInput").addEventListener("input", function () { diff --git a/src/modules/ui/temperature-graph.js b/src/modules/ui/temperature-graph.js index 713b42e1..54444365 100644 --- a/src/modules/ui/temperature-graph.js +++ b/src/modules/ui/temperature-graph.js @@ -1,7 +1,7 @@ -import {tip} from "/src/scripts/tooltips"; -import {rn} from "/src/utils/numberUtils"; -import {round} from "/src/utils/stringUtils"; -import {convertTemperature} from "/src/utils/unitUtils"; +import {tip} from "scripts/tooltips"; +import {rn} from "utils/numberUtils"; +import {round} from "utils/stringUtils"; +import {convertTemperature} from "utils/unitUtils"; export function showBurgTemperatureGraph(id) { const b = pack.burgs[id]; diff --git a/src/modules/ui/tools.js b/src/modules/ui/tools.js index 29048392..dad6f4a1 100644 --- a/src/modules/ui/tools.js +++ b/src/modules/ui/tools.js @@ -1,13 +1,13 @@ -import {restoreDefaultEvents} from "/src/scripts/events"; -import {findCell} from "/src/utils/graphUtils"; -import {last} from "/src/utils/arrayUtils"; -import {tip, clearMainTip} from "/src/scripts/tooltips"; -import {rn} from "/src/utils/numberUtils"; -import {isCtrlClick} from "/src/utils/keyboardUtils"; -import {prompt} from "/src/scripts/prompt"; -import {getNextId} from "/src/utils/nodeUtils"; -import {P, generateSeed} from "/src/utils/probabilityUtils"; -import {turnLayerButtonOn} from "/src/layers"; +import {restoreDefaultEvents} from "scripts/events"; +import {findCell} from "utils/graphUtils"; +import {last} from "utils/arrayUtils"; +import {tip, clearMainTip} from "scripts/tooltips"; +import {rn} from "utils/numberUtils"; +import {isCtrlClick} from "utils/keyboardUtils"; +import {prompt} from "scripts/prompt"; +import {getNextId} from "utils/nodeUtils"; +import {P, generateSeed} from "utils/probabilityUtils"; +import {turnLayerButtonOn} from "layers"; toolsContent.addEventListener("click", function (event) { if (customization) return tip("Please exit the customization mode first", false, "warning"); diff --git a/src/modules/ui/units-editor.js b/src/modules/ui/units-editor.js index 886f8ef0..3a513824 100644 --- a/src/modules/ui/units-editor.js +++ b/src/modules/ui/units-editor.js @@ -1,7 +1,7 @@ -import {restoreDefaultEvents} from "/src/scripts/events"; -import {findCell} from "/src/utils/graphUtils"; -import {tip} from "/src/scripts/tooltips"; -import {prompt} from "/src/scripts/prompt"; +import {restoreDefaultEvents} from "scripts/events"; +import {findCell} from "utils/graphUtils"; +import {tip} from "scripts/tooltips"; +import {prompt} from "scripts/prompt"; export function editUnits() { closeDialogs("#unitsEditor, .stable"); diff --git a/src/modules/ui/world-configurator.js b/src/modules/ui/world-configurator.js index 0fb0baf6..9c025848 100644 --- a/src/modules/ui/world-configurator.js +++ b/src/modules/ui/world-configurator.js @@ -1,6 +1,6 @@ -import {tip} from "/src/scripts/tooltips"; -import {rn} from "/src/utils/numberUtils"; -import {round, parseTransform} from "/src/utils/stringUtils"; +import {tip} from "scripts/tooltips"; +import {rn} from "utils/numberUtils"; +import {round, parseTransform} from "utils/stringUtils"; export function editWorld() { if (customization) return; diff --git a/src/modules/ui/zones-editor.js b/src/modules/ui/zones-editor.js index 0fd9d023..19166c22 100644 --- a/src/modules/ui/zones-editor.js +++ b/src/modules/ui/zones-editor.js @@ -1,10 +1,10 @@ -import {restoreDefaultEvents} from "/src/scripts/events"; -import {findAll, findCell, getPackPolygon} from "/src/utils/graphUtils"; -import {unique} from "/src/utils/arrayUtils"; -import {tip, showMainTip, clearMainTip} from "/src/scripts/tooltips"; -import {rn} from "/src/utils/numberUtils"; -import {getNextId} from "/src/utils/nodeUtils"; -import {si} from "/src/utils/unitUtils"; +import {restoreDefaultEvents} from "scripts/events"; +import {findAll, findCell, getPackPolygon} from "utils/graphUtils"; +import {unique} from "utils/arrayUtils"; +import {tip, showMainTip, clearMainTip} from "scripts/tooltips"; +import {rn} from "utils/numberUtils"; +import {getNextId} from "utils/nodeUtils"; +import {si} from "utils/unitUtils"; export function editZones() { closeDialogs(); diff --git a/src/modules/zoom.js b/src/modules/zoom.js index 2163eefe..eb064207 100644 --- a/src/modules/zoom.js +++ b/src/modules/zoom.js @@ -1,4 +1,4 @@ -import {debounce} from "/src/utils/functionUtils"; +import {debounce} from "utils/functionUtils"; import {handleZoom, invokeActiveZooming} from "/src/modules/activeZooming"; // temporary expose to window diff --git a/src/scripts/events.js b/src/scripts/events.js index 7bdd00d1..1df13d73 100644 --- a/src/scripts/events.js +++ b/src/scripts/events.js @@ -1,8 +1,10 @@ -import {dragLegendBox} from "../modules/legend"; -import {findCell, findGridCell} from "../utils/graphUtils"; -import {tip, showMainTip} from "./tooltips"; -import {si, convertTemperature} from "../utils/unitUtils"; -import {debounce} from "../utils/functionUtils"; +import {dragLegendBox} from "modules/legend"; +import {debounce} from "utils/functionUtils"; +import {findCell, findGridCell} from "utils/graphUtils"; +import {byId} from "utils/shorthands"; +import {convertTemperature, si, getFriendlyHeight, getCellIdPrecipitation, getPopulationTip} from "utils/unitUtils"; +import {showMainTip, tip} from "./tooltips"; +import {updateCellInfo} from "modules/ui/cell-info"; export function restoreDefaultEvents() { Zoom.setZoomBehavior(); @@ -59,13 +61,13 @@ function showNotes(event) { const note = notes.find(note => note.id === id); if (note !== undefined && note.legend !== "") { - document.getElementById("notes").style.display = "block"; - document.getElementById("notesHeader").innerHTML = note.name; - document.getElementById("notesBody").innerHTML = note.legend; + byId("notes").style.display = "block"; + byId("notesHeader").innerHTML = note.name; + byId("notesBody").innerHTML = note.legend; } else if (!options.pinNotes && !markerEditor?.offsetParent) { - document.getElementById("notes").style.display = "none"; - document.getElementById("notesHeader").innerHTML = ""; - document.getElementById("notesBody").innerHTML = ""; + byId("notes").style.display = "none"; + byId("notesHeader").innerHTML = ""; + byId("notesBody").innerHTML = ""; } } @@ -90,13 +92,12 @@ function showMapTooltip(point, event, packCellId, gridCellId) { ? [pack.provinces, "province"] : [pack.states, "state"]; const i = +event.target.dataset.i; - if (event.shiftKey) highlightEmblemElement(type, g[i]); d3.select(event.target).raise(); d3.select(parent).raise(); const name = g[i].fullName || g[i].name; - tip(`${name} ${type} emblem. Click to edit. Hold Shift to show associated area or place`); + tip(`${name} ${type} emblem. Click to edit`); return; } @@ -161,7 +162,7 @@ function showMapTooltip(point, event, packCellId, gridCellId) { if (group === "ice") return tip("Click to edit the Ice"); // covering elements - if (layerIsOn("togglePrec") && land) tip("Annual Precipitation: " + getFriendlyPrecipitation(packCellId)); + if (layerIsOn("togglePrec") && land) tip("Annual Precipitation: " + getCellIdPrecipitation(packCellId)); else if (layerIsOn("togglePopulation")) tip(getPopulationTip(packCellId)); else if (layerIsOn("toggleTemp")) tip("Temperature: " + convertTemperature(grid.cells.temp[gridCellId])); else if (layerIsOn("toggleBiomes") && pack.cells.biome[packCellId]) { @@ -180,13 +181,23 @@ function showMapTooltip(point, event, packCellId, gridCellId) { const province = pack.cells.province[packCellId]; const prov = province ? pack.provinces[province].fullName + ", " : ""; tip(prov + stateName); - if (document.getElementById("statesEditor")?.offsetParent) highlightEditorLine(statesEditor, state); - if (document.getElementById("diplomacyEditor")?.offsetParent) highlightEditorLine(diplomacyEditor, state); - if (document.getElementById("militaryOverview")?.offsetParent) highlightEditorLine(militaryOverview, state); - if (document.getElementById("provincesEditor")?.offsetParent) highlightEditorLine(provincesEditor, province); + if (byId("statesEditor")?.offsetParent) highlightEditorLine(statesEditor, state); + if (byId("diplomacyEditor")?.offsetParent) highlightEditorLine(diplomacyEditor, state); + if (byId("militaryOverview")?.offsetParent) highlightEditorLine(militaryOverview, state); + if (byId("provincesEditor")?.offsetParent) highlightEditorLine(provincesEditor, province); } else if (layerIsOn("toggleCultures") && pack.cells.culture[packCellId]) { const culture = pack.cells.culture[packCellId]; tip("Culture: " + pack.cultures[culture].name); - if (document.getElementById("culturesEditor")?.offsetParent) highlightEditorLine(culturesEditor, culture); + if (byId("culturesEditor")?.offsetParent) highlightEditorLine(culturesEditor, culture); } else if (layerIsOn("toggleHeight")) tip("Height: " + getFriendlyHeight(point)); } + +function highlightEditorLine(editor, id, timeout = 10000) { + Array.from(editor.getElementsByClassName("states hovered")).forEach(el => el.classList.remove("hovered")); // clear all hovered + const hovered = Array.from(editor.querySelectorAll("div")).find(el => el.dataset.id == id); + if (hovered) hovered.classList.add("hovered"); // add hovered class + if (timeout) + setTimeout(() => { + hovered && hovered.classList.remove("hovered"); + }, timeout); +} diff --git a/src/scripts/listeners.ts b/src/scripts/listeners.ts index 9e51ecbe..83ca015e 100644 --- a/src/scripts/listeners.ts +++ b/src/scripts/listeners.ts @@ -1,12 +1,20 @@ import {PRODUCTION} from "../constants"; import {assignLockBehavior} from "./options/lock"; import {addTooptipListers} from "./tooltips"; +import {assignSpeakerBehavior} from "./speaker"; +// @ts-ignore +import {addResizeListener} from "modules/ui/options"; export function addGlobalListeners() { - PRODUCTION && registerServiceWorker(); - PRODUCTION && addInstallationPrompt(); + if (PRODUCTION) { + registerServiceWorker(); + addInstallationPrompt(); + addBeforeunloadListener(); + } assignLockBehavior(); addTooptipListers(); + addResizeListener(); + assignSpeakerBehavior(); } function registerServiceWorker() { @@ -30,3 +38,7 @@ function addInstallationPrompt() { {once: true} ); } + +function addBeforeunloadListener() { + window.onbeforeunload = () => "Are you sure you want to navigate away?"; +} diff --git a/src/scripts/options/about.js b/src/scripts/options/about.js new file mode 100644 index 00000000..7ce248a5 --- /dev/null +++ b/src/scripts/options/about.js @@ -0,0 +1,49 @@ +// show info about the generator in a popup +export function showAboutDialog() { + const Discord = link("https://discordapp.com/invite/X7E84HU", "Discord"); + const Reddit = link("https://www.reddit.com/r/FantasyMapGenerator", "Reddit"); + const Patreon = link("https://www.patreon.com/azgaar", "Patreon"); + const Armoria = link("https://azgaar.github.io/Armoria", "Armoria"); + const QuickStart = link( + "https://github.com/Azgaar/Fantasy-Map-Generator/wiki/Quick-Start-Tutorial", + "Quick start tutorial" + ); + const QAA = link("https://github.com/Azgaar/Fantasy-Map-Generator/wiki/Q&A", "Q&A page"); + const VideoTutorial = link("https://youtube.com/playlist?list=PLtgiuDC8iVR2gIG8zMTRn7T_L0arl9h1C", "Video tutorial"); + + alertMessage.innerHTML = /* html */ `Fantasy Map Generator (FMG) is a free open-source application. It means that you own all created maps and can use them as + you wish. + +

+ The development is community-backed, you can donate on ${Patreon}. You can also help creating overviews, tutorials and spreding the word about the + Generator. +

+ +

+ The best way to get help is to contact the community on ${Discord} and ${Reddit}. Before asking questions, please check out the ${QuickStart}, the ${QAA}, + and ${VideoTutorial}. +

+ +

Check out our another project: ${Armoria} — heraldry generator and editor.

+ + `; + + $("#alert").dialog({ + resizable: false, + title: document.title, + width: "28em", + buttons: { + OK: function () { + $(this).dialog("close"); + } + }, + position: {my: "center", at: "center", of: "svg"} + }); +} diff --git a/src/scripts/options/lock.ts b/src/scripts/options/lock.ts index 13243e5a..ece16f6a 100644 --- a/src/scripts/options/lock.ts +++ b/src/scripts/options/lock.ts @@ -29,8 +29,8 @@ function showTooltip(this: Element, event: Event) { // lock option from regeneration on page refresh export function lock(id: string) { const $input = document.querySelector('[data-stored="' + id + '"]'); - if ($input && $input instanceof HTMLInputElement === false) { - store(id, ($input as HTMLInputElement).value); + if ($input && $input instanceof HTMLInputElement) { + store(id, $input.value); } const $lock = document.getElementById("lock_" + id); diff --git a/src/scripts/speaker.ts b/src/scripts/speaker.ts new file mode 100644 index 00000000..d39b000b --- /dev/null +++ b/src/scripts/speaker.ts @@ -0,0 +1,22 @@ +import {getInputNumber} from "utils/nodeUtils"; + +export function assignSpeakerBehavior() { + Array.from(document.getElementsByClassName("speaker")).forEach($speaker => { + const $sibling = $speaker.previousElementSibling; + $speaker.addEventListener("click", () => { + if ($sibling instanceof HTMLInputElement) { + speak($sibling.value); + } + }); + }); +} + +function speak(str: string) { + const speaker = new SpeechSynthesisUtterance(str); + const voices = speechSynthesis.getVoices(); + if (voices.length) { + const voiceId = getInputNumber("speakerVoice"); + speaker.voice = voices[voiceId]; + } + speechSynthesis.speak(speaker); +} diff --git a/src/utils/nodeUtils.ts b/src/utils/nodeUtils.ts index 4befb5d4..c927ea17 100644 --- a/src/utils/nodeUtils.ts +++ b/src/utils/nodeUtils.ts @@ -5,3 +5,18 @@ export function getNextId(core: string, index = 1) { while (byId(core + index)) index++; return core + index; } + +export function getInputValue(id: string) { + return (byId(id) as HTMLInputElement)?.value; +} + +export function getInputNumber(id: string) { + return (byId(id) as HTMLInputElement)?.valueAsNumber; +} + +// apply drop-down menu option. If the value is not in options, add it +export function applyDropdownOption($select: HTMLSelectElement, value: string, name = value) { + const isExisting = Array.from($select.options).some(o => o.value === value); + if (!isExisting) $select.options.add(new Option(name, value)); + $select.value = value; +} diff --git a/src/utils/unitUtils.ts b/src/utils/unitUtils.ts index 2301b30c..1118a6fd 100644 --- a/src/utils/unitUtils.ts +++ b/src/utils/unitUtils.ts @@ -1,23 +1,10 @@ -import {byId} from "./shorthands"; import {rn} from "./numberUtils"; +import {findCell, findGridCell} from "./graphUtils"; +import {getInputNumber, getInputValue} from "./nodeUtils"; -// conver temperature from °C to other scales -const temperatureConversionMap: Dict<(temp: number) => string> = { - "°C": temp => rn(temp) + "°C", - "°F": temp => rn((temp * 9) / 5 + 32) + "°F", - K: temp => rn(temp + 273.15) + "K", - "°R": temp => rn(((temp + 273.15) * 9) / 5) + "°R", - "°De": temp => rn(((100 - temp) * 3) / 2) + "°De", - "°N": temp => rn((temp * 33) / 100) + "°N", - "°Ré": temp => rn((temp * 4) / 5) + "°Ré", - "°Rø": temp => rn((temp * 21) / 40 + 7.5) + "°Rø" -}; - -export function convertTemperature(temp: number) { - const scale = (byId("temperatureScale") as HTMLInputElement)?.value || "°C"; - const conversionFn = temperatureConversionMap[scale]; - return conversionFn(temp); -} +// *** +// SI +// *** // corvert number to short string with SI postfix export function si(n: number) { @@ -39,3 +26,98 @@ export function siToInteger(value: string) { if (metric === "B") return rn(number * 1e9); return parseInt(value); } + +// *** +// Temperature +// *** + +// conver temperature from °C to other scales +const temperatureConversionMap: Dict<(temp: number) => string> = { + "°C": temp => rn(temp) + "°C", + "°F": temp => rn((temp * 9) / 5 + 32) + "°F", + K: temp => rn(temp + 273.15) + "K", + "°R": temp => rn(((temp + 273.15) * 9) / 5) + "°R", + "°De": temp => rn(((100 - temp) * 3) / 2) + "°De", + "°N": temp => rn((temp * 33) / 100) + "°N", + "°Ré": temp => rn((temp * 4) / 5) + "°Ré", + "°Rø": temp => rn((temp * 21) / 40 + 7.5) + "°Rø" +}; + +export function convertTemperature(temp: number) { + const scale = getInputValue("temperatureScale") || "°C"; + const conversionFn = temperatureConversionMap[scale]; + return conversionFn(temp); +} + +// *** +// Elevation +// *** + +// get user-friendly (real-world) height value from coordinates +export function getFriendlyHeight([x, y]: [number, number]) { + // @ts-expect-error pack is a global variable + const packH = pack.cells.h[findCell(x, y)]; + // @ts-expect-error grid is a global variable + const gridH = grid.cells.h[findGridCell(x, y, grid)]; + const h = packH < 20 ? gridH : packH; + return getHeight(h); +} + +const heightUnitMap: Dict = { + m: 1, // meters + ft: 3.281, // feet + f: 0.5468 // fathoms +}; + +export function getHeight(h: number, abs: boolean = false) { + const unit = getInputValue("heightUnit"); + const unitRatio = heightUnitMap[unit] || 1; + const exponent = getInputNumber("heightExponentInput"); + + let height = -990; + if (h >= 20) height = Math.pow(h - 18, exponent); + else if (h < 20 && h > 0) height = ((h - 20) / h) * 50; + + if (abs) height = Math.abs(height); + return rn(height * unitRatio) + " " + unit; +} + +// *** +// Precipitation +// *** + +function getFriendlyPrecipitation(prec: number) { + return prec * 100 + " mm"; +} + +// get user-friendly (real-world) precipitation value from map data +export function getCellIdPrecipitation(gridCellId: number) { + // @ts-expect-error pack and grid are global variables + const prec = grid.cells.prec[pack.cells.g[gridCellId]]; + return getFriendlyPrecipitation(prec); +} + +// *** +// Population +// *** + +export function getCellPopulation(cellId: number) { + // @ts-expect-error pack and populationRate are global variables + const rural = pack.cells.pop[cellId] * populationRate; + // @ts-expect-error pack is a global variable + const burg = pack.cells.burg[cellId]; + // @ts-expect-error pack and populationRate and urbanization are global variables + const urban = burg ? pack.burgs[burg].population * populationRate * urbanization : 0; + return [rural, urban]; +} + +// get user-friendly (real-world) population value from map data +export function getFriendlyPopulation(cellId: number) { + const [rural, urban] = getCellPopulation(cellId); + return `${si(rural + urban)} (${si(rural)} rural, urban ${si(urban)})`; +} + +export function getPopulationTip(cellId: number) { + const [rural, urban] = getCellPopulation(cellId); + return `Cell population: ${si(rural + urban)}; Rural: ${si(rural)}; Urban: ${si(urban)}`; +} diff --git a/vite.config.js b/vite.config.js index fd2da414..c7be3e5c 100644 --- a/vite.config.js +++ b/vite.config.js @@ -16,6 +16,7 @@ export default defineConfig({ {find: "libs", replacement: path.resolve(pathName, "./src/libs")}, {find: "modules", replacement: path.resolve(pathName, "./src/modules")}, {find: "modules", replacement: path.resolve(pathName, "./src/modules")}, + {find: "scripts", replacement: path.resolve(pathName, "./src/scripts")}, {find: "utils", replacement: path.resolve(pathName, "./src/utils")} ] }