Merge branch 'develop' into feature/nsi

src/UI/Base/CloseAnimation.svelte

@@ -33,7 +33,7 @@ console.log("Animating", debug," to", opened)
   }
 
   onDestroy(isOpened.addCallback(opened => animate(opened)))
-  onMount(() => animate(isOpened.data))
+  onMount(() =>  requestAnimationFrame(() => animate(isOpened.data)))
 
 
 </script>
@@ -42,7 +42,7 @@ console.log("Animating", debug," to", opened)
 </div>
 
 <div bind:this={elem} class="pointer-events-none absolute bottom-0 right-0 low-interaction rounded-2xl"
-     style="transition: all 0.65s ease-out, background-color 1.8s ease-out; background: var(--background-color);">
+     style="transition: all 0.5s ease-out, background-color 1.4s ease-out; background: var(--background-color);">
   <!-- Classes should be the same as the 'floatoaver' -->
 </div>
 

src/UI/BigComponents/PrivacyPolicy.svelte

@@ -1,8 +1,15 @@
 <script lang="ts">
   import Tr from "../Base/Tr.svelte"
   import Translations from "../i18n/Translations"
+  import TagRenderingEditable from "../Popup/TagRendering/TagRenderingEditable.svelte"
+  import type { SpecialVisualizationState } from "../SpecialVisualization"
+  import UserRelatedState from "../../Logic/State/UserRelatedState"
 
   const t = Translations.t.privacy
+  export let state: SpecialVisualizationState
+  const usersettings = UserRelatedState.usersettingsConfig
+  const editPrivacy = usersettings.tagRenderings.find(tr => tr.id === "more_privacy")
+  const isLoggedIn = state.osmConnection.isLoggedIn
 </script>
 
 <div class="link-underline flex flex-col">
@@ -20,7 +27,41 @@
   <h3>
     <Tr t={t.editingTitle} />
   </h3>
-  <Tr t={t.editing} />
+  <Tr t={t.editingIntro} />
+  <Tr t={t.editingIntro} />
+  <ul>
+    <li>
+      <Tr t={t.items.changesYouMake} />
+    </li>
+    <li>
+      <Tr t={t.items.username} />
+    </li>
+    <li>
+      <Tr t={t.items.date} />
+    </li>
+    <li>
+      <Tr t={t.items.theme} />
+    </li>
+    <li>
+      <Tr t={t.items.language} />
+    </li>
+
+    <li>
+      {#if $isLoggedIn}
+      <TagRenderingEditable config={editPrivacy} selectedElement={{
+              type: "Feature",
+              properties: { id: "settings" },
+              geometry: { type: "Point", coordinates: [0, 0] },
+            }}
+                            {state}
+                            tags={state.userRelatedState.preferencesAsTags} />
+        {:else}
+          <Tr t={t.items.distanceIndicator} />
+        {/if}
+    </li>
+  </ul>
+
+  <Tr t={t.editingOutro} />
 
   <h3>
     <Tr t={t.miscCookiesTitle} />

src/UI/BigComponents/ThemeIntroPanel.svelte

@@ -15,6 +15,7 @@
   import Add from "../../assets/svg/Add.svelte"
   import Location_refused from "../../assets/svg/Location_refused.svelte"
   import Location from "../../assets/svg/Location.svelte"
+  import SpecialTranslation from "../Popup/TagRendering/SpecialTranslation.svelte"
 
   /**
    * The theme introduction panel
@@ -48,6 +49,7 @@
 <div class="flex h-full flex-col justify-between">
   <div>
     <!-- Intro, description, ... -->
+
     <Tr t={layout.description} />
     <Tr t={Translations.t.general.welcomeExplanation.general} />
     {#if layout.layers.some((l) => l.presets?.length > 0)}

src/UI/Comparison/ComparisonTable.svelte

@@ -109,16 +109,17 @@
   <div class="low-interaction border-interactive p-1">
     {#if !readonly}
       <Tr t={t.loadedFrom.Subs({ url: sourceUrl, source: sourceUrl })} />
-      <h3>
-        <Tr t={t.conflicting.title} />
-      </h3>
     {/if}
 
     <div class="flex flex-col" class:gap-y-8={!readonly}>
-      {#if !readonly}
-        <Tr t={t.conflicting.intro} />
-      {/if}
+
       {#if $different.length > 0}
+        {#if !readonly}
+          <h3>
+            <Tr t={t.conflicting.title} />
+          </h3>
+          <Tr t={t.conflicting.intro} />
+        {/if}
         {#each $different as key (key)}
           <div class="mx-2 rounded-2xl">
             <ComparisonAction
@@ -135,6 +136,13 @@
       {/if}
 
       {#if $missing.length > 0}
+        {#if !readonly}
+         <h3 class="m-0">
+          <Tr t={t.missing.title} />
+         </h3>
+
+          <Tr t={t.missing.intro} />
+        {/if}
         {#if currentStep === "init"}
           {#each $missing as key (key)}
             <div class:glowing-shadow={applyAllHovered} class="mx-2 rounded-2xl">

src/UI/Popup/TagRendering/TagRenderingQuestion.svelte

@@ -205,7 +205,7 @@
           checkedMappings,
           tags.data
         )
-        if (state.featureSwitches.featureSwitchIsDebugging.data) {
+        if (featureSwitchIsDebugging?.data) {
           console.log(
             "Constructing change spec from",
             {

src/UI/PrivacyGui.svelte

@@ -6,6 +6,15 @@
   import { Utils } from "../Utils"
   import Add from "../assets/svg/Add.svelte"
   import LanguagePicker from "./InputElement/LanguagePicker.svelte"
+  import type { SpecialVisualizationState } from "./SpecialVisualization"
+  import { OsmConnection } from "../Logic/Osm/OsmConnection"
+  import UserRelatedState from "../Logic/State/UserRelatedState"
+
+  const osmConnection = new OsmConnection()
+  let state: SpecialVisualizationState = {
+    osmConnection,
+    userRelatedState: new UserRelatedState(osmConnection)
+  }
 </script>
 
 <div class="flex h-screen flex-col overflow-hidden px-4">
@@ -17,7 +26,7 @@
     <LanguagePicker availableLanguages={Translations.t.privacy.intro.SupportedLanguages()} />
   </div>
   <div class="h-full overflow-auto border border-gray-500 p-4">
-    <PrivacyPolicy />
+    <PrivacyPolicy {state} />
   </div>
   <a class="button flex" href={Utils.HomepageLink()}>
     <Add class="h-6 w-6" />

src/UI/SpecialVisualization.ts

@@ -1,12 +1,12 @@
 import { Store, UIEventSource } from "../Logic/UIEventSource"
 import BaseUIElement from "./BaseUIElement"
 import LayoutConfig from "../Models/ThemeConfig/LayoutConfig"
-import { IndexedFeatureSource, WritableFeatureSource } from "../Logic/FeatureSource/FeatureSource"
+import { FeatureSource, IndexedFeatureSource, WritableFeatureSource } from "../Logic/FeatureSource/FeatureSource"
 import { OsmConnection } from "../Logic/Osm/OsmConnection"
 import { Changes } from "../Logic/Osm/Changes"
 import { ExportableMap, MapProperties } from "../Models/MapProperties"
 import LayerState from "../Logic/State/LayerState"
-import { Feature, Geometry, Point } from "geojson"
+import { Feature, Geometry, Point, Polygon } from "geojson"
 import FullNodeDatabaseSource from "../Logic/FeatureSource/TiledFeatureSource/FullNodeDatabaseSource"
 import { MangroveIdentity } from "../Logic/Web/MangroveReviews"
 import { GeoIndexedStoreForLayer } from "../Logic/FeatureSource/Actors/GeoIndexedStore"
@@ -61,8 +61,10 @@ export interface SpecialVisualizationState {
 
     readonly selectedElement: UIEventSource<Feature>
 
+    readonly currentView: FeatureSource<Feature<Polygon>>
     readonly favourites: FavouritesFeatureSource
 
+
     /**
      * If data is currently being fetched from external sources
      */

src/UI/SpecialVisualizations.ts

@@ -1814,7 +1814,6 @@ console.log(">>> ",helpTexts.join("\n\n"))
                                             ) ?? features[0]
                                         const properties = feature.properties
                                         properties["ref:velopark"] = url
-                                        delete properties["name"]
                                         console.log("Got properties from velopark:", properties)
                                         return properties
                                     } catch (e) {

src/UI/ThemeViewGUI.svelte

@@ -271,7 +271,7 @@
     {#if currentViewLayer?.tagRenderings && currentViewLayer.defaultIcon()}
       <MapControlButton
         on:click={() => {
-          state.selectedElement.setData(state.currentView.features?.data?.[0])
+          state.selectCurrentView()
         }}
         on:keydown={forwardEventToMap}
         htmlElem={openCurrentViewLayerButton}
@@ -661,7 +661,7 @@
         <Tr t={Translations.t.privacy.title} />
       </h2>
       <div class="overflow-auto p-4">
-        <PrivacyPolicy />
+        <PrivacyPolicy {state}/>
       </div>
     </div>
   </FloatOver>