contrapunctus/MapComplete
1
0
Fork 0
forked from MapComplete/MapComplete
Code Pull requests Activity

Merge develop

Browse source
This commit is contained in:
Pieter Vander Vennet 2024-08-22 03:01:21 +02:00
commit ee77dd0fc9
288 changed files with 7485 additions and 28619 deletions
Download patch file Download diff file Expand all files Collapse all files

2
src/UI/Map/Icon.svelte
View file

@ -161,7 +161,7 @@
<Airport {color} class={clss}/>
{:else if Utils.isEmoji(icon)}
<span style={`font-size: ${emojiHeight}px; line-height: ${emojiHeight}px`}>
{icon}
{icon}
</span>
{:else}

8
src/UI/Map/RasterLayerHandler.ts
View file

@ -59,8 +59,12 @@ class SingleBackgroundHandler {
"map moved and not been used for",
SingleBackgroundHandler.DEACTIVATE_AFTER
)
if (map.getLayer(<string>this._targetLayer.properties.id)) {
map.removeLayer(<string>this._targetLayer.properties.id)
try {
if (map.getLayer(<string>this._targetLayer.properties.id)) {
map.removeLayer(<string>this._targetLayer.properties.id)
}
} catch (e) {
console.warn("Could not (try to) remove the raster layer", e)
}
}

79
src/UI/Map/RasterLayerOverview.svelte
View file

@ -12,11 +12,13 @@
import Translations from "../i18n/Translations"
import Tr from "../Base/Tr.svelte"
import TitledPanel from "../Base/TitledPanel.svelte"
import Loading from "../Base/Loading.svelte"
export let availableLayers: Store<RasterLayerPolygon[]>
export let availableLayers: { store: Store<RasterLayerPolygon[]> }
export let mapproperties: MapProperties
export let userstate: UserRelatedState
export let map: Store<MlMap>
let _availableLayers = availableLayers.store
/**
* Used to toggle the background layers on/off
*/
@ -32,7 +34,7 @@
function availableForCategory(type: CategoryType): Store<RasterLayerPolygon[]> {
const keywords = categories[type]
return availableLayers.mapD((available) =>
return _availableLayers.mapD((available) =>
available.filter((layer) => keywords.indexOf(<EliCategory>layer.properties.category) >= 0)
)
}
@ -53,39 +55,42 @@
<TitledPanel>
<Tr slot="title" t={Translations.t.general.backgroundMap} />
<div class="grid h-full w-full grid-cols-1 gap-2 md:grid-cols-2">
<RasterLayerPicker
availableLayers={photoLayers}
favourite={getPref("photo")}
{map}
{mapproperties}
on:appliedLayer={onApply}
{visible}
/>
<RasterLayerPicker
availableLayers={mapLayers}
favourite={getPref("map")}
{map}
{mapproperties}
on:appliedLayer={onApply}
{visible}
/>
<RasterLayerPicker
availableLayers={osmbasedmapLayers}
favourite={getPref("osmbasedmap")}
{map}
{mapproperties}
on:appliedLayer={onApply}
{visible}
/>
<RasterLayerPicker
availableLayers={otherLayers}
favourite={getPref("other")}
{map}
{mapproperties}
on:appliedLayer={onApply}
{visible}
/>
</div>
{#if $_availableLayers?.length < 1}
<Loading />
{:else}
<div class="grid h-full w-full grid-cols-1 gap-2 md:grid-cols-2">
<RasterLayerPicker
availableLayers={$photoLayers}
favourite={getPref("photo")}
{map}
{mapproperties}
on:appliedLayer={onApply}
{visible}
/>
<RasterLayerPicker
availableLayers={$mapLayers}
favourite={getPref("map")}
{map}
{mapproperties}
on:appliedLayer={onApply}
{visible}
/>
<RasterLayerPicker
availableLayers={$osmbasedmapLayers}
favourite={getPref("osmbasedmap")}
{map}
{mapproperties}
on:appliedLayer={onApply}
{visible}
/>
<RasterLayerPicker
availableLayers={$otherLayers}
favourite={getPref("other")}
{map}
{mapproperties}
on:appliedLayer={onApply}
{visible}
/>
</div>
{/if}
</TitledPanel>

33
src/UI/Map/RasterLayerPicker.svelte
View file

@ -9,7 +9,7 @@
/***
* Chooses a background-layer out of available options
*/
export let availableLayers: Store<RasterLayerPolygon[]>
export let availableLayers: RasterLayerPolygon[]
export let mapproperties: MapProperties
export let map: Store<MlMap>
@ -19,23 +19,19 @@
export let favourite: UIEventSource<string> | undefined = undefined
let rasterLayer = new UIEventSource<RasterLayerPolygon>(availableLayers.data?.[0])
let hasLayers = true
onDestroy(
availableLayers.addCallbackAndRun((layers) => {
if (layers === undefined || layers.length === 0) {
hasLayers = false
return
}
hasLayers = true
rasterLayer.setData(layers[0])
})
let rasterLayer = new UIEventSource<RasterLayerPolygon>(availableLayers[0])
let rasterLayerId = rasterLayer.sync(
(l) => l?.properties?.id,
[],
(id) => availableLayers.find((l) => l.properties.id === id)
)
rasterLayer.setData(availableLayers[0])
$: rasterLayer.setData(availableLayers[0])
if (favourite) {
onDestroy(
favourite.addCallbackAndRunD((favourite) => {
const fav = availableLayers.data?.find((l) => l.properties.id === favourite)
const fav = availableLayers?.find((l) => l.properties.id === favourite)
if (!fav) {
return
}
@ -56,13 +52,14 @@
onDestroy(
visible?.addCallbackAndRunD((visible) => {
if (visible) {
rasterLayerOnMap.setData(rasterLayer.data ?? availableLayers.data[0])
rasterLayerOnMap.setData(rasterLayer.data ?? availableLayers[0])
} else {
rasterLayerOnMap.setData(undefined)
}
})
)
}
function apply() {
mapproperties.rasterLayer.setData(rasterLayer.data)
dispatch("appliedLayer")
@ -75,7 +72,7 @@
}
</script>
{#if hasLayers}
{#if availableLayers?.length > 0}
<form class="flex h-full w-full flex-col" on:submit|preventDefault={() => {}}>
<button
tabindex="-1"
@ -92,9 +89,9 @@
/>
</span>
</button>
<select bind:value={$rasterLayer} class="w-full" on:keydown={handleKeyPress}>
{#each $availableLayers as availableLayer}
<option value={availableLayer}>
<select bind:value={$rasterLayerId} class="w-full" on:keydown={handleKeyPress}>
{#each availableLayers as availableLayer}
<option value={availableLayer.properties.id}>
{availableLayer.properties.name}
</option>
{/each}