Merge master

src/UI/BigComponents/ThemeButton.svelte

@@ -7,7 +7,7 @@
   import type { LayoutInformation } from "../../Models/ThemeConfig/LayoutConfig"
   import Tr from "../Base/Tr.svelte"
   import SubtleLink from "../Base/SubtleLink.svelte"
-    import Translations from "../i18n/Translations"
+  import Translations from "../i18n/Translations"
 
   export let theme: LayoutInformation
   export let isCustom: boolean = false

src/UI/BigComponents/ThemesList.svelte

@@ -29,7 +29,7 @@
     <div class="gap-4 md:grid md:grid-flow-row md:grid-cols-2 lg:grid-cols-3">
       {#each filteredThemes as theme (theme.id)}
         {#if theme !== undefined && !(hideThemes && theme?.hideFromOverview)}
-        <!-- TODO: doesn't work if first theme is hidden -->
+          <!-- TODO: doesn't work if first theme is hidden -->
           {#if theme === firstTheme && !isCustom && $search !== "" && $search !== undefined}
             <ThemeButton
               {theme}

src/UI/Input/FileSelectorButton.ts

@@ -1,6 +1,6 @@
 import BaseUIElement from "../BaseUIElement"
-import {InputElement} from "./InputElement"
-import {UIEventSource} from "../../Logic/UIEventSource"
+import { InputElement } from "./InputElement"
+import { UIEventSource } from "../../Logic/UIEventSource"
 
 /**
  * @deprecated
@@ -67,20 +67,18 @@ export default class FileSelectorButton extends InputElement<FileList> {
             if (actualInputElement.files !== null) {
                 self._value.setData(actualInputElement.files)
             }
-            actualInputElement.classList.remove("glowing-shadow");
+            actualInputElement.classList.remove("glowing-shadow")
 
             e.preventDefault()
         })
 
         el.appendChild(actualInputElement)
 
-        function setDrawAttention(isOn: boolean){
-            if(isOn){
+        function setDrawAttention(isOn: boolean) {
+            if (isOn) {
                 label.classList.add("glowing-shadow")
-
-            }else{
+            } else {
                 label.classList.remove("glowing-shadow")
-
             }
         }
 
@@ -90,10 +88,9 @@ export default class FileSelectorButton extends InputElement<FileList> {
             setDrawAttention(true)
             // Style the drag-and-drop as a "copy file" operation.
             event.dataTransfer.dropEffect = "copy"
-
         })
 
-        window.document.addEventListener("dragenter", () =>{
+        window.document.addEventListener("dragenter", () => {
             setDrawAttention(true)
         })
 
@@ -101,7 +98,6 @@ export default class FileSelectorButton extends InputElement<FileList> {
             setDrawAttention(false)
         })
 
-
         el.addEventListener("drop", (event) => {
             event.stopPropagation()
             event.preventDefault()

src/UI/Map/MaplibreMap.svelte

@@ -1,79 +1,73 @@
 <script lang="ts">
-    import {onDestroy, onMount} from "svelte"
-    import * as maplibre from "maplibre-gl"
-    import type {Map} from "maplibre-gl"
-    import type {Readable, Writable} from "svelte/store"
-    import {get, writable} from "svelte/store"
-    import {AvailableRasterLayers} from "../../Models/RasterLayers"
-    import {Utils} from "../../Utils";
+  import { onDestroy, onMount } from "svelte"
+  import * as maplibre from "maplibre-gl"
+  import type { Map } from "maplibre-gl"
+  import type { Readable, Writable } from "svelte/store"
+  import { get, writable } from "svelte/store"
+  import { AvailableRasterLayers } from "../../Models/RasterLayers"
+  import { Utils } from "../../Utils"
 
-/**
- * The 'MaplibreMap' maps various event sources onto MapLibre.
- */
+  /**
+   * The 'MaplibreMap' maps various event sources onto MapLibre.
+   */
 
+  /**
+   * Beware: this map will _only_ be set by this component
+   * It should thus be treated as a 'store' by external parties
+   */
+  export let map: Writable<Map>
 
-    /**
-     * Beware: this map will _only_ be set by this component
-     * It should thus be treated as a 'store' by external parties
-     */
-    export let map: Writable<Map>
+  let container: HTMLElement
 
-    let container: HTMLElement
+  export let attribution = false
+  export let center: { lng: number; lat: number } | Readable<{ lng: number; lat: number }> =
+    writable({ lng: 0, lat: 0 })
+  export let zoom: Readable<number> = writable(1)
 
+  const styleUrl = AvailableRasterLayers.maplibre.properties.url
 
-    export let attribution = false
-    export let center: {lng: number, lat: number} | Readable<{ lng: number; lat: number }> = writable({lng: 0, lat: 0})
-    export let zoom: Readable<number> = writable(1)
-
-    const styleUrl = AvailableRasterLayers.maplibre.properties.url
-
-    let _map: Map
-    onMount(() => {
-
-        let _center: {lng: number, lat: number}
-        if(typeof center["lng"] === "number" && typeof center["lat"] === "number"){
-            _center = <any> center
-        }else{
-            _center = get(<any> center)
-        }
-        
-
-        _map = new maplibre.Map({
-            container,
-            style: styleUrl,
-            zoom: get(zoom),
-            center: _center,
-            maxZoom: 24,
-            interactive: true,
-            attributionControl: false,
-
-        });
-
-        _map.on("load", function () {
-            _map.resize()
-        })
-        map.set(_map)
+  let _map: Map
+  onMount(() => {
+    let _center: { lng: number; lat: number }
+    if (typeof center["lng"] === "number" && typeof center["lat"] === "number") {
+      _center = <any>center
+    } else {
+      _center = get(<any>center)
+    }
 
+    _map = new maplibre.Map({
+      container,
+      style: styleUrl,
+      zoom: get(zoom),
+      center: _center,
+      maxZoom: 24,
+      interactive: true,
+      attributionControl: false,
     })
-    onDestroy(async () => {
-        await Utils.waitFor(250);
-        if (_map) _map.remove();
-        map = null;
-    });
 
+    _map.on("load", function () {
+      _map.resize()
+    })
+    map.set(_map)
+  })
+  onDestroy(async () => {
+    await Utils.waitFor(250)
+    if (_map) _map.remove()
+    map = null
+  })
 </script>
 
 <svelte:head>
-    <link
-            href="./maplibre-gl.css"
-            rel="stylesheet"
-    />
+  <link href="./maplibre-gl.css" rel="stylesheet" />
 </svelte:head>
 
-<div bind:this={container} class="map" id="map" style="      position: relative;
+<div
+  bind:this={container}
+  class="map"
+  id="map"
+  style="      position: relative;
         top: 0;
         bottom: 0;
         width: 100%;
-        height: 100%;"></div>
-
-
+        height: 100%;"
+/>

src/UI/Map/ShowDataLayer.ts

@@ -161,13 +161,16 @@ class PointRenderingLayer {
             })
         }
 
-        const marker = new Marker({ element: el}).setLngLat(loc).setOffset(iconAnchor).addTo(this._map)
+        const marker = new Marker({ element: el })
+            .setLngLat(loc)
+            .setOffset(iconAnchor)
+            .addTo(this._map)
         store
             .map((tags) => this._config.pitchAlignment.GetRenderValue(tags).Subs(tags).txt)
-            .addCallbackAndRun((pitchAligment) => marker.setPitchAlignment(<any> pitchAligment))
+            .addCallbackAndRun((pitchAligment) => marker.setPitchAlignment(<any>pitchAligment))
         store
             .map((tags) => this._config.rotationAlignment.GetRenderValue(tags).Subs(tags).txt)
-            .addCallbackAndRun((pitchAligment) => marker.setRotationAlignment(<any> pitchAligment))
+            .addCallbackAndRun((pitchAligment) => marker.setRotationAlignment(<any>pitchAligment))
         if (feature.geometry.type === "Point") {
             // When the tags get 'pinged', check that the location didn't change
             store.addCallbackAndRunD(() => {
@@ -458,7 +461,6 @@ export default class ShowDataLayer {
         features: FeatureSource,
         doShowLayer?: Store<boolean>
     ): ShowDataLayer {
-
         return new ShowDataLayer(map, {
             layer: ShowDataLayer.rangeLayer,
             features,

src/UI/Popup/TagRendering/FreeformInput.svelte

@@ -38,7 +38,7 @@
   }
 </script>
 
-<div class="inline-flex flex-col w-full">
+<div class="inline-flex w-full flex-col">
   {#if inline}
     <Inline key={config.freeform.key} {tags} template={config.render}>
       <ValidatedInput

src/UI/ThemeViewGUI.svelte

@@ -413,7 +413,7 @@
 
       <div class="flex" slot="title2">
         <ToSvelte construct={Svg.community_svg().SetClass("w-6 h-6")} />
-        <Tr t={Translations.t.communityIndex.title}/>
+        <Tr t={Translations.t.communityIndex.title} />
       </div>
       <div class="m-2" slot="content2">
         <CommunityIndexView location={state.mapProperties.location} />