Small usability tweaks

src/UI/BigComponents/SelectedElementView.svelte

@@ -36,7 +36,9 @@
 </script>
 
 {#if $tags._deleted === "yes"}
-  <Tr t={Translations.t.delete.isDeleted} />
+  <div aria-live="assertive">
+    <Tr t={Translations.t.delete.isDeleted} />
+  </div>
   <button class="w-full" on:click={() => state.selectedElement.setData(undefined)}>
     <Tr t={Translations.t.general.returnToTheMap} />
   </button>

src/UI/Map/Icon.svelte

@@ -28,6 +28,8 @@
   import Not_found from "../../assets/svg/Not_found.svelte"
   import { twMerge } from "tailwind-merge"
   import Direction_gradient from "../../assets/svg/Direction_gradient.svelte"
+  import Mastodon from "../../assets/svg/Mastodon.svelte"
+  import Party from "../../assets/svg/Party.svelte"
 
   /**
    * Renders a single icon.
@@ -105,6 +107,10 @@
     <Direction_gradient class={clss} {color} />
   {:else if icon === "not_found"}
     <Not_found class={twMerge(clss, "no-image-background")} {color} />
+  {:else if icon === "mastodon"}
+    <Mastodon {color} class={clss} />
+  {:else if icon === "party"}
+    <Party {color} class={clss} />
   {:else}
     <img class={clss ?? "h-full w-full"} src={icon} aria-hidden="true" alt="" />
   {/if}

src/UI/Reviews/ReviewForm.svelte

@@ -13,6 +13,7 @@
   import Loading from "../Base/Loading.svelte"
   import { Review } from "mangrove-reviews-typescript"
   import { Utils } from "../../Utils"
+  import { placeholder } from "../../Utils/placeholder"
 
   export let state: SpecialVisualizationState
   export let tags: UIEventSource<Record<string, string>>
@@ -83,7 +84,8 @@
 
     {#if confirmedScore !== undefined}
       <Tr cls="font-bold mt-2" t={t.question_opinion} />
-      <textarea bind:value={$opinion} inputmode="text" rows="3" class="mb-1 w-full" />
+      <textarea autofocus bind:value={$opinion} inputmode="text" rows="3" class="mb-1 w-full" 
+      use:placeholder={t.reviewPlaceholder}/>
       <Checkbox selected={isAffiliated}>
         <div class="flex flex-col">
           <Tr t={t.i_am_affiliated} />

src/UI/SpecialVisualizations.ts

@@ -1569,14 +1569,23 @@ export default class SpecialVisualizations {
                     feature: Feature,
                     layer: LayerConfig
                 ): BaseUIElement {
-                    const url =
-                        window.location.protocol +
-                        "//" +
-                        window.location.host +
-                        window.location.pathname +
-                        "#" +
-                        feature.properties.id
-                    return new Img(new Qr(url).toImageElement(75)).SetStyle("width: 75px")
+                    return new VariableUiElement(
+                        tagSource
+                            .map((tags) => tags.id)
+                            .map((id) => {
+                                if (id.startsWith("node/-")) {
+                                    // Not yet uploaded
+                                    return undefined
+                                }
+                                const [lon, lat] = GeoOperations.centerpointCoordinates(feature)
+                                const url =
+                                    `${window.location.protocol}//${window.location.host}${window.location.pathname}?lat=${lat}&lon=${lon}&z=15` +
+                                    `#${id}`
+                                return new Img(new Qr(url).toImageElement(75)).SetStyle(
+                                    "width: 75px"
+                                )
+                            })
+                    )
                 },
             },
         ]