elgaard/MapComplete
1
0
Fork 0
forked from MapComplete/MapComplete
Code Pull requests Activity

Changesets are now kept open and reused to avoid tons of changesets to be created

Browse source
This commit is contained in:
Pieter Vander Vennet 2020-08-27 11:11:20 +02:00
parent 0051c37494
commit 82f3525907
16 changed files with 162 additions and 270 deletions
Download patch file Download diff file Expand all files Collapse all files

4
Customizations/TagRendering.ts
View file

@ -117,7 +117,7 @@ export class TagRendering extends UIElement implements TagDependantUIElement {
let choiceSubbed = {
k: choice.k.substituteValues(this.currentTags.data),
k: choice.k?.substituteValues(this.currentTags.data),
txt: choice.txt,
priority: choice.priority
}
@ -314,7 +314,7 @@ export class TagRendering extends UIElement implements TagDependantUIElement {
const tags = TagUtils.proprtiesToKV(this._source.data);
for (const oneOnOneElement of this._mapping) {
if (oneOnOneElement.k === null || oneOnOneElement.k.matches(tags)) {
if (oneOnOneElement.k === null || oneOnOneElement.k === undefined || oneOnOneElement.k.matches(tags)) {
return true;
}
}

153
Logic/Osm/Changes.ts
View file

@ -14,19 +14,6 @@ export class Changes {
private static _nextId = -1; // New assined ID's are negative
private _pendingChanges: { elementId: string, key: string, value: string }[] = []; // Gets reset on uploadAll
private newElements: OsmObject[] = []; // Gets reset on uploadAll
public readonly pendingChangesES = new UIEventSource<number>(this._pendingChanges.length);
public readonly isSaving = new UIEventSource(false);
constructor(
state: State) {
this.SetupAutoSave(state);
this.LastEffortSave();
}
addTag(elementId: string, tagsFilter : TagsFilter){
if(tagsFilter instanceof Tag){
const tag = tagsFilter as Tag;
@ -72,13 +59,10 @@ export class Changes {
value = value.trim();
const eventSource = State.state.allElements.getElement(elementId);
eventSource.data[key] = value;
eventSource.ping();
// We get the id from the event source, as that ID might be rewritten
this._pendingChanges.push({elementId: eventSource.data.id, key: key, value: value});
this.pendingChangesES.setData(this._pendingChanges.length);
this.uploadAll([], [{elementId: eventSource.data.id, key: key, value: value}]);
}
@ -90,7 +74,6 @@ export class Changes {
createElement(basicTags:Tag[], lat: number, lon: number) {
console.log("Creating a new element with ", basicTags)
const osmNode = new OsmNode(Changes._nextId);
this.newElements.push(osmNode);
Changes._nextId--;
const id = "node/" + osmNode.id;
@ -113,39 +96,25 @@ export class Changes {
// The basictags are COPIED, the id is included in the properties
// The tags are not yet written into the OsmObject, but this is applied onto a
const changes = [];
for (const kv of basicTags) {
properties[kv.key] = kv.value;
if(typeof kv.value !== "string"){
throw "Invalid value"
if (typeof kv.value !== "string") {
throw "Invalid value: don't use a regex in a preset"
}
this._pendingChanges.push({elementId: id, key: kv.key, value: kv.value});
changes.push({elementId: id, key: kv.key, value: kv.value})
}
this.pendingChangesES.setData(this._pendingChanges.length);
State.state.allElements.addOrGetElement(geojson).ping();
this.uploadAll([osmNode], changes);
return geojson;
}
public uploadAll(optionalContinuation: (() => void) = undefined) {
private uploadAll(
newElements: OsmObject[],
pending: { elementId: string; key: string; value: string }[]
) {
const self = this;
this.isSaving.setData(true);
const optionalContinuationWrapped = function () {
self.isSaving.setData(false);
if (optionalContinuation) {
optionalContinuation();
}
}
const pending: { elementId: string; key: string; value: string }[] = this._pendingChanges;
this._pendingChanges = [];
this.pendingChangesES.setData(this._pendingChanges.length);
const newElements = this.newElements;
this.newElements = [];
const knownElements = {}; // maps string --> OsmObject
function DownloadAndContinue(neededIds, continuation: (() => void)) {
// local function which downloads all the objects one by one
@ -174,7 +143,7 @@ export class Changes {
for (const change of pending) {
const id = change.elementId;
if (parseFloat(id.split("/")[1]) < 0) {
console.log("Detected a new element! Exciting!")
// New element - we don't have to download this
} else {
neededIds.push(id);
}
@ -194,9 +163,7 @@ export class Changes {
}
} else {
console.log(knownElements, change.elementId);
knownElements[change.elementId].addTag(change.key, change.value);
// note: addTag will flag changes with 'element.changed' internally
}
}
@ -213,18 +180,6 @@ export class Changes {
return;
}
const handleMapping = function (idMapping) {
for (const oldId in idMapping) {
const newId = idMapping[oldId];
const element = State.state.allElements.getElement(oldId);
element.data.id = newId;
State.state.allElements.addElementById(newId, element);
element.ping();
}
}
console.log("Beginning upload...");
// At last, we build the changeset and upload
State.state.osmConnection.UploadChangeset(
@ -266,89 +221,9 @@ export class Changes {
return changes;
},
handleMapping,
optionalContinuationWrapped);
});
}
/*
* Registers an action that:
* -> Upload everything to OSM
* -> Asks the user not to close. The 'not to close' dialog should profide enough time to upload
* -> WHen uploading is done, the window is closed anyway
*/
private LastEffortSave() {
const self = this;
window.addEventListener("beforeunload", function (e) {
// Quickly save everyting!
if (self.pendingChangesES.data == 0) {
return "";
}
self.uploadAll(function () {
console.log("Uploaded changes during a last-effort save")
window.close()
});
var confirmationMessage = "Nog even geduld - je laatset wijzigingen worden opgeslaan!";
(e || window.event).returnValue = confirmationMessage; //Gecko + IE
return confirmationMessage; //Webkit, Safari, Chrome
});
document.addEventListener('visibilitychange', () => {
if (document.visibilityState === "visible") {
return;
}
if (this.pendingChangesES.data == 0) {
return;
}
console.log("Uploading: loss of focus")
this.uploadAll(function () {
console.log("Uploaded changes during a last-effort save (loss of focus)")
window.close()
});
})
}
private SetupAutoSave(state: State) {
const millisTillChangesAreSaved = state.secondsTillChangesAreSaved;
const saveAfterXMillis = state.saveTimeout.data;
const self = this;
this.pendingChangesES.addCallback(function () {
var c = self.pendingChangesES.data;
if (c > 10) {
millisTillChangesAreSaved.setData(0);
self.uploadAll(() => {
console.log("Uploaded changes: more then 10 pending changes")
() => {
});
return;
}
if (c > 0) {
millisTillChangesAreSaved.setData(saveAfterXMillis);
}
});
millisTillChangesAreSaved.addCallback((time) => {
if (time <= 0 && self.pendingChangesES.data > 0) {
self.uploadAll(() => {
console.log("Saving changes: timer elapsed")
});
}
}
)
Utils.DoEvery(
1000,
() => {
millisTillChangesAreSaved
.setData(millisTillChangesAreSaved.data - 1000)
});
}
}

99
Logic/Osm/ChangesetHandler.ts
View file

@ -1,5 +1,5 @@
import {State} from "../../State";
import {UserDetails} from "./OsmConnection";
import {OsmConnection, UserDetails} from "./OsmConnection";
import {UIEventSource} from "../UIEventSource";
export class ChangesetHandler {
@ -8,10 +8,13 @@ export class ChangesetHandler {
private userDetails: UIEventSource<UserDetails>;
private auth: any;
constructor(dryRun: boolean, userDetails: UIEventSource<UserDetails>, auth) {
public currentChangeset: UIEventSource<string>;
constructor(dryRun: boolean, osmConnection: OsmConnection, auth) {
this._dryRun = dryRun;
this.userDetails = userDetails;
this.userDetails = osmConnection.userDetails;
this.auth = auth;
this.currentChangeset = osmConnection.GetPreference("current-open-changeset");
if (dryRun) {
console.log("DRYRUN ENABLED");
@ -20,7 +23,6 @@ export class ChangesetHandler {
public UploadChangeset(generateChangeXML: (csid: string) => string,
handleMapping: (idMapping: any) => void,
continuation: () => void) {
if (this._dryRun) {
@ -32,18 +34,53 @@ export class ChangesetHandler {
}
const self = this;
this.OpenChangeset(
function (csId) {
var changesetXML = generateChangeXML(csId);
self.AddChange(csId, changesetXML,
function (csId, mapping) {
self.CloseChangeset(csId, continuation);
handleMapping(mapping);
}
);
}
);
if (this.currentChangeset.data === undefined || this.currentChangeset.data === "") {
// We have to open a new changeset
this.OpenChangeset((csId) => {
this.currentChangeset.setData(csId);
self.AddChange(csId, generateChangeXML(csId),
() => {
},
(e) => {
console.error("UPLOADING FAILED!", e)
}
)
})
} else {
// There still exists an open changeset (or at least we hope so)
const csId = this.currentChangeset.data;
self.AddChange(
csId,
generateChangeXML(csId),
() => {
},
(e) => {
console.warn("Could not upload, changeset is probably closed: ", e);
// Mark the CS as closed...
this.currentChangeset.setData("");
// ... and try again. As the cs is closed, no recursive loop can exist
self.UploadChangeset(generateChangeXML, continuation);
}
)
}
/*
this.OpenChangeset(
function (csId) {
var changesetXML = generateChangeXML(csId);
self.AddChange(csId, changesetXML,
function (csId, mapping) {
self.CloseChangeset(csId, continuation);
handleMapping(mapping);
}
);
}
);*/
this.userDetails.data.csCount++;
this.userDetails.ping();
@ -77,7 +114,8 @@ export class ChangesetHandler {
private AddChange(changesetId: string,
changesetXML: string,
continuation: ((changesetId: string, idMapping: any) => void)) {
continuation: ((changesetId: string, idMapping: any) => void),
onFail: ((changesetId: string) => void) = undefined) {
this.auth.xhr({
method: 'POST',
options: {header: {'Content-Type': 'text/xml'}},
@ -86,6 +124,9 @@ export class ChangesetHandler {
}, function (err, response) {
if (response == null) {
console.log("err", err);
if (onFail) {
onFail(changesetId);
}
return;
}
const mapping = ChangesetHandler.parseUploadChangesetResponse(response);
@ -94,8 +135,16 @@ export class ChangesetHandler {
});
}
public CloseChangeset(changesetId: string, continuation: (() => void)) {
console.log("closing");
public CloseChangeset(changesetId: string = undefined, continuation: (() => void) = () => {
}) {
if (changesetId === undefined) {
changesetId = this.currentChangeset.data;
}
if (changesetId === undefined) {
return;
}
console.log("closing changeset", changesetId);
this.currentChangeset.setData("");
this.auth.xhr({
method: 'PUT',
path: '/api/0.6/changeset/' + changesetId + '/close',
@ -104,7 +153,7 @@ export class ChangesetHandler {
console.log("err", err);
}
console.log("Closed changeset ", changesetId);
console.log("Closed changeset ", changesetId)
if (continuation !== undefined) {
continuation();
@ -114,17 +163,23 @@ export class ChangesetHandler {
public static parseUploadChangesetResponse(response: XMLDocument) {
const nodes = response.getElementsByTagName("node");
const mapping = {};
// @ts-ignore
for (const node of nodes) {
const oldId = parseInt(node.attributes.old_id.value);
const newId = parseInt(node.attributes.new_id.value);
if (oldId !== undefined && newId !== undefined &&
!isNaN(oldId) && !isNaN(newId)) {
mapping["node/" + oldId] = "node/" + newId;
if(oldId == newId){
continue;
}
console.log("Rewriting id: ", oldId, "-->", newId);
const element = State.state.allElements.getElement("node/" + oldId);
element.data.id = "node/" + newId;
State.state.allElements.addElementById("node/" + newId, element);
element.ping();
}
}
return mapping;
}

13
Logic/Osm/OsmConnection.ts
View file

@ -29,7 +29,7 @@ export class OsmConnection {
private _onLoggedIn : ((userDetails: UserDetails) => void)[] = [];
constructor(dryRun: boolean, oauth_token: UIEventSource<string>, singlePage: boolean = true) {
constructor(dryRun: boolean, oauth_token: UIEventSource<string>, singlePage: boolean = true, useDevServer:boolean = false) {
let pwaStandAloneMode = false;
try {
@ -50,7 +50,8 @@ export class OsmConnection {
oauth_consumer_key: 'hivV7ec2o49Two8g9h8Is1VIiVOgxQ1iYexCbvem',
oauth_secret: 'wDBRTCem0vxD7txrg1y6p5r8nvmz8tAhET7zDASI',
singlepage: false,
auto: true
auto: true,
url: useDevServer ? "https://master.apis.dev.openstreetmap.org" : undefined
});
} else {
@ -59,7 +60,8 @@ export class OsmConnection {
oauth_secret: 'wDBRTCem0vxD7txrg1y6p5r8nvmz8tAhET7zDASI',
singlepage: true,
landing: window.location.href,
auto: true
auto: true,
url: useDevServer ? "https://master.apis.dev.openstreetmap.org" : undefined
});
}
@ -70,7 +72,7 @@ export class OsmConnection {
this.preferencesHandler = new OsmPreferences(this.auth, this);
this.changesetHandler = new ChangesetHandler(dryRun, this.userDetails, this.auth);
this.changesetHandler = new ChangesetHandler(dryRun, this, this.auth);
if (oauth_token.data !== undefined) {
console.log(oauth_token.data)
const self = this;
@ -92,9 +94,8 @@ export class OsmConnection {
public UploadChangeset(generateChangeXML: (csid: string) => string,
handleMapping: (idMapping: any) => void,
continuation: () => void) {
this.changesetHandler.UploadChangeset(generateChangeXML, handleMapping, continuation);
this.changesetHandler.UploadChangeset(generateChangeXML, continuation);
}
public GetPreference(key: string, prefix: string = "mapcomplete-"): UIEventSource<string> {

7
Logic/Osm/OsmImageUploadHandler.ts
View file

@ -39,7 +39,7 @@ export class OsmImageUploadHandler {
return {
title: title,
description: description,
handleURL: function (url) {
handleURL: (url) => {
let key = "image";
if (tags["image"] !== undefined) {
@ -54,10 +54,7 @@ export class OsmImageUploadHandler {
changes.addChange(tags.id, key, url);
self._slideShow.MoveTo(-1); // set the last (thus newly added) image) to view
},
allDone: function () {
changes.uploadAll(function () {
console.log("Writing changes...")
});
allDone: () => {
}
}
}

15
Logic/Osm/OsmPreferences.ts
View file

@ -35,13 +35,10 @@ export class OsmPreferences {
const source = new UIEventSource<string>(undefined);
this.longPreferences[prefix + key] = source;
console.log("Loading long pref", prefix + key);
const allStartWith = prefix + key + "-combined";
// Gives the number of combined preferences
const length = this.GetPreference(allStartWith + "-length", "");
console.log("Getting long pref " + prefix + key);
const self = this;
source.addCallback(str => {
if (str === undefined || str === "") {
@ -82,7 +79,7 @@ export class OsmPreferences {
source.setData(str);
source.ping();
console.log("Long preference ", key, " has ", str.length, " chars");
console.log("Long preference", key, "has", str.length, "chars");
}
length.addCallback(l => {
@ -142,7 +139,7 @@ export class OsmPreferences {
private SetPreference(k: string, v: string) {
if (!this.userDetails.data.loggedIn) {
console.log("Not saving preference: user not logged in");
console.log(`Not saving preference ${k}: user not logged in`);
return;
}
@ -163,7 +160,7 @@ export class OsmPreferences {
return;
}
console.log("Preference removed!", result == "" ? "OK" : result);
console.log("Preference ",k,"removed!");
});
return;
@ -177,12 +174,10 @@ export class OsmPreferences {
content: v
}, function (error, result) {
if (error) {
console.log("Could not set preference", error);
console.log(`Could not set preference "${k}"'`, error);
return;
}
console.log("Preference written!", result == "" ? "OK" : result);
console.log(`Preference ${k} written!`);
});
}

13
State.ts
View file

@ -24,7 +24,7 @@ export class State {
// The singleton of the global state
public static state: State;
public static vNumber = "0.0.7a ¿hablas español?";
public static vNumber = "0.0.7b Less changesets";
// The user journey states thresholds when a new feature gets unlocked
public static userJourney = {
@ -125,7 +125,7 @@ export class State {
public installedThemes: UIEventSource<{ layout: Layout; definition: string }[]>;
constructor(layoutToUse: Layout) {
constructor(layoutToUse: Layout, useDevServer = false) {
const self = this;
this.layoutToUse.setData(layoutToUse)
this.locationControl = new UIEventSource<{ lat: number, lon: number, zoom: number }>({
@ -171,9 +171,12 @@ export class State {
this.featureSwitchShareScreen = featSw("fs-share-screen", (layoutToUse) => layoutToUse?.enableShareScreen ?? true);
this.featureSwitchGeolocation = featSw("fs-geolocation", (layoutToUse) => layoutToUse?.enableGeolocation ?? true);
const testParam = QueryParameters.GetQueryParameter("test", "false").data;
this.osmConnection = new OsmConnection(
QueryParameters.GetQueryParameter("test", "false").data === "true",
QueryParameters.GetQueryParameter("oauth_token", undefined)
testParam === "true",
QueryParameters.GetQueryParameter("oauth_token", undefined),
true,
testParam === "dev"
);
@ -237,7 +240,7 @@ export class State {
this.allElements = new ElementStorage();
this.changes = new Changes(this);
this.changes = new Changes();
if (State.runningFromConsole) {
console.warn("running from console - not initializing map. Assuming test.html");

38
UI/PendingChanges.ts
View file

@ -1,38 +0,0 @@
import {UIElement} from "./UIElement";
import {State} from "../State";
import {UIEventSource} from "../Logic/UIEventSource";
export class PendingChanges extends UIElement {
private _pendingChangesCount: UIEventSource<number>;
private _isSaving: UIEventSource<boolean>;
constructor() {
super(State.state.changes.pendingChangesES);
this.ListenTo(State.state.changes.isSaving);
this.ListenTo(State.state.secondsTillChangesAreSaved);
this._pendingChangesCount = State.state.changes.pendingChangesES;
this._isSaving = State.state.changes.isSaving;
this.onClick(() => {
State.state.changes.uploadAll();
})
}
InnerRender(): string {
if (this._isSaving.data) {
return "<span class='alert'>Saving</span>";
}
if (this._pendingChangesCount.data == 0) {
return "";
}
var restingSeconds =State.state.secondsTillChangesAreSaved.data / 1000;
var dots = "";
while (restingSeconds > 0) {
dots += ".";
restingSeconds = restingSeconds - 1;
}
return "Saving "+this._pendingChangesCount.data;
}
}

4
UI/SimpleAddUI.ts
View file

@ -55,8 +55,8 @@ export class SimpleAddUI extends UIElement {
if (preset.icon !== undefined) {
if (typeof (preset.icon) !== "string") {
icon = preset.icon.GetContent(Utils.MergeTags(preset.tags, {id:"node/-1"}));
console.log("Preset icon is:", preset.icon, "--> ",icon);
const tags = Utils.MergeTags(TagUtils.KVtoProperties(preset.tags), {id:"node/-1"});
icon = preset.icon.GetContent(tags);
} else {
icon = preset.icon;
}

6
UI/UserBadge.ts
View file

@ -1,14 +1,11 @@
import {UIElement} from "./UIElement";
import {UIEventSource} from "./UIEventSource";
import L from "leaflet";
import {FixedUiElement} from "./Base/FixedUiElement";
import {VariableUiElement} from "./Base/VariableUIElement";
import Translations from "./i18n/Translations";
import {UserDetails} from "../Logic/Osm/OsmConnection";
import {State} from "../State";
import {PendingChanges} from "./PendingChanges";
import {Utils} from "../Utils";
// @ts-ignore
import {UIEventSource} from "../Logic/UIEventSource";
/**
@ -16,7 +13,6 @@ import {UIEventSource} from "../Logic/UIEventSource";
*/
export class UserBadge extends UIElement {
private _userDetails: UIEventSource<UserDetails>;
private _pendingChanges: UIElement;
private _logout: UIElement;
private _homeButton: UIElement;
private _languagePicker: UIElement;
@ -26,7 +22,6 @@ export class UserBadge extends UIElement {
constructor() {
super(State.state.osmConnection.userDetails);
this._userDetails = State.state.osmConnection.userDetails;
this._pendingChanges = new PendingChanges();
this._languagePicker = Utils.CreateLanguagePicker();
this._loginButton = Translations.t.general.loginWithOpenStreetMap.Clone().onClick(() => State.state.osmConnection.AttemptLogin());
this._logout = new FixedUiElement("<img src='assets/logout.svg' class='small-userbadge-icon' alt='logout'>")
@ -116,7 +111,6 @@ export class UserBadge extends UIElement {
messageSpan +
csCount +
this._logout.Render() +
this._pendingChanges.Render() +
this._languagePicker.Render() +
"</div>";

14
createLayouts.ts
View file

@ -165,11 +165,21 @@ function createLandingPage(layout: Layout) {
<meta property="og:title" content="${ogTitle}">
<meta property="og:description" content="${ogDescr}">`
return template
let output = template
.replace(`./manifest.manifest`, `./${enc(layout.name)}.webmanifest`)
.replace("<!-- $$$OG-META -->", og)
.replace(`<link rel="icon" href="assets/add.svg" sizes="any" type="image/svg+xml">`,
`<link rel="icon" href="${layout.icon}" sizes="any" type="image/svg+xml">`)
`<link rel="icon" href="${layout.icon}" sizes="any" type="image/svg+xml">`);
try {
output = output
.replace(/<!-- DECORATION 0 START -->.*<!-- DECORATION 0 END -->/s, `<img src='${layout.icon}' width="100%" height="100%">`)
.replace(/<!-- DECORATION 1 START -->.*<!-- DECORATION 1 END -->/s, `<img src='${layout.icon}' width="100%" height="100%">`);
} catch (e) {
console.warn("Error while applying logo: ", e)
}
return output;
}
const blacklist = ["", "test", ".", "..", "manifest", "index", "land", "preferences", "account", "openstreetmap"]

31
index.html
View file

File diff suppressed because one or more lines are too long

1
index.ts
View file

@ -23,7 +23,6 @@ TagRendering.injectFunction();
// --------------------- Special actions based on the parameters -----------------
// @ts-ignore
if (location.href.startsWith("http://buurtnatuur.be")) {
// Reload the https version. This is important for the 'locate me' button

2
preferences.ts
View file

@ -57,5 +57,5 @@ function createTable(preferences: any) {
el.AttachTo("maindiv");
}
connection._preferencesHandler.preferences.addCallback((prefs) => createTable(prefs))
connection.preferencesHandler.preferences.addCallback((prefs) => createTable(prefs))

23
test.ts
View file

@ -1,14 +1,19 @@
import {OsmConnection} from "./Logic/Osm/OsmConnection";
import {UIEventSource} from "./Logic/UIEventSource";
import {ChangesetHandler} from "./Logic/Osm/ChangesetHandler";
import {State} from "./State";
import {LayerDefinition} from "./Customizations/LayerDefinition";
import {AllKnownLayouts} from "./Customizations/AllKnownLayouts";
import {Tag} from "./Logic/TagsFilter";
import {VariableUiElement} from "./UI/Base/VariableUIElement";
const bookcases = AllKnownLayouts.layoutsList[5];
State.state = new State(bookcases);
new VariableUiElement(
State.state.osmConnection.changesetHandler.currentChangeset
).AttachTo("maindiv");
const conn = new OsmConnection(false, new UIEventSource<string>(""), false);
conn.AttemptLogin();
window.setTimeout(() => {
const csHandler = conn.changesetHandler;
conn.OnLoggedIn((ud) => {
});
State.state.osmConnection.changesetHandler.CloseChangeset("89995035")
}, 1000)

5
test/Tag.spec.ts
View file

@ -6,7 +6,6 @@ import {CustomLayoutFromJSON} from "../Customizations/JSON/CustomLayoutFromJSON"
import {And} from "../Logic/TagsFilter";
import Translation from "../UI/i18n/Translation";
import T from "./TestHelper";
import {Artwork} from "../Customizations/Layers/Artwork";
new T([
@ -32,8 +31,6 @@ new T([
equal(tr.txt, "Test value abc");
}],
["JSONify artwork layer", () => {
const a = new Artwork();
console.log(a.ToJson())
["Preset renders icon correctly", () => {
}]
]);