diff --git a/website/src/lib/components/layer-control/LayerControl.svelte b/website/src/lib/components/layer-control/LayerControl.svelte index dbc22a9c..98db64b7 100644 --- a/website/src/lib/components/layer-control/LayerControl.svelte +++ b/website/src/lib/components/layer-control/LayerControl.svelte @@ -133,17 +133,6 @@ selectedBasemap.set(value); }); - function removeOverlayLayer(id: string) { - if ($map) { - let overlay = $customLayers.hasOwnProperty(id) ? $customLayers[id].value : overlays[id]; - if (overlay.layers) { - $map.removeImport(id); - } else { - $map.removeLayer(id); - } - } - } - let open = false; function openLayerControl() { open = true; diff --git a/website/src/lib/components/layer-control/LayerControlSettings.svelte b/website/src/lib/components/layer-control/LayerControlSettings.svelte index 47ba04d7..1cde4c06 100644 --- a/website/src/lib/components/layer-control/LayerControlSettings.svelte +++ b/website/src/lib/components/layer-control/LayerControlSettings.svelte @@ -9,8 +9,14 @@ import * as Select from '$lib/components/ui/select'; import { Slider } from '$lib/components/ui/slider'; - import { basemapTree, overlays, overlayTree, overpassTree } from '$lib/assets/layers'; - import { isSelected } from '$lib/components/layer-control/utils'; + import { + basemapTree, + defaultBasemap, + overlays, + overlayTree, + overpassTree + } from '$lib/assets/layers'; + import { getLayers, isSelected, toggle } from '$lib/components/layer-control/utils'; import { settings } from '$lib/db'; import { _ } from 'svelte-i18n'; @@ -22,6 +28,7 @@ selectedBasemapTree, selectedOverlayTree, selectedOverpassTree, + currentBasemap, currentOverlays, customLayers, opacities @@ -46,6 +53,30 @@ } } + $: if ($selectedBasemapTree && $currentBasemap) { + if (!isSelected($selectedBasemapTree, $currentBasemap)) { + if (!isSelected($selectedBasemapTree, defaultBasemap)) { + $selectedBasemapTree = toggle($selectedBasemapTree, defaultBasemap); + } + $currentBasemap = defaultBasemap; + } + } + + $: if ($selectedOverlayTree && $currentOverlays) { + let overlayLayers = getLayers($currentOverlays); + let toRemove = Object.entries(overlayLayers).filter( + ([id, checked]) => checked && !isSelected($selectedOverlayTree, id) + ); + if (toRemove.length > 0) { + currentOverlays.update((tree) => { + toRemove.forEach(([id]) => { + toggle(tree, id); + }); + return tree; + }); + } + } + $: if ($selectedOverlay) { setOpacityFromSelection(); } diff --git a/website/src/lib/components/layer-control/utils.ts b/website/src/lib/components/layer-control/utils.ts index cd682a26..937f2d54 100644 --- a/website/src/lib/components/layer-control/utils.ts +++ b/website/src/lib/components/layer-control/utils.ts @@ -39,4 +39,15 @@ export function isSelected(node: LayerTreeType, id: string) { }); } +export function toggle(node: LayerTreeType, id: string) { + Object.keys(node).forEach((key) => { + if (key === id) { + node[key] = !node[key]; + } else if (typeof node[key] !== "boolean") { + toggle(node[key], id); + } + }); + return node; +} + export const customBasemapUpdate = writable(0); \ No newline at end of file