diff --git a/index.html b/index.html index 739b1614..880521c0 100644 --- a/index.html +++ b/index.html @@ -439,7 +439,7 @@ Political map diff --git a/main.js b/main.js index eefdcb55..08296b39 100644 --- a/main.js +++ b/main.js @@ -315,6 +315,7 @@ async function generateMapOnLoad() { await applyStyleOnLoad(); // apply previously selected default or custom style await generate(); // generate map applyLayersPreset(); // apply saved layers preset and reder layers + drawLayers(); fitMapToScreen(); focusOn(); // focus on point, cell or burg from MFCG based on url searchParams } diff --git a/modules/ui/layers.js b/modules/ui/layers.js index 3d354529..c863c6d0 100644 --- a/modules/ui/layers.js +++ b/modules/ui/layers.js @@ -101,20 +101,37 @@ function restoreCustomPresets() { // run on map generation function applyLayersPreset() { const preset = localStorage.getItem("preset") || byId("layersPreset").value; - changeLayersPreset(preset); + setLayersPreset(preset); + + const layers = presets[preset]; // layers to be turned on + document.querySelectorAll("#mapLayers > li").forEach(el => { + const shouldBeOn = layers.includes(el.id); + if (shouldBeOn) el.classList.remove("buttonoff"); + else el.classList.add("buttonoff"); + }); } -// toggle layers on preset change -function changeLayersPreset(preset) { - const layers = presets[preset]; // layers to be turned on - layersPreset.value = preset; +function setLayersPreset(preset) { + byId("layersPreset").value = preset; localStorage.setItem("preset", preset); + const isDefault = getDefaultPresets()[preset]; byId("removePresetButton").style.display = isDefault ? "none" : "inline-block"; byId("savePresetButton").style.display = "none"; +} + +// toggle layers on manual preset change +function handleLayersPresetChange(preset) { + setLayersPreset(preset); + + const layers = presets[preset]; // layers to be turned on + document.querySelectorAll("#mapLayers > li").forEach(el => { + const isOn = layerIsOn(el.id); + const shouldBeOn = layers.includes(el.id); + if (shouldBeOn && !isOn) el.click(); + if (isOn && !shouldBeOn) el.click(); + }); - document.querySelectorAll("#mapLayers > li").forEach(e => (e.className = layers.includes(e.id) ? null : "buttonoff")); - drawLayers(); if (byId("canvas3d")) setTimeout(() => ThreeD.update(), 400); }