Refactoring: Load availableMVTVectorLayers dynamically

This commit is contained in:
Pieter Vander Vennet 2025-01-23 12:30:42 +01:00
parent 2b3e3257fd
commit a50c6b531e
14 changed files with 115 additions and 68 deletions

View file

@ -1,5 +1,6 @@
import ThemeConfig from "./ThemeConfig/ThemeConfig"
import { WithImageState } from "./ThemeViewState/WithImageState"
import { Store } from "../Logic/UIEventSource"
/**
*
@ -10,7 +11,7 @@ import { WithImageState } from "./ThemeViewState/WithImageState"
* It ties up all the needed elements and starts some actors.
*/
export default class ThemeViewState extends WithImageState {
constructor(layout: ThemeConfig, mvtAvailableLayers: Set<string>) {
constructor(layout: ThemeConfig, mvtAvailableLayers: Store<Set<string>>) {
super(layout, mvtAvailableLayers)
}
}

View file

@ -35,7 +35,7 @@ export class WithChangesState extends WithLayoutSourceState {
*/
readonly hasDataInView: Store<FeatureViewState>
constructor(theme: ThemeConfig, mvtAvailableLayers: Set<string>) {
constructor(theme: ThemeConfig, mvtAvailableLayers: Store<Set<string>>) {
super(theme, mvtAvailableLayers)
this.changes = new Changes(
{
@ -82,7 +82,7 @@ export class WithChangesState extends WithLayoutSourceState {
this.perLayerFiltered = this.showNormalDataOn(this.map)
this.hasDataInView = new NoElementsInViewDetector(this).hasFeatureInView
this.toCacheSavers = theme.enableCache ? this.initSaveToLocalStorage() : undefined

View file

@ -3,6 +3,7 @@ import { MenuState } from "../MenuState"
import Hotkeys from "../../UI/Base/Hotkeys"
import Translations from "../../UI/i18n/Translations"
import { WithSpecialLayers } from "./WithSpecialLayers"
import { Store } from "../../Logic/UIEventSource"
/**
* Does all things related to:
@ -11,9 +12,10 @@ import { WithSpecialLayers } from "./WithSpecialLayers"
export class WithGuiState extends WithSpecialLayers {
readonly guistate: MenuState
constructor(theme: ThemeConfig, mvtAvailableLayers: Set<string>) {
constructor(theme: ThemeConfig, mvtAvailableLayers: Store<Set<string>>) {
super(theme, mvtAvailableLayers)
this.guistate = new MenuState(
this.guistate = new MenuState(this.selectedElement)
this.guistate.openMenuIfNeeded(
this.featureSwitches.featureSwitchWelcomeMessage.data,
theme.id
)

View file

@ -22,7 +22,7 @@ export class WithLayoutSourceState extends WithSelectedElementState {
readonly floors: Store<string[]>
constructor(theme: ThemeConfig, mvtAvailableLayers: Set<string>) {
constructor(theme: ThemeConfig, mvtAvailableLayers: Store<Set<string>>) {
super(theme)
/* Set up the layout source
* A bit tricky, as this is heavily intertwined with the 'changes'-element, which generates a stream of new and changed features too

View file

@ -7,11 +7,12 @@ import { WithVisualFeedbackState } from "./WithVisualFeedbackState"
import { ShowDataLayerOptions } from "../../UI/Map/ShowDataLayerOptions"
import LayerConfig from "../ThemeConfig/LayerConfig"
import ShowDataLayer from "../../UI/Map/ShowDataLayer"
import { Store } from "../../Logic/UIEventSource"
export class WithSearchState extends WithVisualFeedbackState {
public readonly searchState: SearchState
constructor(theme: ThemeConfig, mvtAvailableLayers: Set<string>) {
constructor(theme: ThemeConfig, mvtAvailableLayers: Store<Set<string>>) {
super(theme, mvtAvailableLayers)
this.searchState = new SearchState(this)
this.initHotkeysSearch()
@ -48,20 +49,12 @@ export class WithSearchState extends WithVisualFeedbackState {
)
Hotkeys.RegisterHotkey({ nomod: "Escape", onUp: true }, docs.closeSidebar, () => {
if (this.previewedImage.data !== undefined) {
this.previewedImage.setData(undefined)
return
}
if (this.selectedElement.data) {
this.selectedElement.setData(undefined)
if (this.guistate.closeAll()) {
return
}
if (this.searchState.showSearchDrawer.data) {
this.searchState.showSearchDrawer.set(false)
return
}
if (this.guistate.closeAll()) {
return
}
Zoomcontrol.resetzoom()
this.focusOnMap()

View file

@ -28,11 +28,10 @@ export class WithSelectedElementState extends UserMapFeatureswitchState {
})
this.mapProperties.lastClickLocation.addCallbackD((lastClick) => {
if (lastClick.mode !== "left" || !lastClick.nearestFeature) {
if (lastClick.mode !== "left") {
return
}
const f = lastClick.nearestFeature
this.setSelectedElement(f)
this.setSelectedElement(lastClick.nearestFeature)
})
@ -67,7 +66,7 @@ export class WithSelectedElementState extends UserMapFeatureswitchState {
const current = this.selectedElement.data
if (
current?.properties?.id !== undefined &&
current.properties.id === feature.properties.id
current.properties.id === feature?.properties?.id
) {
console.log("Not setting selected, same id", current, feature)
return // already set

View file

@ -14,7 +14,7 @@ import { LayerConfigJson } from "../ThemeConfig/Json/LayerConfigJson"
import last_click_layerconfig from "../../assets/generated/layers/last_click.json"
import { GeoOperations } from "../../Logic/GeoOperations"
import summaryLayer from "../../assets/generated/layers/summary.json"
import { UIEventSource } from "../../Logic/UIEventSource"
import { Store, UIEventSource } from "../../Logic/UIEventSource"
import NearbyFeatureSource from "../../Logic/FeatureSource/Sources/NearbyFeatureSource"
import {
SummaryTileSource,
@ -43,7 +43,7 @@ export class WithSpecialLayers extends WithChangesState {
readonly visualFeedbackViewportBounds: UIEventSource<BBox> = new UIEventSource<BBox>(undefined)
constructor(theme: ThemeConfig, mvtAvailableLayers: Set<string>) {
constructor(theme: ThemeConfig, mvtAvailableLayers: Store<Set<string>>) {
super(theme, mvtAvailableLayers)
this.favourites = new FavouritesFeatureSource(this)
@ -64,12 +64,12 @@ export class WithSpecialLayers extends WithChangesState {
this.featureSummary = this.setupSummaryLayer()
this.initActorsSpecialLayers()
this.drawSelectedElement()
this.drawSpecialLayers()
this.drawLastClick()
// Note: the lock-range is handled by UserMapFeatureSwitchState
{
// Activate metatagging for the 'current_view' layer
console.log(">>>", this.layerState.filteredLayers)
const currentViewLayer = this.layerState.filteredLayers.get("current_view")?.layerDef
if (currentViewLayer?.tagRenderings?.length > 0) {
const params = MetaTagging.createExtraFuncParams(this)
@ -163,8 +163,10 @@ export class WithSpecialLayers extends WithChangesState {
})
)
// show last click = new point/note marker
const features = new StaticFeatureSource(lastClickFiltered)
this.featureProperties.trackFeatureSource(features)
new ShowDataLayer(this.map, {
features: new StaticFeatureSource(lastClickFiltered),
features,
layer: lastClickLayerConfig,
onClick: (feature) => {
if (this.mapProperties.zoom.data >= Constants.minZoomLevelToAddNewPoint) {
@ -179,6 +181,13 @@ export class WithSpecialLayers extends WithChangesState {
})
}
private drawSelectedElement() {
const src = new StaticFeatureSource(
this.selectedElement.map((f) => (f === undefined ? [] : [f]))
)
ShowDataLayer.showMultipleLayers(this.map, src, this.theme.layers)
}
private drawSpecialLayers() {
type AddedByDefaultTypes = (typeof Constants.added_by_default)[number]
@ -187,6 +196,7 @@ export class WithSpecialLayers extends WithChangesState {
| "last_click" // handled by this.drawLastClick()
| "summary" // handled by setupSummaryLayer
| "range" // handled by UserMapFeatureSwitchState
| "selected_element" // handled by this.drawSelectedElement
>
const empty = []
/**
@ -199,10 +209,7 @@ export class WithSpecialLayers extends WithChangesState {
gps_track: this.geolocation.historicalUserLocationsTrack,
current_view: this.currentView,
favourite: this.favourites,
geocoded_image: new StaticFeatureSource(this.geocodedImages),
selected_element: new StaticFeatureSource(
this.selectedElement.map((f) => (f === undefined ? empty : [f]))
)
geocoded_image: new StaticFeatureSource(this.geocodedImages)
}

View file

@ -1,5 +1,5 @@
import ThemeConfig from "../ThemeConfig/ThemeConfig"
import { UIEventSource } from "../../Logic/UIEventSource"
import { Store, UIEventSource } from "../../Logic/UIEventSource"
import Hotkeys from "../../UI/Base/Hotkeys"
import Translations from "../../UI/i18n/Translations"
import ThemeViewState from "../ThemeViewState"
@ -11,7 +11,7 @@ export class WithVisualFeedbackState extends ThemeViewState {
*/
public readonly visualFeedback: UIEventSource<boolean> = new UIEventSource<boolean>(false)
constructor(theme: ThemeConfig, mvtAvailableLayers: Set<string>) {
constructor(theme: ThemeConfig, mvtAvailableLayers: Store<Set<string>>) {
super(theme, mvtAvailableLayers)
this.initHotkeysVisualFeedback()
@ -72,7 +72,7 @@ export class WithVisualFeedbackState extends ThemeViewState {
if (this.selectedElement.data !== undefined) {
return false
}
if (this.guistate.isSomethingOpen() || this.previewedImage.data !== undefined) {
if (this.guistate.isSomethingOpen()) {
return
}
if (