Merge master

src/UI/Map/MaplibreMap.svelte

@@ -55,24 +55,24 @@
       center: { lng: lon, lat },
       maxZoom: 24,
       interactive: true,
-      attributionControl: false
+      attributionControl: false,
     }
     _map = new maplibre.Map(options)
     window.requestAnimationFrame(() => {
       _map.resize()
     })
 
-    _map.on("load", function() {
+    _map.on("load", function () {
       _map.resize()
       const canvas = _map.getCanvas()
       canvas.addEventListener("webglcontextlost", (e) => {
         console.warn("A MapLibreMap lost their context. Recovery is", autorecovery, e)
-        try{
+        try {
           _map?.remove()
-        }catch (e) {
+        } catch (e) {
           console.debug("Could not remove map due to", e)
         }
-        if(autorecovery){
+        if (autorecovery) {
           requestAnimationFrame(() => {
             console.warn("Attempting map recovery")
             _map = new maplibre.Map(options)
@@ -92,23 +92,19 @@
     map.set(_map)
   }
 
-
   onMount(() => initMap())
 
-
   onDestroy(async () => {
     await Utils.waitFor(100)
-    requestAnimationFrame(
-      () => {
-        try {
-          _map?.remove()
-          console.log("Removed map")
-          map = null
-        } catch (e) {
-          console.error("Could not destroy map")
-        }
+    requestAnimationFrame(() => {
+      try {
+        _map?.remove()
+        console.log("Removed map")
+        map = null
+      } catch (e) {
+        console.error("Could not destroy map")
       }
-    )
+    })
   })
 </script>
 

src/UI/Map/RasterLayerOverview.svelte

@@ -52,7 +52,7 @@
 </script>
 
 <TitledPanel>
-      <Tr slot="title" t={Translations.t.general.backgroundMap} />
+  <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

src/UI/Map/RasterLayerPicker.svelte

@@ -77,7 +77,11 @@
 
 {#if hasLayers}
   <form class="flex h-full w-full flex-col" on:submit|preventDefault={() => {}}>
-    <button tabindex="-1" on:click={() => apply()} class="m-0 p-0 rounded-none h-full w-full cursor-pointer border-none">
+    <button
+      tabindex="-1"
+      on:click={() => apply()}
+      class="m-0 h-full w-full cursor-pointer rounded-none border-none p-0"
+    >
       <span class="pointer-events-none relative h-full w-full">
         <OverlayMap
           interactive={false}

src/UI/Map/ShowDataLayer.ts

@@ -152,8 +152,8 @@ class PointRenderingLayer {
         }
         const el = html.ConstructElement()
 
-        store.addCallbackAndRunD(tags => {
-            if(tags._deleted === "yes"){
+        store.addCallbackAndRunD((tags) => {
+            if (tags._deleted === "yes") {
                 html.SetClass("grayscale")
             }
         })