Merge develop

This commit is contained in:
Pieter Vander Vennet 2021-10-26 01:27:35 +02:00
commit 07bc5d6a6d
88 changed files with 3284 additions and 2363 deletions

View file

@ -10,7 +10,7 @@ import LayoutConfig from "../../Models/ThemeConfig/LayoutConfig";
* Makes sure the hash shows the selected element and vice-versa.
*/
export default class SelectedFeatureHandler {
private static readonly _no_trigger_on = new Set(["welcome", "copyright", "layers", "new", "", undefined])
private static readonly _no_trigger_on = new Set(["welcome", "copyright", "layers", "new", "filter","", undefined])
private readonly hash: UIEventSource<string>;
private readonly state: {
selectedElement: UIEventSource<any>,
@ -70,7 +70,7 @@ export default class SelectedFeatureHandler {
this.initialLoad()
}
/**
* On startup: check if the hash is loaded and eventually zoom to it
@ -85,6 +85,11 @@ export default class SelectedFeatureHandler {
return;
}
if (!(hash.startsWith("node") || hash.startsWith("way") || hash.startsWith("relation"))) {
return;
}
OsmObject.DownloadObjectAsync(hash).then(obj => {
try {
@ -129,26 +134,25 @@ export default class SelectedFeatureHandler {
// If a feature is selected via the hash, zoom there
private zoomToSelectedFeature() {
const selected = this.state.selectedElement.data
if(selected === undefined){
if (selected === undefined) {
return
}
const centerpoint= GeoOperations.centerpointCoordinates(selected)
const centerpoint = GeoOperations.centerpointCoordinates(selected)
const location = this.state.locationControl;
location.data.lon = centerpoint[0]
location.data.lat = centerpoint[1]
const minZoom = Math.max(14, ...(this.state.layoutToUse?.layers?.map(l => l.minzoomVisible) ?? []))
if(location.data.zoom < minZoom ){
if (location.data.zoom < minZoom) {
location.data.zoom = minZoom
}
location.ping();
}
}

View file

@ -4,13 +4,14 @@
* Technically, more an Actor then a featuresource, but it fits more neatly this ay
*/
import {FeatureSourceForLayer} from "../FeatureSource";
import {Tiles} from "../../../Models/TileRange";
export default class SaveTileToLocalStorageActor {
public static readonly storageKey: string = "cached-features";
public static readonly formatVersion: string = "2"
constructor(source: FeatureSourceForLayer, tileIndex: number) {
source.features.addCallbackAndRunD(features => {
const key = `${SaveTileToLocalStorageActor.storageKey}-${source.layer.layerDef.id}-${tileIndex}`
const now = new Date()
@ -28,13 +29,30 @@ export default class SaveTileToLocalStorageActor {
}
public static MarkVisited(layerId: string, tileId: number, freshness: Date){
public static MarkVisited(layerId: string, tileId: number, freshness: Date) {
const key = `${SaveTileToLocalStorageActor.storageKey}-${layerId}-${tileId}`
try{
try {
localStorage.setItem(key + "-time", JSON.stringify(freshness.getTime()))
localStorage.setItem(key + "-format", SaveTileToLocalStorageActor.formatVersion)
}catch(e){
} catch (e) {
console.error("Could not mark tile ", key, "as visited")
}
}
public static poison(layers: string[], lon: number, lat: number) {
for (let z = 0; z < 25; z++) {
const {x, y} = Tiles.embedded_tile(lat, lon, z)
const tileId = Tiles.tile_index(z, x, y)
for (const layerId of layers) {
const key = `${SaveTileToLocalStorageActor.storageKey}-${layerId}-${tileId}`
localStorage.removeItem(key + "-time");
localStorage.removeItem(key + "-format")
localStorage.removeItem(key)
}
}
}
}

View file

@ -30,14 +30,14 @@ import TileFreshnessCalculator from "./TileFreshnessCalculator";
/**
* The features pipeline ties together a myriad of various datasources:
*
*
* - The Overpass-API
* - The OSM-API
* - Third-party geojson files, either sliced or directly.
*
*
* In order to truly understand this class, please have a look at the following diagram: https://cdn-images-1.medium.com/fit/c/800/618/1*qTK1iCtyJUr4zOyw4IFD7A.jpeg
*
*
*
*
*/
export default class FeaturePipeline {
@ -68,7 +68,7 @@ export default class FeaturePipeline {
private readonly freshnesses = new Map<string, TileFreshnessCalculator>();
private readonly oldestAllowedDate: Date = new Date(new Date().getTime() - 60 * 60 * 24 * 30 * 1000);
private readonly oldestAllowedDate: Date;
private readonly osmSourceZoomLevel
constructor(
@ -90,10 +90,23 @@ export default class FeaturePipeline {
this.state = state;
const self = this
const expiryInSeconds = Math.min(...state.layoutToUse.layers.map(l => l.maxAgeOfCache))
for (const layer of state.layoutToUse.layers) {
TiledFromLocalStorageSource.cleanCacheForLayer(layer)
}
this.oldestAllowedDate = new Date(new Date().getTime() - expiryInSeconds);
this.osmSourceZoomLevel = state.osmApiTileSize.data;
// milliseconds
const useOsmApi = state.locationControl.map(l => l.zoom > (state.overpassMaxZoom.data ?? 12))
this.relationTracker = new RelationsTracker()
state.changes.allChanges.addCallbackAndRun(allChanges => {
allChanges.filter(ch => ch.id < 0 && ch.changes !== undefined)
.map(ch => ch.changes)
.filter(coor => coor["lat"] !== undefined && coor["lon"] !== undefined)
.forEach(coor => {
SaveTileToLocalStorageActor.poison(state.layoutToUse.layers.map(l => l.id), coor["lon"], coor["lat"])
})
})
this.sufficientlyZoomed = state.locationControl.map(location => {
@ -218,7 +231,7 @@ export default class FeaturePipeline {
maxZoomLevel: state.layoutToUse.clustering.maxZoom,
registerTile: (tile) => {
// We save the tile data for the given layer to local storage
if(source.layer.layerDef.source.geojsonSource === undefined || source.layer.layerDef.source.isOsmCacheLayer == true){
if (source.layer.layerDef.source.geojsonSource === undefined || source.layer.layerDef.source.isOsmCacheLayer == true) {
new SaveTileToLocalStorageActor(tile, tile.tileIndex)
}
perLayerHierarchy.get(source.layer.layerDef.id).registerTile(new RememberingSource(tile))
@ -255,7 +268,7 @@ export default class FeaturePipeline {
this.runningQuery = updater.runningQuery.map(
overpass => {
console.log("FeaturePipeline: runningQuery state changed. Overpass", overpass ? "is querying," : "is idle,",
"osmFeatureSource is", osmFeatureSource.isRunning ? "is running and needs "+neededTilesFromOsm.data?.length+" tiles (already got "+ osmFeatureSource.downloadedTiles.size +" tiles )" : "is idle")
"osmFeatureSource is", osmFeatureSource.isRunning ? "is running and needs " + neededTilesFromOsm.data?.length + " tiles (already got " + osmFeatureSource.downloadedTiles.size + " tiles )" : "is idle")
return overpass || osmFeatureSource.isRunning.data;
}, [osmFeatureSource.isRunning]
)
@ -351,7 +364,7 @@ export default class FeaturePipeline {
isActive: useOsmApi.map(b => !b && overpassIsActive.data, [overpassIsActive]),
onBboxLoaded: (bbox, date, downloadedLayers, paddedToZoomLevel) => {
Tiles.MapRange(bbox.containingTileRange(paddedToZoomLevel), (x, y) => {
const tileIndex = Tiles.tile_index(paddedToZoomLevel, x, y)
const tileIndex = Tiles.tile_index(paddedToZoomLevel, x, y)
downloadedLayers.forEach(layer => {
self.freshnesses.get(layer.id).addTileLoad(tileIndex, date)
SaveTileToLocalStorageActor.MarkVisited(layer.id, tileIndex, date)
@ -410,7 +423,7 @@ export default class FeaturePipeline {
}
public GetFeaturesWithin(layerId: string, bbox: BBox): any[][] {
if(layerId === "*"){
if (layerId === "*") {
return this.GetAllFeaturesWithin(bbox)
}
const requestedHierarchy = this.perLayerHierarchy.get(layerId)

View file

@ -5,6 +5,7 @@ import TileHierarchy from "./TileHierarchy";
import SaveTileToLocalStorageActor from "../Actors/SaveTileToLocalStorageActor";
import {Tiles} from "../../../Models/TileRange";
import {BBox} from "../../BBox";
import LayerConfig from "../../../Models/ThemeConfig/LayerConfig";
export default class TiledFromLocalStorageSource implements TileHierarchy<FeatureSourceForLayer & Tiled> {
public readonly loadedTiles: Map<number, FeatureSourceForLayer & Tiled> = new Map<number, FeatureSourceForLayer & Tiled>();
@ -16,7 +17,7 @@ export default class TiledFromLocalStorageSource implements TileHierarchy<Featur
const prefix = SaveTileToLocalStorageActor.storageKey + "-" + layerId + "-"
const freshnesses = new Map<number, Date>()
for (const key of Object.keys(localStorage)) {
if(!(key.startsWith(prefix) && key.endsWith("-time"))){
if (!(key.startsWith(prefix) && key.endsWith("-time"))) {
continue
}
const index = Number(key.substring(prefix.length, key.length - "-time".length))
@ -28,6 +29,28 @@ export default class TiledFromLocalStorageSource implements TileHierarchy<Featur
return freshnesses
}
static cleanCacheForLayer(layer: LayerConfig) {
const now = new Date()
const prefix = SaveTileToLocalStorageActor.storageKey + "-" + layer.id + "-"
console.log("Cleaning tiles of ", prefix, "with max age",layer.maxAgeOfCache)
for (const key of Object.keys(localStorage)) {
if (!(key.startsWith(prefix) && key.endsWith("-time"))) {
continue
}
const index = Number(key.substring(prefix.length, key.length - "-time".length))
const time = Number(localStorage.getItem(key))
const timeDiff = (now.getTime() - time) / 1000
if(timeDiff >= layer.maxAgeOfCache){
const k = prefix+index;
localStorage.removeItem(k)
localStorage.removeItem(k+"-format")
localStorage.removeItem(k+"-time")
}
}
}
constructor(layer: FilteredLayer,
handleFeatureSource: (src: FeatureSourceForLayer & Tiled, index: number) => void,
state: {
@ -36,7 +59,7 @@ export default class TiledFromLocalStorageSource implements TileHierarchy<Featur
this.layer = layer;
this.handleFeatureSource = handleFeatureSource;
this.undefinedTiles = new Set<number>()
const prefix = SaveTileToLocalStorageActor.storageKey + "-" + layer.layerDef.id + "-"
const knownTiles: number[] = Object.keys(localStorage)
@ -56,9 +79,9 @@ export default class TiledFromLocalStorageSource implements TileHierarchy<Featur
if (version === undefined || version !== SaveTileToLocalStorageActor.formatVersion) {
// Invalid version! Remove this tile from local storage
localStorage.removeItem(prefix)
localStorage.removeItem(prefix+"-time")
localStorage.removeItem(prefix+"-format")
this. undefinedTiles.add(index)
localStorage.removeItem(prefix + "-time")
localStorage.removeItem(prefix + "-format")
this.undefinedTiles.add(index)
console.log("Dropped old format tile", prefix)
}
}
@ -66,19 +89,19 @@ export default class TiledFromLocalStorageSource implements TileHierarchy<Featur
const self = this
state.currentBounds.map(bounds => {
if(bounds === undefined){
if (bounds === undefined) {
return;
}
for (const knownTile of knownTiles) {
if(this.loadedTiles.has(knownTile)){
if (this.loadedTiles.has(knownTile)) {
continue;
}
if(this.undefinedTiles.has(knownTile)){
if (this.undefinedTiles.has(knownTile)) {
continue;
}
if(!bounds.overlapsWith(BBox.fromTileIndex(knownTile))){
if (!bounds.overlapsWith(BBox.fromTileIndex(knownTile))) {
continue;
}
self.loadTile(knownTile)
@ -86,8 +109,8 @@ export default class TiledFromLocalStorageSource implements TileHierarchy<Featur
})
}
private loadTile( neededIndex: number){
private loadTile(neededIndex: number) {
try {
const key = SaveTileToLocalStorageActor.storageKey + "-" + this.layer.layerDef.id + "-" + neededIndex
const data = localStorage.getItem(key)

View file

@ -144,31 +144,20 @@ export default class FeatureSwitchState {
}
this.featureSwitchIsTesting = QueryParameters.GetQueryParameter(
this.featureSwitchIsTesting = QueryParameters.GetBooleanQueryParameter(
"test",
""+testingDefaultValue,
"If true, 'dryrun' mode is activated. The app will behave as normal, except that changes to OSM will be printed onto the console instead of actually uploaded to osm.org"
).map(
(str) => str === "true",
[],
(b) => "" + b
);
)
this.featureSwitchIsDebugging = QueryParameters.GetQueryParameter(
this.featureSwitchIsDebugging = QueryParameters.GetBooleanQueryParameter(
"debug",
"false",
"If true, shows some extra debugging help such as all the available tags on every object"
).map(
(str) => str === "true",
[],
(b) => "" + b
);
)
this.featureSwitchFakeUser = QueryParameters.GetQueryParameter("fake-user", "false",
this.featureSwitchFakeUser = QueryParameters.GetBooleanQueryParameter("fake-user", "false",
"If true, 'dryrun' mode is activated and a fake user account is loaded")
.map(str => str === "true", [], b => "" + b);
this.overpassUrl = QueryParameters.GetQueryParameter("overpassUrl",

View file

@ -119,7 +119,7 @@ export default class MapState extends UserRelatedState {
this.overlayToggles = this.layoutToUse.tileLayerSources.filter(c => c.name !== undefined).map(c => ({
config: c,
isDisplayed: QueryParameters.GetQueryParameter("overlay-" + c.id, "" + c.defaultState, "Wether or not the overlay " + c.id + " is shown").map(str => str === "true", [], b => "" + b)
isDisplayed: QueryParameters.GetBooleanQueryParameter("overlay-" + c.id, "" + c.defaultState, "Wether or not the overlay " + c.id + " is shown")
}))
this.filteredLayers = this.InitializeFilteredLayers()
@ -170,17 +170,12 @@ export default class MapState extends UserRelatedState {
.map(value => value === "yes", [], enabled => {
return enabled ? "yes" : "";
})
isDisplayed.addCallbackAndRun(d => console.log("IsDisplayed for layer", layer.id, "is currently", d))
} else {
isDisplayed = QueryParameters.GetQueryParameter(
isDisplayed = QueryParameters.GetBooleanQueryParameter(
"layer-" + layer.id,
"true",
"Wether or not layer " + layer.id + " is shown"
).map<boolean>(
(str) => str !== "false",
[],
(b) => b.toString()
);
)
}
const flayer = {
isDisplayed: isDisplayed,

View file

@ -55,6 +55,10 @@ export class QueryParameters {
return source;
}
public static GetBooleanQueryParameter(key: string, deflt: string, documentation?: string): UIEventSource<boolean>{
return QueryParameters.GetQueryParameter(key, deflt, documentation).map(str => str === "true", [], b => ""+b)
}
public static GenerateQueryParameterDocs(): string {
const docs = [QueryParameters.QueryParamDocsIntro];
for (const key in QueryParameters.documentation) {