Manually place user location on main map

mobile/src/ui/Geolocation.js

@@ -1,6 +1,7 @@
 import React, { Component } from "react"
-import { Image, View } from "react-native"
 import PropTypes from "prop-types"
+import { config } from "../config"
+import { reactAutoBind } from "auto-bind2"
 
 export class Geolocation extends Component {
   static propTypes = {
@@ -14,29 +15,36 @@ export class Geolocation extends Component {
 
   constructor(props) {
     super(props)
-    this.watchId = -1
+    reactAutoBind(this)
+
+    if (props.watch) {
+      this.intervalId = setInterval(this.updateLocation, config.geoSampleDelay)
+    } else {
+      this.intervalId = -1
+    }
   }
 
   componentDidMount() {
-    navigator.geolocation.getCurrentPosition((position) => {
-      this.props.onUpdate(position)
-
-      if (this.props.watch) {
-        this.watchId = navigator.geolocation.watchPosition((position) =>
-          this.props.onUpdate(position)
-        )
-      }
-    })
+    this.updateLocation()
   }
 
   componentWillUnmount() {
-    if (this.watchId !== -1) {
-      navigator.geolocation.clearWatch(this.watchId)
-      navigator.geolocation.stopObserving()
-      this.watchId = -1
+    if (this.intervalId !== -1) {
+      clearInterval(this.intervalId)
+      this.intervalId = -1
     }
   }
 
+  updateLocation() {
+    navigator.geolocation.getCurrentPosition(
+      (position) => {
+        this.props.onUpdate(position)
+      },
+      null,
+      { distanceFilter: 5, maximumAge: 0, enableHighAccuracy: true }
+    )
+  }
+
   render() {
     return null
   }