Add set to current location in gw create / update.

brocaar · Mar 30, 2017 · 154f738 · 154f738
1 parent 75c0da9
commit 154f738
Show file tree

Hide file tree

Showing 3 changed files with 28 additions and 10 deletions.
diff --git a/docs/changelog.md b/docs/changelog.md
@@ -1,5 +1,11 @@
 # Changelog
 
+## 0.7.1
+
+**Features & changes:**
+
+* Add 'set to current location' (create / update gateway in UI)
+
 ## 0.7.0
 
 **Features & changes:**

diff --git a/mkdocs.yml b/mkdocs.yml
@@ -15,7 +15,7 @@ pages:
   - changelog.md
 
 extra:
-  version: '0.7.0'
+  version: '0.7.1'
   github:
     download_release: true
 

diff --git a/ui/src/components/GatewayForm.js b/ui/src/components/GatewayForm.js
@@ -1,4 +1,5 @@
 import React, { Component } from 'react';
+import { Link } from 'react-router';
 
 import { Map, Marker, TileLayer } from 'react-leaflet';
 
@@ -14,6 +15,8 @@ class GatewayForm extends Component {
     this.handleSubmit = this.handleSubmit.bind(this);
     this.updatePosition = this.updatePosition.bind(this);
     this.updateZoom = this.updateZoom.bind(this);
+    this.setToCurrentPosition = this.setToCurrentPosition.bind(this);
+    this.handleSetToCurrentPosition = this.handleSetToCurrentPosition.bind(this);
   }
 
   onChange(field, e) {
@@ -51,16 +54,20 @@ class GatewayForm extends Component {
       gateway: this.props.gateway,
     });
 
+    if (typeof(this.state.gateway.latitude) === "undefined" || typeof(this.state.gateway.longitude) === "undefined" || this.state.gateway.latitude === 0 || this.state.gateway.longitude === 0) {
+      this.setToCurrentPosition();
+    }
+  }
+
+  setToCurrentPosition() {
     if (navigator.geolocation) {
       navigator.geolocation.getCurrentPosition((position) => {
-        if (typeof(this.state.gateway.latitude) === "undefined" || typeof(this.state.gateway.longitude) === "undefined") {
-          let gateway = this.state.gateway;
-          gateway.latitude = position.coords.latitude;
-          gateway.longitude = position.coords.longitude;
-          this.setState({
-            gateway: gateway,
-          });
-        }
+        let gateway = this.state.gateway;
+        gateway.latitude = position.coords.latitude;
+        gateway.longitude = position.coords.longitude;
+        this.setState({
+          gateway: gateway,
+        });
       });
     }
   }
@@ -76,6 +83,11 @@ class GatewayForm extends Component {
     this.props.onSubmit(this.state.gateway);
   }
 
+  handleSetToCurrentPosition(e) {
+    e.preventDefault();
+    this.setToCurrentPosition();
+  }
+
   render() {
     const mapStyle = {
       height: "400px",
@@ -114,7 +126,7 @@ class GatewayForm extends Component {
             <p className="help-block">When the gateway has an on-board GPS, this value will be set automatically when the network received statistics from the gateway.</p>
           </div>
           <div className="form-group">
-            <label className="control-label">Gateway location</label>
+            <label className="control-label">Gateway location (<Link onClick={this.handleSetToCurrentPosition} href="#">set to current location</Link>)</label>
             <Map zoom={this.state.mapZoom} center={position} style={mapStyle} animate={true} onZoomend={this.updateZoom}>
               <TileLayer
                 url='http://{s}.tile.osm.org/{z}/{x}/{y}.png'