2020-08-30 01:13:18 +02:00
|
|
|
import {Or, TagsFilter} from "./Tags";
|
2020-08-17 17:23:15 +02:00
|
|
|
import {UIEventSource} from "./UIEventSource";
|
2020-06-24 00:35:19 +02:00
|
|
|
import {FilteredLayer} from "./FilteredLayer";
|
2020-07-30 00:59:08 +02:00
|
|
|
import {Bounds} from "./Bounds";
|
|
|
|
import {Overpass} from "./Osm/Overpass";
|
2020-07-31 01:45:54 +02:00
|
|
|
import {State} from "../State";
|
2020-09-02 11:37:34 +02:00
|
|
|
import {LayerDefinition} from "../Customizations/LayerDefinition";
|
2020-06-24 00:35:19 +02:00
|
|
|
|
|
|
|
export class LayerUpdater {
|
|
|
|
|
2020-08-28 03:16:21 +02:00
|
|
|
public readonly sufficentlyZoomed: UIEventSource<boolean>;
|
2020-06-24 00:35:19 +02:00
|
|
|
public readonly runningQuery: UIEventSource<boolean> = new UIEventSource<boolean>(false);
|
2020-07-30 11:30:04 +02:00
|
|
|
public readonly retries: UIEventSource<number> = new UIEventSource<number>(0);
|
2020-08-27 18:44:16 +02:00
|
|
|
/**
|
2020-08-28 03:16:21 +02:00
|
|
|
* The previous bounds for which the query has been run at the given zoom level
|
|
|
|
*
|
|
|
|
* Note that some layers only activate on a certain zoom level.
|
|
|
|
* If the map location changes, we check for each layer if it is loaded:
|
|
|
|
* we start checking the bounds at the first zoom level the layer might operate. If in bounds - no reload needed, otherwise we continue walking down
|
2020-06-24 00:35:19 +02:00
|
|
|
*/
|
2020-08-30 01:13:18 +02:00
|
|
|
private readonly previousBounds: Map<number, Bounds[]> = new Map<number, Bounds[]>();
|
2020-06-24 00:35:19 +02:00
|
|
|
|
2020-09-15 02:29:31 +02:00
|
|
|
private readonly state: State;
|
|
|
|
|
2020-06-24 00:35:19 +02:00
|
|
|
/**
|
|
|
|
* The most important layer should go first, as that one gets first pick for the questions
|
|
|
|
*/
|
2020-07-31 16:17:16 +02:00
|
|
|
constructor(state: State) {
|
2020-09-15 02:29:31 +02:00
|
|
|
this.state = state;
|
2020-06-24 00:35:19 +02:00
|
|
|
const self = this;
|
2020-08-28 03:16:21 +02:00
|
|
|
|
2020-08-30 01:13:18 +02:00
|
|
|
this.sufficentlyZoomed = State.state.locationControl.map(location => {
|
2020-09-02 11:37:34 +02:00
|
|
|
let minzoom = Math.min(...state.layoutToUse.data.layers.map(layer => (layer as LayerDefinition).minzoom ?? 18));
|
2020-08-30 01:13:18 +02:00
|
|
|
return location.zoom >= minzoom;
|
|
|
|
}, [state.layoutToUse]
|
|
|
|
);
|
2020-08-28 03:16:21 +02:00
|
|
|
for (let i = 0; i < 25; i++) {
|
|
|
|
// This update removes all data on all layers -> erase the map on lower levels too
|
|
|
|
this.previousBounds.set(i, []);
|
|
|
|
}
|
2020-07-31 16:17:16 +02:00
|
|
|
state.locationControl.addCallback(() => {
|
|
|
|
self.update(state)
|
2020-06-24 00:35:19 +02:00
|
|
|
});
|
2020-07-31 16:17:16 +02:00
|
|
|
state.layoutToUse.addCallback(() => {
|
|
|
|
self.update(state)
|
|
|
|
});
|
2020-08-26 20:11:43 +02:00
|
|
|
|
2020-07-31 16:17:16 +02:00
|
|
|
self.update(state);
|
|
|
|
}
|
2020-06-24 00:35:19 +02:00
|
|
|
|
2020-07-31 16:17:16 +02:00
|
|
|
private GetFilter(state: State) {
|
2020-08-30 01:13:18 +02:00
|
|
|
const filters: TagsFilter[] = [];
|
2020-07-31 16:17:16 +02:00
|
|
|
state = state ?? State.state;
|
|
|
|
for (const layer of state.layoutToUse.data.layers) {
|
2020-09-02 11:37:34 +02:00
|
|
|
if(typeof(layer) === "string"){
|
|
|
|
continue;
|
|
|
|
}
|
2020-07-31 16:17:16 +02:00
|
|
|
if (state.locationControl.data.zoom < layer.minzoom) {
|
2020-08-28 03:16:21 +02:00
|
|
|
continue;
|
|
|
|
}
|
|
|
|
// Check if data for this layer has already been loaded
|
|
|
|
let previouslyLoaded = false;
|
|
|
|
for (let z = layer.minzoom; z < 25 && !previouslyLoaded; z++) {
|
|
|
|
const previousLoadedBounds = this.previousBounds.get(z);
|
2020-08-31 02:59:47 +02:00
|
|
|
if (previousLoadedBounds === undefined) {
|
2020-08-28 03:16:21 +02:00
|
|
|
continue;
|
|
|
|
}
|
|
|
|
for (const previousLoadedBound of previousLoadedBounds) {
|
|
|
|
previouslyLoaded = previouslyLoaded || this.IsInBounds(state, previousLoadedBound);
|
|
|
|
if(previouslyLoaded){
|
|
|
|
break;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
if (previouslyLoaded) {
|
2020-08-26 20:11:43 +02:00
|
|
|
continue;
|
2020-07-31 16:17:16 +02:00
|
|
|
}
|
|
|
|
filters.push(layer.overpassFilter);
|
|
|
|
}
|
|
|
|
if (filters.length === 0) {
|
|
|
|
return undefined;
|
|
|
|
}
|
|
|
|
return new Or(filters);
|
2020-06-24 00:35:19 +02:00
|
|
|
}
|
|
|
|
|
|
|
|
private handleData(geojson: any) {
|
2020-07-27 00:14:34 +02:00
|
|
|
const self = this;
|
2020-07-31 16:17:16 +02:00
|
|
|
|
|
|
|
self.retries.setData(0);
|
|
|
|
|
2020-07-27 00:14:34 +02:00
|
|
|
function renderLayers(layers: FilteredLayer[]) {
|
|
|
|
if (layers.length === 0) {
|
|
|
|
self.runningQuery.setData(false);
|
2020-06-24 00:35:19 +02:00
|
|
|
|
2020-07-27 00:14:34 +02:00
|
|
|
if (geojson.features.length > 0) {
|
2020-08-31 02:59:47 +02:00
|
|
|
console.warn("Got some leftovers: ", geojson)
|
2020-07-27 00:14:34 +02:00
|
|
|
}
|
|
|
|
return;
|
|
|
|
}
|
2020-08-28 03:16:21 +02:00
|
|
|
// We use window.setTimeout to give JS some time to update everything and make the interface not too laggy
|
2020-07-27 00:14:34 +02:00
|
|
|
window.setTimeout(() => {
|
|
|
|
const layer = layers[0];
|
|
|
|
const rest = layers.slice(1, layers.length);
|
|
|
|
geojson = layer.SetApplicableData(geojson);
|
|
|
|
renderLayers(rest);
|
|
|
|
}, 50)
|
2020-06-24 00:35:19 +02:00
|
|
|
}
|
2020-07-31 16:17:16 +02:00
|
|
|
|
|
|
|
renderLayers(State.state.filteredLayers.data);
|
2020-06-24 00:35:19 +02:00
|
|
|
}
|
|
|
|
|
2020-07-31 16:17:16 +02:00
|
|
|
private handleFail(state: State, reason: any) {
|
|
|
|
this.retries.data++;
|
|
|
|
this.ForceRefresh();
|
2020-07-30 11:30:04 +02:00
|
|
|
console.log(`QUERY FAILED (retrying in ${5 * this.retries.data} sec)`, reason);
|
|
|
|
this.retries.ping();
|
2020-06-27 03:06:51 +02:00
|
|
|
const self = this;
|
2020-07-25 18:00:08 +02:00
|
|
|
window?.setTimeout(
|
2020-07-31 16:17:16 +02:00
|
|
|
function () {
|
|
|
|
self.update(state)
|
|
|
|
}, this.retries.data * 5000
|
2020-06-27 03:06:51 +02:00
|
|
|
)
|
2020-07-31 16:17:16 +02:00
|
|
|
|
2020-06-24 00:35:19 +02:00
|
|
|
}
|
|
|
|
|
|
|
|
|
2020-07-31 16:17:16 +02:00
|
|
|
private update(state: State): void {
|
|
|
|
const filter = this.GetFilter(state);
|
|
|
|
if (filter === undefined) {
|
2020-06-24 00:35:19 +02:00
|
|
|
return;
|
|
|
|
}
|
|
|
|
|
|
|
|
if (this.runningQuery.data) {
|
|
|
|
console.log("Still running a query, skip");
|
2020-07-31 16:17:16 +02:00
|
|
|
return;
|
2020-06-24 00:35:19 +02:00
|
|
|
}
|
2020-07-30 00:59:08 +02:00
|
|
|
|
2020-07-31 16:17:16 +02:00
|
|
|
const bounds = state.bm.map.getBounds();
|
|
|
|
|
|
|
|
const diff = state.layoutToUse.data.widenFactor;
|
2020-07-30 00:59:08 +02:00
|
|
|
|
2020-08-26 20:11:43 +02:00
|
|
|
const n = Math.min(90, bounds.getNorth() + diff);
|
2020-08-28 03:16:21 +02:00
|
|
|
const e = Math.min(180, bounds.getEast() + diff);
|
2020-08-26 20:11:43 +02:00
|
|
|
const s = Math.max(-90, bounds.getSouth() - diff);
|
|
|
|
const w = Math.max(-180, bounds.getWest() - diff);
|
2020-08-28 03:16:21 +02:00
|
|
|
const queryBounds = {north: n, east: e, south: s, west: w};
|
2020-07-30 00:59:08 +02:00
|
|
|
|
2020-08-30 01:13:18 +02:00
|
|
|
const z = Math.floor(state.locationControl.data.zoom);
|
2020-07-31 16:17:16 +02:00
|
|
|
|
2020-06-24 00:35:19 +02:00
|
|
|
this.runningQuery.setData(true);
|
|
|
|
const self = this;
|
2020-07-31 16:17:16 +02:00
|
|
|
const overpass = new Overpass(filter);
|
2020-08-28 03:16:21 +02:00
|
|
|
overpass.queryGeoJson(queryBounds,
|
2020-06-24 00:35:19 +02:00
|
|
|
function (data) {
|
2020-08-30 01:13:18 +02:00
|
|
|
self.previousBounds.get(z).push(queryBounds);
|
2020-06-24 00:35:19 +02:00
|
|
|
self.handleData(data)
|
|
|
|
},
|
|
|
|
function (reason) {
|
2020-07-31 16:17:16 +02:00
|
|
|
self.handleFail(state, reason)
|
2020-06-24 00:35:19 +02:00
|
|
|
}
|
|
|
|
);
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
2020-08-28 03:16:21 +02:00
|
|
|
private IsInBounds(state: State, bounds: Bounds): boolean {
|
2020-06-24 00:35:19 +02:00
|
|
|
if (this.previousBounds === undefined) {
|
|
|
|
return false;
|
|
|
|
}
|
|
|
|
|
2020-07-31 16:17:16 +02:00
|
|
|
const b = state.bm.map.getBounds();
|
2020-08-30 01:13:18 +02:00
|
|
|
return b.getSouth() >= bounds.south &&
|
|
|
|
b.getNorth() <= bounds.north &&
|
|
|
|
b.getEast() <= bounds.east &&
|
|
|
|
b.getWest() >= bounds.west;
|
2020-06-24 00:35:19 +02:00
|
|
|
}
|
2020-07-31 16:17:16 +02:00
|
|
|
|
2020-08-30 01:13:18 +02:00
|
|
|
public ForceRefresh() {
|
|
|
|
for (let i = 0; i < 25; i++) {
|
|
|
|
this.previousBounds.set(i, []);
|
|
|
|
}
|
2020-09-15 02:29:31 +02:00
|
|
|
this.update(this.state);
|
2020-07-31 16:17:16 +02:00
|
|
|
}
|
2020-06-24 00:35:19 +02:00
|
|
|
|
|
|
|
}
|