Bastian-Greshake-Tzovaras/MapComplete
1
0
Fork 0
forked from MapComplete/MapComplete
Code Pull requests Activity

Add buttons to quickly swap background layers (also in the locationInput), move copyright into home panel, split privacy policy to seperate welcome message tab

Browse source
This commit is contained in:
Pieter Vander Vennet 2021-11-21 02:44:35 +01:00
parent 1d0fbe701c
commit 37c0129a6d
22 changed files with 477 additions and 183 deletions
Download patch file Download diff file Expand all files Collapse all files

42
Logic/Actors/AvailableBaseLayersImplementation.ts
View file

@ -64,6 +64,7 @@ export default class AvailableBaseLayersImplementation implements AvailableBaseL
console.warn("Editor layer index: name not defined on ", props)
continue
}
const leafletLayer: () => TileLayer = () => AvailableBaseLayersImplementation.CreateBackgroundLayer(
props.id,
@ -83,7 +84,7 @@ export default class AvailableBaseLayersImplementation implements AvailableBaseL
min_zoom: props.min_zoom ?? 1,
name: props.name,
layer: leafletLayer,
feature: layer,
feature: layer.geometry !== null ? layer : null,
isBest: props.best ?? false,
category: props.category
});
@ -96,14 +97,14 @@ export default class AvailableBaseLayersImplementation implements AvailableBaseL
X; // Import X to make sure the namespace is not optimized away
function l(id: string, name: string): BaseLayer {
try {
const layer: any = () => L.tileLayer.provider(id, undefined);
const layer: any = L.tileLayer.provider(id, undefined);
return {
feature: null,
id: id,
name: name,
layer: layer,
min_zoom: layer.minzoom,
max_zoom: layer.maxzoom,
layer: () => L.tileLayer.provider(id, undefined),
min_zoom: 1,
max_zoom: layer.options.maxZoom,
category: "osmbasedmap",
isBest: false
}
@ -114,7 +115,6 @@ export default class AvailableBaseLayersImplementation implements AvailableBaseL
}
const layers = [
l("CyclOSM", "CyclOSM - A bicycle oriented map"),
l("Stamen.TonerLite", "Toner Lite (by Stamen)"),
l("Stamen.TonerBackground", "Toner Background - no labels (by Stamen)"),
l("Stamen.Watercolor", "Watercolor (by Stamen)"),
@ -193,37 +193,20 @@ export default class AvailableBaseLayersImplementation implements AvailableBaseL
subdomains: domains
});
}
public AvailableLayersAt(location: UIEventSource<Loc>): UIEventSource<BaseLayer[]> {
const source = location.map(
return UIEventSource.ListStabilized(location.map(
(currentLocation) => {
if (currentLocation === undefined) {
return this.layerOverview;
}
const currentLayers = source?.data; // A bit unorthodox - I know
const newLayers = this.CalculateAvailableLayersAt(currentLocation?.lon, currentLocation?.lat);
if (currentLayers === undefined) {
return newLayers;
}
if (newLayers.length !== currentLayers.length) {
return newLayers;
}
for (let i = 0; i < newLayers.length; i++) {
if (newLayers[i].name !== currentLayers[i].name) {
return newLayers;
}
}
return currentLayers;
});
return source;
return this.CalculateAvailableLayersAt(currentLocation?.lon, currentLocation?.lat);
}));
}
public SelectBestLayerAccordingTo(location: UIEventSource<Loc>, preferedCategory: UIEventSource<string | string[]>): UIEventSource<BaseLayer> {
return this.AvailableLayersAt(location).map(available => {
return this.AvailableLayersAt(location)
.map(available => {
// First float all 'best layers' to the top
available.sort((a, b) => {
if (a.isBest && b.isBest) {
@ -267,6 +250,7 @@ export default class AvailableBaseLayersImplementation implements AvailableBaseL
}, [preferedCategory])
}
private CalculateAvailableLayersAt(lon: number, lat: number): BaseLayer[] {
const availableLayers = [this.osmCarto]
const globalLayers = [];

101
Logic/FeatureSource/Actors/SaveTileToLocalStorageActor.ts
View file

@ -11,27 +11,28 @@ import LayerConfig from "../../../Models/ThemeConfig/LayerConfig";
import {BBox} from "../../BBox";
import SimpleFeatureSource from "../Sources/SimpleFeatureSource";
import FilteredLayer from "../../../Models/FilteredLayer";
import Loc from "../../../Models/Loc";
export default class SaveTileToLocalStorageActor {
private readonly visitedTiles: UIEventSource<Map<number, Date>>
private readonly _layer: LayerConfig;
private readonly _flayer : FilteredLayer
private readonly _flayer: FilteredLayer
private readonly initializeTime = new Date()
constructor(layer: FilteredLayer) {
this._flayer = layer
this._layer = layer.layerDef
this.visitedTiles = IdbLocalStorage.Get("visited_tiles_" + this._layer.id,
{defaultValue: new Map<number, Date>(), })
this.visitedTiles = IdbLocalStorage.Get("visited_tiles_" + this._layer.id,
{defaultValue: new Map<number, Date>(),})
this.visitedTiles.stabilized(100).addCallbackAndRunD(tiles => {
for (const key of Array.from(tiles.keys())) {
const tileFreshness = tiles.get(key)
const toOld = (this.initializeTime.getTime() - tileFreshness.getTime()) > 1000 * this._layer.maxAgeOfCache
if(toOld){
const toOld = (this.initializeTime.getTime() - tileFreshness.getTime()) > 1000 * this._layer.maxAgeOfCache
if (toOld) {
// Purge this tile
this.SetIdb(key, undefined)
console.debug("Purging tile",this._layer.id,key)
console.debug("Purging tile", this._layer.id, key)
tiles.delete(key)
}
}
@ -39,66 +40,70 @@ export default class SaveTileToLocalStorageActor {
return true;
})
}
public LoadTilesFromDisk(currentBounds: UIEventSource<BBox>,
registerFreshness: (tileId: number, freshness: Date) => void,
registerTile: ((src: FeatureSource & Tiled ) => void)){
public LoadTilesFromDisk(currentBounds: UIEventSource<BBox>, location: UIEventSource<Loc>,
registerFreshness: (tileId: number, freshness: Date) => void,
registerTile: ((src: FeatureSource & Tiled) => void)) {
const self = this;
const loadedTiles = new Set<number>()
this.visitedTiles.addCallbackD(tiles => {
if(tiles.size === 0){
if (tiles.size === 0) {
// We don't do anything yet as probably not yet loaded from disk
// We'll unregister later on
return;
}
for (const key of Array.from(tiles.keys())) {
const tileFreshness = tiles.get(key)
if(tileFreshness > self.initializeTime){
// This tile is loaded by another source
continue
currentBounds.addCallbackAndRunD(bbox => {
if(self._layer.minzoomVisible > location.data.zoom){
// Not enough zoom
return;
}
registerFreshness(key, tileFreshness)
const tileBbox = BBox.fromTileIndex(key)
currentBounds.addCallbackAndRunD(bbox => {
if(bbox.overlapsWith(tileBbox)){
// The current tile should be loaded from disk
this.GetIdb(key).then((features:{feature: any, freshness: Date}[] ) => {
console.log("Loaded tile "+self._layer.id+"_"+key+" from disk")
const src = new SimpleFeatureSource(self._flayer, key, new UIEventSource<{feature: any; freshness: Date}[]>(features))
registerTile(src)
})
return true; // only load once: unregister
// Iterate over all available keys in the local storage, check which are needed and fresh enough
for (const key of Array.from(tiles.keys())) {
const tileFreshness = tiles.get(key)
if (tileFreshness > self.initializeTime) {
// This tile is loaded by another source
continue
}
})
}
registerFreshness(key, tileFreshness)
const tileBbox = BBox.fromTileIndex(key)
if (!bbox.overlapsWith(tileBbox)) {
continue;
}
if (loadedTiles.has(key)) {
// Already loaded earlier
continue
}
loadedTiles.add(key)
this.GetIdb(key).then((features: { feature: any, freshness: Date }[]) => {
console.debug("Loaded tile " + self._layer.id + "_" + key + " from disk")
const src = new SimpleFeatureSource(self._flayer, key, new UIEventSource<{ feature: any; freshness: Date }[]>(features))
registerTile(src)
})
}
})
return true; // Remove the callback
})
}
private SetIdb(tileIndex, data){
IdbLocalStorage.SetDirectly(this._layer.id+"_"+tileIndex, data)
}
private GetIdb(tileIndex){
return IdbLocalStorage.GetDirectly(this._layer.id+"_"+tileIndex)
}
public addTile(tile: FeatureSource & Tiled){
public addTile(tile: FeatureSource & Tiled) {
const self = this
tile.features.addCallbackAndRunD(features => {
const now = new Date()
if (features.length > 0) {
self.SetIdb(tile.tileIndex, features)
self.SetIdb(tile.tileIndex, features)
}
// We _still_ write the time to know that this tile is empty!
this.MarkVisited(tile.tileIndex, now)
})
}
public poison(lon: number, lat: number) {
for (let z = 0; z < 25; z++) {
const {x, y} = Tiles.embedded_tile(lat, lon, z)
@ -110,6 +115,14 @@ export default class SaveTileToLocalStorageActor {
public MarkVisited(tileId: number, freshness: Date) {
this.visitedTiles.data.set(tileId, freshness)
this.visitedTiles.ping()
this.visitedTiles.ping()
}
private SetIdb(tileIndex, data) {
IdbLocalStorage.SetDirectly(this._layer.id + "_" + tileIndex, data)
}
private GetIdb(tileIndex) {
return IdbLocalStorage.GetDirectly(this._layer.id + "_" + tileIndex)
}
}

10
Logic/FeatureSource/FeaturePipeline.ts
View file

@ -157,7 +157,7 @@ export default class FeaturePipeline {
// We load the cached values and register them
// Getting data from upstream happens a bit lower
localTileSaver.LoadTilesFromDisk(
state.currentBounds,
state.currentBounds, state.locationControl,
(tileIndex, freshness) => self.freshnesses.get(id).addTileLoad(tileIndex, freshness),
(tile) => {
new RegisteringAllFromFeatureSourceActor(tile)
@ -221,7 +221,13 @@ export default class FeaturePipeline {
state.filteredLayers.data.forEach(flayer => {
const layer = flayer.layerDef
if (layer.maxAgeOfCache > 0) {
self.localStorageSavers.get(layer.id).MarkVisited(tileId, new Date())
const saver = self.localStorageSavers.get(layer.id)
if(saver === undefined){
console.warn("No local storage saver found for ", layer.id)
}else{
saver.MarkVisited(tileId, new Date())
}
}
self.freshnesses.get(layer.id).addTileLoad(tileId, new Date())
})

46
Logic/State/MapState.ts
View file

@ -3,7 +3,6 @@ import {UIEventSource} from "../UIEventSource";
import BaseLayer from "../../Models/BaseLayer";
import LayoutConfig from "../../Models/ThemeConfig/LayoutConfig";
import AvailableBaseLayers from "../Actors/AvailableBaseLayers";
import BackgroundLayerResetter from "../Actors/BackgroundLayerResetter";
import Attribution from "../../UI/BigComponents/Attribution";
import Minimap, {MinimapObj} from "../../UI/Base/Minimap";
import {Tiles} from "../../Models/TileRange";
@ -84,35 +83,17 @@ export default class MapState extends UserRelatedState {
this.availableBackgroundLayers = AvailableBaseLayers.AvailableLayersAt(this.locationControl);
this.backgroundLayer = this.backgroundLayerId.map(
(selectedId: string) => {
if (selectedId === undefined) {
return AvailableBaseLayers.osmCarto;
}
const available = this.availableBackgroundLayers.data;
for (const layer of available) {
if (layer.id === selectedId) {
return layer;
}
}
return AvailableBaseLayers.osmCarto;
},
[this.availableBackgroundLayers],
(layer) => layer.id
);
/*
* Selects a different background layer if the background layer has no coverage at the current location
*/
new BackgroundLayerResetter(
this.backgroundLayer,
this.locationControl,
this.availableBackgroundLayers,
this.layoutToUse.defaultBackgroundId
);
let defaultLayer = AvailableBaseLayers.osmCarto
const available = this.availableBackgroundLayers.data;
for (const layer of available) {
if (this.backgroundLayerId.data === layer.id) {
defaultLayer = layer;
}
}
const self = this
this.backgroundLayer = new UIEventSource<BaseLayer>(defaultLayer)
this.backgroundLayer.addCallbackAndRunD(layer => self.backgroundLayerId.setData(layer.id))
const attr = new Attribution(
this.locationControl,
this.osmConnection.userDetails,
@ -334,10 +315,7 @@ export default class MapState extends UserRelatedState {
const filtersPerName = new Map<string, FilterConfig>()
layer.filters.forEach(f => filtersPerName.set(f.id, f))
const qp = QueryParameters.GetQueryParameter("filter-" + layer.id, "", "Filtering state for a layer")
flayer.appliedFilters.map(filters => {
filters = filters ?? []
return filters.map(f => f.filter.id + "." + f.selected).join(",")
}, [], textual => {
flayer.appliedFilters.map(filters => (filters ?? []).map(f => f.filter.id + "." + f.selected).join(","), [], textual => {
if (textual.length === 0) {
return empty
}