Immediately sync state after finishing the route snapper, so it acts …

…more like the other draw tools
acteng · Nov 17, 2022 · a7b2b34 · a7b2b34
1 parent 2731361
commit a7b2b34
Show file tree

Hide file tree

Showing 2 changed files with 19 additions and 14 deletions.
diff --git a/app.js b/app.js
@@ -70,24 +70,24 @@ export class App {
     // TODO No await? :(
     reader.onload = (e) => {
       this.#loadFromText(e.target.result);
-      this.#saveToLocalStorage();
+      this.saveToLocalStorage();
     };
     reader.readAsText(e.target.files[0]);
   }
 
   #loadFromText(text) {
     const geojson = JSON.parse(text);
     this.drawControls.set(geojson);
-    this.#updateSidebar();
+    this.updateSidebar();
 
     const scheme_name = document.getElementById("scheme_name");
     scheme_name.value = geojson["scheme_name"] || "";
     scheme_name.oninput = () => {
-      this.#saveToLocalStorage();
+      this.saveToLocalStorage();
     };
   }
 
-  #saveToLocalStorage() {
+  saveToLocalStorage() {
     window.localStorage.setItem(this.currentFilename, this.toGeojson());
   }
 
@@ -213,8 +213,8 @@ export class App {
       }
 
       this.map.on("draw.selectionchange", (e) => {
-        this.#updateSidebar();
-        this.#saveToLocalStorage();
+        this.updateSidebar();
+        this.saveToLocalStorage();
 
         if (e.features.length === 1) {
           this.openForm(e.features[0]);
@@ -256,8 +256,8 @@ export class App {
           key,
           document.getElementById(key).value
         );
-        this.#saveToLocalStorage();
-        this.#updateSidebar();
+        this.saveToLocalStorage();
+        this.updateSidebar();
       };
     }
 
@@ -267,8 +267,8 @@ export class App {
     document.getElementById("delete").onclick = () => {
       this.drawControls.delete(feature.id);
       this.closeForm();
-      this.#updateSidebar();
-      this.#saveToLocalStorage();
+      this.updateSidebar();
+      this.saveToLocalStorage();
     };
   }
 
@@ -278,7 +278,7 @@ export class App {
     this.map.resize();
   }
 
-  #updateSidebar() {
+  updateSidebar() {
     const div = document.getElementById("intervention_list");
     div.innerHTML = "";
 
@@ -304,7 +304,6 @@ export class App {
         this.map.getSource("hover").setData(emptyGeojson());
       };
       li.onclick = () => {
-        // TODO If another form is open, we'll lose changes
         this.openForm(feature);
         this.map.fitBounds(geojsonExtent(feature), {
           padding: 20,

diff --git a/route-snapper/lib.js b/route-snapper/lib.js
@@ -8,7 +8,6 @@ export class RouteSnapper {
 
     this.app = app;
     this.map = app.map;
-    this.drawControls = app.drawControls;
     this.inner = new JsRouteSnapper(mapBytes);
     console.log("JsRouteSnapper ready, waiting for idle event");
     this.active = false;
@@ -132,10 +131,17 @@ export class RouteSnapper {
       const rawJSON = this.inner.toFinalFeature();
       if (rawJSON) {
         const json = JSON.parse(rawJSON);
-        const ids = this.drawControls.add(json);
+        const ids = this.app.drawControls.add(json);
         json.id = ids[0];
         // drawControls assigns an ID. When we open the form, pass in the feature with that ID
         this.app.openForm(json);
+        this.app.updateSidebar();
+        this.app.saveToLocalStorage();
+
+        // Act like we've selected the line-string we just drew
+        this.app.drawControls.changeMode("direct_select", {
+          featureId: json.id,
+        });
       }
 
       this.#inactiveControl();