Stabilize popup

This commit is contained in:
pietervdvn 2021-05-07 01:43:32 +02:00
parent 729f28fbf5
commit 292bad5df7
6 changed files with 74 additions and 45 deletions

View file

@ -21,27 +21,48 @@ export default class FeatureSourceMerger implements FeatureSource {
}
private Update() {
let all = {}; // Mapping 'id' -> {feature, freshness}
let somethingChanged = false;
const all: Map<string, { feature: any, freshness: Date }> = new Map<string, { feature: any; freshness: Date }>();
// We seed the dictionary with the previously loaded features
const oldValues = this.features.data ?? [];
for (const oldValue of oldValues) {
all.set(oldValue.feature.id, oldValue)
}
for (const source of this._sources) {
if (source?.features?.data === undefined) {
continue;
}
for (const f of source.features.data) {
const id = f.feature.properties.id;
const oldV = all[id];
if (oldV === undefined) {
all[id] = f;
} else {
if (oldV.freshness < f.freshness) {
all[id] = f;
}
if (!all.has(id)) {
// This is a new feature
somethingChanged = true;
all.set(id, f);
continue;
}
// This value has been seen already, either in a previous run or by a previous datasource
// Let's figure out if something changed
const oldV = all.get(id);
if (oldV.freshness < f.freshness) {
// Jup, this feature is fresher
all.set(id, f);
somethingChanged = true;
}
}
}
const newList = [];
for (const id in all) {
newList.push(all[id]);
if(!somethingChanged){
// We don't bother triggering an update
return;
}
const newList = [];
all.forEach((value, key) => {
newList.push(value)
})
this.features.setData(newList);
}

View file

@ -34,7 +34,7 @@ export default class FilteringFeatureSource implements FeatureSource {
const newFeatures = features.filter(f => {
const layerId = f.feature._matching_layer_id;
if(selectedElement.data === f.feature){
if(selectedElement.data !== undefined && selectedElement.data?.id === f.feature.id){
// This is the selected object - it gets a free pass even if zoom is not sufficient
return true;
}

View file

@ -22,10 +22,8 @@ export default class OsmApiFeatureSource implements FeatureSource {
public load(id: string) {
console.log("Updating from OSM API: ", id)
OsmObject.DownloadObject(id, (element, meta) => {
const geojson = element.asGeoJson();
console.warn(geojson)
geojson.id = geojson.properties.id;
this.features.setData([{feature: geojson, freshness: meta["_last_edit:timestamp"]}])
})

View file

@ -67,6 +67,36 @@ export abstract class OsmObject {
})
}
private static ParseObjects(elements: any[]) : OsmObject[]{
const objects: OsmObject[] = [];
const allNodes: Map<number, OsmNode> = new Map<number, OsmNode>()
for (const element of elements) {
const type = element.type;
const idN = element.id;
let osmObject: OsmObject = null
switch (type) {
case("node"):
const node = new OsmNode(idN);
allNodes.set(idN, node);
osmObject = node
node.SaveExtraData(element);
break;
case("way"):
osmObject = new OsmWay(idN);
const nodes = element.nodes.map(i => allNodes.get(i));
osmObject.SaveExtraData(element, nodes)
break;
case("relation"):
osmObject = new OsmRelation(idN);
osmObject.SaveExtraData(element, [])
break;
}
osmObject.LoadData(element)
objects.push(osmObject)
}
return objects;
}
//Loads an area from the OSM-api.
// bounds should be: [[maxlat, minlon], [minlat, maxlon]] (same as Utils.tile_bounds)
public static LoadArea(bounds: [[number, number], [number, number]], callback: (objects: OsmObject[]) => void) {
@ -77,32 +107,7 @@ export abstract class OsmObject {
const url = `https://www.openstreetmap.org/api/0.6/map.json?bbox=${minlon},${minlat},${maxlon},${maxlat}`
$.getJSON(url, data => {
const elements: any[] = data.elements;
const objects: OsmObject[] = [];
const allNodes: Map<number, OsmNode> = new Map<number, OsmNode>()
for (const element of elements) {
const type = element.type;
const idN = element.id;
let osmObject: OsmObject = null
switch (type) {
case("node"):
const node = new OsmNode(idN);
allNodes.set(idN, node);
osmObject = node
node.SaveExtraData(element);
break;
case("way"):
osmObject = new OsmWay(idN);
const nodes = element.nodes.map(i => allNodes.get(i));
osmObject.SaveExtraData(element, nodes)
break;
case("relation"):
osmObject = new OsmRelation(idN);
osmObject.SaveExtraData(element, [])
break;
}
osmObject.LoadData(element)
objects.push(osmObject)
}
const objects = OsmObject.ParseObjects(elements)
callback(objects);
})
@ -157,10 +162,16 @@ export abstract class OsmObject {
const full = this.type !== "way" ? "" : "/full";
const url = "https://www.openstreetmap.org/api/0.6/" + this.type + "/" + this.id + full;
$.getJSON(url, function (data) {
const element = data.elements[data.elements.length - 1];
const element = data.elements.pop();
let nodes = []
if(data.elements.length > 2){
nodes = OsmObject.ParseObjects(data.elements)
}
self.LoadData(element)
self.SaveExtraData(element, data.elements);
self.SaveExtraData(element, nodes);
continuation(self, {
"_last_edit:contributor": element.user,

View file

@ -2,7 +2,7 @@ import { Utils } from "../Utils";
export default class Constants {
public static vNumber = "0.7.1";
public static vNumber = "0.7.1b";
// The user journey states thresholds when a new feature gets unlocked
public static userJourney = {

View file

@ -162,9 +162,8 @@ export default class ShowDataLayer {
leafletLayer.on("popupopen", () => {
State.state.selectedElement.setData(feature)
});
this._popups.set(feature, leafletLayer);
}
private CreateGeojsonLayer(): L.Layer {