forked from MapComplete/MapComplete
Search: tweak search functions
This commit is contained in:
parent
29dce0d468
commit
2fe2541b45
7 changed files with 31 additions and 15 deletions
|
@ -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) {
|
if (query.length < 1) {
|
||||||
return []
|
return []
|
||||||
}
|
}
|
||||||
|
@ -50,7 +50,7 @@ export default class LayerSearch {
|
||||||
asList.sort((a, b) => a.score - b.score)
|
asList.sort((a, b) => a.score - b.score)
|
||||||
|
|
||||||
return asList
|
return asList
|
||||||
.filter(sorted => sorted.score < 2)
|
.filter(sorted => sorted.score < scoreThreshold)
|
||||||
.slice(0, limit)
|
.slice(0, limit)
|
||||||
.map(l => l.layer)
|
.map(l => l.layer)
|
||||||
}
|
}
|
||||||
|
|
|
@ -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) {
|
if (query.length < 1) {
|
||||||
return []
|
return []
|
||||||
}
|
}
|
||||||
const sorted = ThemeSearch.sortedByLowestScores(query, this._otherThemes, this._layersToIgnore)
|
const sorted = ThemeSearch.sortedByLowestScores(query, this._otherThemes, this._layersToIgnore)
|
||||||
return sorted
|
return sorted
|
||||||
.filter(sorted => sorted.lowest < 2)
|
.filter(sorted => sorted.lowest < threshold)
|
||||||
.map(th => th.theme)
|
.map(th => th.theme)
|
||||||
.filter(th => !th.hideFromOverview || this._knownHiddenThemes.data.has(th.id))
|
.filter(th => !th.hideFromOverview || this._knownHiddenThemes.data.has(th.id))
|
||||||
.slice(0, limit)
|
.slice(0, limit)
|
||||||
|
|
|
@ -794,15 +794,7 @@ export default class ThemeViewState implements SpecialVisualizationState {
|
||||||
last_click: this.lastClickObject,
|
last_click: this.lastClickObject,
|
||||||
search: this.searchState.locationResults,
|
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")
|
this.closestFeatures.registerSource(specialLayers.favourite, "favourite")
|
||||||
if (this.layout?.lockLocation) {
|
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,
|
||||||
|
})
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
|
|
@ -44,6 +44,8 @@
|
||||||
let search: UIEventSource<string | undefined> = new UIEventSource<string>("")
|
let search: UIEventSource<string | undefined> = new UIEventSource<string>("")
|
||||||
let searchStable = search.stabilized(100)
|
let searchStable = search.stabilized(100)
|
||||||
|
|
||||||
|
let searchIsFocused = new UIEventSource(true)
|
||||||
|
|
||||||
const officialThemes: MinimalLayoutInformation[] = ThemeSearch.officialThemes.themes.filter(th => th.hideFromOverview === false)
|
const officialThemes: MinimalLayoutInformation[] = ThemeSearch.officialThemes.themes.filter(th => th.hideFromOverview === false)
|
||||||
const hiddenThemes: MinimalLayoutInformation[] = ThemeSearch.officialThemes.themes.filter(th => th.hideFromOverview === true)
|
const hiddenThemes: MinimalLayoutInformation[] = ThemeSearch.officialThemes.themes.filter(th => th.hideFromOverview === true)
|
||||||
let visitedHiddenThemes: Store<MinimalLayoutInformation[]> = UserRelatedState.initDiscoveredHiddenThemes(state.osmConnection)
|
let visitedHiddenThemes: Store<MinimalLayoutInformation[]> = UserRelatedState.initDiscoveredHiddenThemes(state.osmConnection)
|
||||||
|
@ -135,7 +137,7 @@
|
||||||
</div>
|
</div>
|
||||||
</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} />
|
<ThemesList {search} {state} themes={$officialSearched} />
|
||||||
|
|
||||||
|
|
|
@ -20,6 +20,8 @@
|
||||||
export let isFocused: UIEventSource<boolean> = undefined
|
export let isFocused: UIEventSource<boolean> = undefined
|
||||||
let inputElement: HTMLInputElement
|
let inputElement: HTMLInputElement
|
||||||
|
|
||||||
|
export let autofocus = false
|
||||||
|
|
||||||
isFocused?.addCallback(focussed => {
|
isFocused?.addCallback(focussed => {
|
||||||
if (focussed) {
|
if (focussed) {
|
||||||
requestAnimationFrame(() => {
|
requestAnimationFrame(() => {
|
||||||
|
@ -31,6 +33,10 @@
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
|
if(autofocus){
|
||||||
|
isFocused.set(true)
|
||||||
|
}
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|
||||||
|
|
|
@ -72,6 +72,7 @@
|
||||||
|
|
||||||
{#each layout.layers as layer}
|
{#each layout.layers as layer}
|
||||||
<Filterview
|
<Filterview
|
||||||
|
{state}
|
||||||
zoomlevel={state.mapProperties.zoom}
|
zoomlevel={state.mapProperties.zoom}
|
||||||
filteredLayer={state.layerState.filteredLayers.get(layer.id)}
|
filteredLayer={state.layerState.filteredLayers.get(layer.id)}
|
||||||
highlightedLayer={state.guistate.highlightedLayerInFilters}
|
highlightedLayer={state.guistate.highlightedLayerInFilters}
|
||||||
|
|
|
@ -12,15 +12,17 @@
|
||||||
import FilterviewWithFields from "./FilterviewWithFields.svelte"
|
import FilterviewWithFields from "./FilterviewWithFields.svelte"
|
||||||
import Tr from "../Base/Tr.svelte"
|
import Tr from "../Base/Tr.svelte"
|
||||||
import Translations from "../i18n/Translations"
|
import Translations from "../i18n/Translations"
|
||||||
import { Utils } from "../../Utils"
|
import type { SpecialVisualizationState } from "../SpecialVisualization"
|
||||||
import Icon from "../Map/Icon.svelte"
|
|
||||||
|
|
||||||
|
export let state: SpecialVisualizationState
|
||||||
export let filteredLayer: FilteredLayer
|
export let filteredLayer: FilteredLayer
|
||||||
export let highlightedLayer: Store<string | undefined> = new ImmutableStore(undefined)
|
export let highlightedLayer: Store<string | undefined> = new ImmutableStore(undefined)
|
||||||
export let zoomlevel: Store<number> = new ImmutableStore(22)
|
export let zoomlevel: Store<number> = new ImmutableStore(22)
|
||||||
let layer: LayerConfig = filteredLayer.layerDef
|
let layer: LayerConfig = filteredLayer.layerDef
|
||||||
let isDisplayed: UIEventSource<boolean> = filteredLayer.isDisplayed
|
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
|
* Gets a UIEventSource as boolean for the given option, to be used with a checkbox
|
||||||
*/
|
*/
|
||||||
|
@ -89,4 +91,8 @@
|
||||||
</div>
|
</div>
|
||||||
{/if}
|
{/if}
|
||||||
</div>
|
</div>
|
||||||
|
{:else if $isDebugging}
|
||||||
|
<div class="code">
|
||||||
|
{layer.id} (no name)
|
||||||
|
</div>
|
||||||
{/if}
|
{/if}
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue