Refactoring: introduction of global state to simplify getting common objects

Logic/Osm/Changes.ts

@@ -7,14 +7,12 @@ import {OsmConnection} from "./OsmConnection";
 import {OsmNode, OsmObject} from "./OsmObject";
 import {And, Tag, TagsFilter} from "../TagsFilter";
 import {ElementStorage} from "../ElementStorage";
+import {State} from "../../State";
 
 export class Changes {
 
     private static _nextId = -1; // New assined ID's are negative
 
-    public readonly login: OsmConnection;
-    public readonly _allElements: ElementStorage;
-
     private _pendingChanges: { elementId: string, key: string, value: string }[] = []; // Gets reset on uploadAll
     private newElements: OsmObject[] = []; // Gets reset on uploadAll
 
@@ -27,8 +25,6 @@ export class Changes {
         login: OsmConnection,
         allElements: ElementStorage) {
         this._changesetComment = changesetComment;
-        this.login = login;
-        this._allElements = allElements;
     }
 
     addTag(elementId: string, tagsFilter : TagsFilter){
@@ -66,7 +62,7 @@ console.log("Received change",key, value)
             return;
         }
 
-        const eventSource = this._allElements.getElement(elementId);
+        const eventSource = State.state.allElements.getElement(elementId);
 
         eventSource.data[key] = value;
         eventSource.ping();
@@ -104,7 +100,7 @@ console.log("Received change",key, value)
                 ]
             }
         }
-        this._allElements.addOrGetElement(geojson);
+        State.state.allElements.addOrGetElement(geojson);
 
         // 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 
@@ -208,16 +204,16 @@ console.log("Received change",key, value)
                 for (const oldId in idMapping) {
                     const newId = idMapping[oldId];
 
-                    const element = self._allElements.getElement(oldId);
+                    const element = State.state.allElements.getElement(oldId);
                     element.data.id = newId;
-                    self._allElements.addElementById(newId, element);
+                    State.state.allElements.addElementById(newId, element);
                     element.ping();
                 }
             }
 
             console.log("Beginning upload...");
             // At last, we build the changeset and upload
-            self.login.UploadChangeset(self._changesetComment,
+            State.state.osmConnection.UploadChangeset(self._changesetComment,
                 function (csId) {
 
                     let modifications = "";

Logic/Osm/Geocoding.ts

@@ -1,14 +1,14 @@
 import {Basemap} from "../Leaflet/Basemap";
 import $ from "jquery"
+import {State} from "../../State";
 export class Geocoding {
 
     private static readonly host = "https://nominatim.openstreetmap.org/search?";
 
     static Search(query: string,
-                  basemap: Basemap,
                   handleResult: ((places: { display_name: string, lat: number, lon: number, boundingbox: number[] }[]) => void),
                   onFail: (() => void)) {
-        const b = basemap.map.getBounds();
+        const b = State.state.bm.map.getBounds();
         console.log(b);
         $.getJSON(
             Geocoding.host + "format=json&limit=1&viewbox=" + 

Logic/Osm/OsmConnection.ts

@@ -10,7 +10,6 @@ export class UserDetails {
     public img: string;
     public unreadMessages = 0;
     public totalMessages = 0;
-    public osmConnection: OsmConnection;
     public dryRun: boolean;
     home: { lon: number; lat: number };
 }
@@ -23,24 +22,43 @@ export class OsmConnection {
 
     constructor(dryRun: boolean, oauth_token: UIEventSource<string>) {
 
-        this.auth = new osmAuth({
-            oauth_consumer_key: 'hivV7ec2o49Two8g9h8Is1VIiVOgxQ1iYexCbvem',
-            oauth_secret: 'wDBRTCem0vxD7txrg1y6p5r8nvmz8tAhET7zDASI',
-            singlepage: true,
-            landing: window.location.href,
-            auto: true // show a login form if the user is not authenticated and
-                       // you try to do a call
+        let pwaStandAloneMode = false;
+        try {
 
-        });
+            if (window.matchMedia('(display-mode: standalone)').matches || window.matchMedia('(display-mode: fullscreen)').matches) {
+                pwaStandAloneMode = true;
+            }
+        } catch (e) {
+            console.warn("Detecting standalone mode failed", e, ". Assuming in browser and not worrying furhter")
+        }
+
+
+        if (pwaStandAloneMode) {
+            // In standalone mode, we DON'T use single page login, as 'redirecting' opens a new window anyway...
+            this.auth = new osmAuth({
+                oauth_consumer_key: 'hivV7ec2o49Two8g9h8Is1VIiVOgxQ1iYexCbvem',
+                oauth_secret: 'wDBRTCem0vxD7txrg1y6p5r8nvmz8tAhET7zDASI',
+                singlepage: false,
+                auto: true
+            });
+        } else {
+
+            this.auth = new osmAuth({
+                oauth_consumer_key: 'hivV7ec2o49Two8g9h8Is1VIiVOgxQ1iYexCbvem',
+                oauth_secret: 'wDBRTCem0vxD7txrg1y6p5r8nvmz8tAhET7zDASI',
+                singlepage: true,
+                landing: window.location.href,
+                auto: true
+            });
+        }
 
 
         this.userDetails = new UIEventSource<UserDetails>(new UserDetails());
-        this.userDetails.data.osmConnection = this;
         this.userDetails.data.dryRun = dryRun;
         this._dryRun = dryRun;
 
 
-        if(oauth_token.data !== undefined){
+        if (oauth_token.data !== undefined) {
             console.log(oauth_token.data)
             const self = this;
             this.auth.bootstrapToken(oauth_token.data, 

Logic/Osm/OsmImageUploadHandler.ts

@@ -6,27 +6,19 @@ import {UIEventSource} from "../../UI/UIEventSource";
 import {ImageUploadFlow} from "../../UI/ImageUploadFlow";
 import {UserDetails} from "./OsmConnection";
 import {SlideShow} from "../../UI/SlideShow";
+import {State} from "../../State";
 
 export class OsmImageUploadHandler {
     private _tags: UIEventSource<any>;
-    private _changeHandler: Changes;
-    private _userdetails: UIEventSource<UserDetails>;
     private _slideShow: SlideShow;
     private _preferedLicense: UIEventSource<string>;
 
     constructor(tags: UIEventSource<any>,
-                userdetails: UIEventSource<UserDetails>,
                 preferedLicense: UIEventSource<string>,
-                changeHandler: Changes,
                 slideShow : SlideShow
     ) {
         this._slideShow = slideShow; // To move the slideshow (if any) to the last, just added element
-        if (tags === undefined || userdetails === undefined || changeHandler === undefined) {
-            throw "Something is undefined"
-        }
         this._tags = tags;
-        this._changeHandler = changeHandler;
-        this._userdetails = userdetails;
         this._preferedLicense = preferedLicense;
     }
 
@@ -36,14 +28,14 @@ export class OsmImageUploadHandler {
 
         const title = tags.name ?? "Unknown area";
         const description = [
-            "author:" + this._userdetails.data.name,
+            "author:" + State.state.osmConnection.userDetails.data.name,
             "license:" + license,
             "wikidata:" + tags.wikidata,
             "osmid:" + tags.id,
             "name:" + tags.name
         ].join("\n");
 
-        const changes = this._changeHandler;
+        const changes = State.state.changes;
         return {
             title: title,
             description: description,
@@ -73,7 +65,6 @@ export class OsmImageUploadHandler {
     getUI(): ImageUploadFlow {
         const self = this;
         return new ImageUploadFlow(
-            this._userdetails,
             this._preferedLicense,
             function (license) {
                 return self.generateOptions(license)