From 2149fc1a1d35a1c51179b4795c5e409e5265a9e7 Mon Sep 17 00:00:00 2001 From: Pieter Vander Vennet Date: Fri, 5 May 2023 01:25:37 +0200 Subject: [PATCH] Refactoring: add current view button --- Models/ThemeViewState.ts | 55 ++- UI/ThemeViewGUI.svelte | 462 ++++++++++--------- assets/layers/current_view/current_view.json | 5 +- 3 files changed, 266 insertions(+), 256 deletions(-) diff --git a/Models/ThemeViewState.ts b/Models/ThemeViewState.ts index f744e19fde..be6da062d1 100644 --- a/Models/ThemeViewState.ts +++ b/Models/ThemeViewState.ts @@ -1,27 +1,23 @@ import LayoutConfig from "./ThemeConfig/LayoutConfig" -import { SpecialVisualizationState } from "../UI/SpecialVisualization" -import { Changes } from "../Logic/Osm/Changes" -import { ImmutableStore, Store, UIEventSource } from "../Logic/UIEventSource" -import { - FeatureSource, - IndexedFeatureSource, - WritableFeatureSource, -} from "../Logic/FeatureSource/FeatureSource" -import { OsmConnection } from "../Logic/Osm/OsmConnection" -import { ExportableMap, MapProperties } from "./MapProperties" +import {SpecialVisualizationState} from "../UI/SpecialVisualization" +import {Changes} from "../Logic/Osm/Changes" +import {ImmutableStore, Store, UIEventSource} from "../Logic/UIEventSource" +import {FeatureSource, IndexedFeatureSource, WritableFeatureSource,} from "../Logic/FeatureSource/FeatureSource" +import {OsmConnection} from "../Logic/Osm/OsmConnection" +import {ExportableMap, MapProperties} from "./MapProperties" import LayerState from "../Logic/State/LayerState" -import { Feature, Point } from "geojson" +import {Feature, Point, Polygon} from "geojson" import FullNodeDatabaseSource from "../Logic/FeatureSource/TiledFeatureSource/FullNodeDatabaseSource" -import { Map as MlMap } from "maplibre-gl" +import {Map as MlMap} from "maplibre-gl" import InitialMapPositioning from "../Logic/Actors/InitialMapPositioning" -import { MapLibreAdaptor } from "../UI/Map/MapLibreAdaptor" -import { GeoLocationState } from "../Logic/State/GeoLocationState" +import {MapLibreAdaptor} from "../UI/Map/MapLibreAdaptor" +import {GeoLocationState} from "../Logic/State/GeoLocationState" import FeatureSwitchState from "../Logic/State/FeatureSwitchState" -import { QueryParameters } from "../Logic/Web/QueryParameters" +import {QueryParameters} from "../Logic/Web/QueryParameters" import UserRelatedState from "../Logic/State/UserRelatedState" import LayerConfig from "./ThemeConfig/LayerConfig" import GeoLocationHandler from "../Logic/Actors/GeoLocationHandler" -import { AvailableRasterLayers, RasterLayerPolygon, RasterLayerUtils } from "./RasterLayers" +import {AvailableRasterLayers, RasterLayerPolygon, RasterLayerUtils} from "./RasterLayers" import LayoutSource from "../Logic/FeatureSource/Sources/LayoutSource" import StaticFeatureSource from "../Logic/FeatureSource/Sources/StaticFeatureSource" import FeaturePropertiesStore from "../Logic/FeatureSource/Actors/FeaturePropertiesStore" @@ -32,20 +28,20 @@ import TitleHandler from "../Logic/Actors/TitleHandler" import ChangeToElementsActor from "../Logic/Actors/ChangeToElementsActor" import PendingChangesUploader from "../Logic/Actors/PendingChangesUploader" import SelectedElementTagsUpdater from "../Logic/Actors/SelectedElementTagsUpdater" -import { BBox } from "../Logic/BBox" +import {BBox} from "../Logic/BBox" import Constants from "./Constants" import Hotkeys from "../UI/Base/Hotkeys" import Translations from "../UI/i18n/Translations" -import { GeoIndexedStoreForLayer } from "../Logic/FeatureSource/Actors/GeoIndexedStore" -import { LastClickFeatureSource } from "../Logic/FeatureSource/Sources/LastClickFeatureSource" -import { MenuState } from "./MenuState" +import {GeoIndexedStoreForLayer} from "../Logic/FeatureSource/Actors/GeoIndexedStore" +import {LastClickFeatureSource} from "../Logic/FeatureSource/Sources/LastClickFeatureSource" +import {MenuState} from "./MenuState" import MetaTagging from "../Logic/MetaTagging" import ChangeGeometryApplicator from "../Logic/FeatureSource/Sources/ChangeGeometryApplicator" -import { NewGeometryFromChangesFeatureSource } from "../Logic/FeatureSource/Sources/NewGeometryFromChangesFeatureSource" +import {NewGeometryFromChangesFeatureSource} from "../Logic/FeatureSource/Sources/NewGeometryFromChangesFeatureSource" import OsmObjectDownloader from "../Logic/Osm/OsmObjectDownloader" import ShowOverlayRasterLayer from "../UI/Map/ShowOverlayRasterLayer" -import { Utils } from "../Utils" -import { EliCategory } from "./RasterLayerProperties" +import {Utils} from "../Utils" +import {EliCategory} from "./RasterLayerProperties" import BackgroundLayerResetter from "../Logic/Actors/BackgroundLayerResetter" import SaveFeatureSourceToLocalStorage from "../Logic/FeatureSource/Actors/SaveFeatureSourceToLocalStorage" import Hash from "../Logic/Web/Hash" @@ -80,6 +76,7 @@ export default class ThemeViewState implements SpecialVisualizationState { readonly historicalUserLocations: WritableFeatureSource> readonly indexedFeatures: IndexedFeatureSource & LayoutSource + readonly currentView: FeatureSource> readonly featuresInView: FeatureSource readonly newFeatures: WritableFeatureSource readonly layerState: LayerState @@ -169,6 +166,12 @@ export default class ThemeViewState implements SpecialVisualizationState { (id) => self.layerState.filteredLayers.get(id).isDisplayed ) this.indexedFeatures = layoutSource + const empty = [] + this.currentView = new StaticFeatureSource( + this.mapProperties.bounds.map((bbox) => + bbox === undefined ? empty : [bbox.asGeoJson({ id: "current_view" })] + ) + ) this.featuresInView = new BBoxFeatureSource(layoutSource, this.mapProperties.bounds) this.dataIsLoading = layoutSource.isLoading @@ -447,11 +450,7 @@ export default class ThemeViewState implements SpecialVisualizationState { bbox === undefined ? empty : [bbox.asGeoJson({ id: "range" })] ) ), - current_view: new StaticFeatureSource( - this.mapProperties.bounds.map((bbox) => - bbox === undefined ? empty : [bbox.asGeoJson({ id: "current_view" })] - ) - ), + current_view: this.currentView } if (this.layout?.lockLocation) { const bbox = new BBox(this.layout.lockLocation) diff --git a/UI/ThemeViewGUI.svelte b/UI/ThemeViewGUI.svelte index daea207412..7917cba1f3 100644 --- a/UI/ThemeViewGUI.svelte +++ b/UI/ThemeViewGUI.svelte @@ -1,100 +1,109 @@
- +
- - -
- -
- -
- state.guistate.themeIsOpened.setData(true)}> -
- - - - -
- - state.guistate.menuIsOpened.setData(true)}> - - - + + +
+ +
+ +
+ state.guistate.themeIsOpened.setData(true)}> +
+ + + + +
+ + state.guistate.menuIsOpened.setData(true)}> + + + {#if currentViewLayer?.tagRenderings} + {selectedLayer.setData(currentViewLayer); selectedElement.setData(state.currentView.features?.data?.[0])}}> + (currentViewLayer.defaultIcon() ?? Svg.checkbox_empty_svg()).SetClass("w-8 h-8 cursor-pointer")}/> + + {/if} + Testmode - + -
+
@@ -102,191 +111,192 @@
- f.length > 1)}> -
- -
- - mapproperties.zoom.update(z => z+1)}> - - - mapproperties.zoom.update(z => z-1)}> - - - - - + f.length > 1)}> +
+ +
+ + mapproperties.zoom.update(z => z+1)}> + - + mapproperties.zoom.update(z => z-1)}> + + + + + + +
v !== undefined && selectedLayer.data !== undefined && !selectedLayer.data.popupInFloatover,[ selectedLayer] )}> - {selectedElement.setData(undefined)}}> - - + {selectedElement.setData(undefined)}}> + + v !== undefined && selectedLayer.data !== undefined && selectedLayer.data.popupInFloatover,[ selectedLayer] )}> - {selectedElement.setData(undefined)}}> - - + {selectedElement.setData(undefined)}}> + + - - state.guistate.themeIsOpened.setData(false)}> - - + + state.guistate.themeIsOpened.setData(false)}> + + -
+
- - - {#if layout.layers.some((l) => l.presets?.length > 0)} - - - - {/if} + + + {#if layout.layers.some((l) => l.presets?.length > 0)} + + + + {/if} - - -
- -
+ + +
+ +
-
+
-
- - - - -
+
+ + + + +
-
- {#each layout.layers as layer} - - {/each} - {#each layout.tileLayerSources as tilesource} - - {/each} - - - -
-
- - - - -
-
- new DownloadPanel(state)} /> -
+
+ {#each layout.layers as layer} + + {/each} + {#each layout.tileLayerSources as tilesource} + + {/each} + + + +
+
+ + + + +
+
+ new DownloadPanel(state)}/> +
-
- -
+
+ +
- new CopyrightPanel(state)} slot="content3"> + new CopyrightPanel(state)} slot="content3"> - - + + - - state.guistate.menuIsOpened.setData(false)}> - -
- -
+ + state.guistate.menuIsOpened.setData(false)}> + +
+ +
-
+
- + - - - - + + + + - - - - + + + + - - - - + + + + - - - - + + + + - - - - - {Constants.vNumber} - -
+ + + + + {Constants.vNumber} + +
- -
- - -
- + +
+ + +
+ -
- - -
- - -
- + + +
+ + +
+ - -
+ {state} + tags={state.userRelatedState.preferencesAsTags} + /> + + -
- - Get in touch with others -
- +
+ + Get in touch with others +
+ -
- - -
- new PrivacyPolicy()} slot="content3"> - - +
+ + +
+ new PrivacyPolicy()} slot="content3"> + + diff --git a/assets/layers/current_view/current_view.json b/assets/layers/current_view/current_view.json index 1e0c279e9c..42a1769a64 100644 --- a/assets/layers/current_view/current_view.json +++ b/assets/layers/current_view/current_view.json @@ -1,13 +1,14 @@ { "id": "current_view", - "description": "A meta-layer which contains one single feature, namely the BBOX of the current map view. This can be used to trigger special actions. If a popup is defined for this layer, this popup will be accessible via an extra button on screen.\n\nThe icon on the button is the default icon of the layer, but can be customized by detecting 'button=yes'.", + "description": "A meta-layer which contains one single feature, namely the bounding box of the current map view. This can be used to trigger special actions. If a popup is defined for this layer, this popup will be accessible via an extra button on screen.\n\nThe icon on the button is the default icon of the layer, but can be customized by detecting 'button=yes'.", "source": "special", "shownByDefault": false, "title": "Current View", "tagRenderings": [], + "popupInFloatover": true, "mapRendering": [ { "color": "#cccc0088" } ] -} \ No newline at end of file +}