From 2fe2541b458ffd48017c223d05abf8ae19a2ba58 Mon Sep 17 00:00:00 2001
From: Pieter Vander Vennet <pietervdvn@posteo.net>
Date: Tue, 24 Sep 2024 18:08:01 +0200
Subject: [PATCH] Search: tweak search functions

---
 src/Logic/Search/LayerSearch.ts        |  4 ++--
 src/Logic/Search/ThemeSearch.ts        |  4 ++--
 src/Models/ThemeViewState.ts           | 17 +++++++++--------
 src/UI/AllThemesGui.svelte             |  4 +++-
 src/UI/Base/Searchbar.svelte           |  6 ++++++
 src/UI/BigComponents/FilterPage.svelte |  1 +
 src/UI/BigComponents/Filterview.svelte | 10 ++++++++--
 7 files changed, 31 insertions(+), 15 deletions(-)

diff --git a/src/Logic/Search/LayerSearch.ts b/src/Logic/Search/LayerSearch.ts
index 9b5545700..22c01254a 100644
--- a/src/Logic/Search/LayerSearch.ts
+++ b/src/Logic/Search/LayerSearch.ts
@@ -35,7 +35,7 @@ export default class LayerSearch {
     }
 
 
-    public search(query: string, limit: number): LayerConfig[] {
+    public search(query: string, limit: number, scoreThreshold: number = 2): LayerConfig[] {
         if (query.length < 1) {
             return []
         }
@@ -50,7 +50,7 @@ export default class LayerSearch {
         asList.sort((a, b) => a.score - b.score)
 
         return asList
-            .filter(sorted => sorted.score < 2)
+            .filter(sorted => sorted.score < scoreThreshold)
             .slice(0, limit)
             .map(l => l.layer)
     }
diff --git a/src/Logic/Search/ThemeSearch.ts b/src/Logic/Search/ThemeSearch.ts
index ed5502e7e..d39227553 100644
--- a/src/Logic/Search/ThemeSearch.ts
+++ b/src/Logic/Search/ThemeSearch.ts
@@ -43,13 +43,13 @@ export default class ThemeSearch {
     }
 
 
-    public search(query: string, limit: number): MinimalLayoutInformation[] {
+    public search(query: string, limit: number, threshold: number = 3): MinimalLayoutInformation[] {
         if (query.length < 1) {
             return []
         }
         const sorted = ThemeSearch.sortedByLowestScores(query, this._otherThemes, this._layersToIgnore)
         return sorted
-            .filter(sorted => sorted.lowest < 2)
+            .filter(sorted => sorted.lowest < threshold)
             .map(th => th.theme)
             .filter(th => !th.hideFromOverview || this._knownHiddenThemes.data.has(th.id))
             .slice(0, limit)
diff --git a/src/Models/ThemeViewState.ts b/src/Models/ThemeViewState.ts
index 2024df543..10a77b120 100644
--- a/src/Models/ThemeViewState.ts
+++ b/src/Models/ThemeViewState.ts
@@ -794,15 +794,7 @@ export default class ThemeViewState implements SpecialVisualizationState {
             last_click: this.lastClickObject,
             search: this.searchState.locationResults,
         }
-        if (specialLayers.summary) {
 
-            new ShowDataLayer(this.map, {
-                features: specialLayers.summary,
-                layer: new LayerConfig(<LayerConfigJson>summaryLayer, "summaryLayer"),
-                // doShowLayer: this.mapProperties.zoom.map((z) => z < maxzoom),
-                selectedElement: this.selectedElement,
-            })
-        }
 
         this.closestFeatures.registerSource(specialLayers.favourite, "favourite")
         if (this.layout?.lockLocation) {
@@ -902,6 +894,15 @@ export default class ThemeViewState implements SpecialVisualizationState {
                 },
             })
         }
+
+        if (specialLayers.summary) {
+            new ShowDataLayer(this.map, {
+                features: specialLayers.summary,
+                layer: new LayerConfig(<LayerConfigJson>summaryLayer, "summaryLayer"),
+                // doShowLayer: this.mapProperties.zoom.map((z) => z < maxzoom),
+                selectedElement: this.selectedElement,
+            })
+        }
     }
 
     /**
diff --git a/src/UI/AllThemesGui.svelte b/src/UI/AllThemesGui.svelte
index d76e02327..81afe3dbc 100644
--- a/src/UI/AllThemesGui.svelte
+++ b/src/UI/AllThemesGui.svelte
@@ -44,6 +44,8 @@
   let search: UIEventSource<string | undefined> = new UIEventSource<string>("")
   let searchStable = search.stabilized(100)
 
+  let searchIsFocused = new UIEventSource(true)
+
   const officialThemes: MinimalLayoutInformation[] = ThemeSearch.officialThemes.themes.filter(th => th.hideFromOverview === false)
   const hiddenThemes: MinimalLayoutInformation[] = ThemeSearch.officialThemes.themes.filter(th => th.hideFromOverview === true)
   let visitedHiddenThemes: Store<MinimalLayoutInformation[]> = UserRelatedState.initDiscoveredHiddenThemes(state.osmConnection)
@@ -135,7 +137,7 @@
       </div>
     </div>
 
-    <Searchbar value={search} placeholder={tr.searchForATheme} on:search={() => applySearch()}  />
+    <Searchbar value={search} placeholder={tr.searchForATheme} on:search={() => applySearch()} autofocus isFocused={searchIsFocussed} />
 
     <ThemesList {search} {state} themes={$officialSearched} />
 
diff --git a/src/UI/Base/Searchbar.svelte b/src/UI/Base/Searchbar.svelte
index 03c307af0..d92ae10e0 100644
--- a/src/UI/Base/Searchbar.svelte
+++ b/src/UI/Base/Searchbar.svelte
@@ -20,6 +20,8 @@
   export let isFocused: UIEventSource<boolean> = undefined
   let inputElement: HTMLInputElement
 
+  export let autofocus = false
+
   isFocused?.addCallback(focussed => {
     if (focussed) {
       requestAnimationFrame(() => {
@@ -31,6 +33,10 @@
     }
   })
 
+  if(autofocus){
+    isFocused.set(true)
+  }
+
 </script>
 
 
diff --git a/src/UI/BigComponents/FilterPage.svelte b/src/UI/BigComponents/FilterPage.svelte
index 3a370fd4d..fb3301c8d 100644
--- a/src/UI/BigComponents/FilterPage.svelte
+++ b/src/UI/BigComponents/FilterPage.svelte
@@ -72,6 +72,7 @@
 
   {#each layout.layers as layer}
     <Filterview
+      {state}
       zoomlevel={state.mapProperties.zoom}
       filteredLayer={state.layerState.filteredLayers.get(layer.id)}
       highlightedLayer={state.guistate.highlightedLayerInFilters}
diff --git a/src/UI/BigComponents/Filterview.svelte b/src/UI/BigComponents/Filterview.svelte
index a501ebbf2..ead622e14 100644
--- a/src/UI/BigComponents/Filterview.svelte
+++ b/src/UI/BigComponents/Filterview.svelte
@@ -12,15 +12,17 @@
   import FilterviewWithFields from "./FilterviewWithFields.svelte"
   import Tr from "../Base/Tr.svelte"
   import Translations from "../i18n/Translations"
-  import { Utils } from "../../Utils"
-  import Icon from "../Map/Icon.svelte"
+  import type { SpecialVisualizationState } from "../SpecialVisualization"
 
+  export let state: SpecialVisualizationState
   export let filteredLayer: FilteredLayer
   export let highlightedLayer: Store<string | undefined> = new ImmutableStore(undefined)
   export let zoomlevel: Store<number> = new ImmutableStore(22)
   let layer: LayerConfig = filteredLayer.layerDef
   let isDisplayed: UIEventSource<boolean> = filteredLayer.isDisplayed
 
+  let isDebugging = state.featureSwitches.featureSwitchIsDebugging
+
   /**
    * Gets a UIEventSource as boolean for the given option, to be used with a checkbox
    */
@@ -89,4 +91,8 @@
       </div>
     {/if}
   </div>
+{:else if $isDebugging}
+ <div class="code">
+  {layer.id} (no name)
+ </div>
 {/if}