Get own location

Own GPS-location

src/components/UserMap.js

@@ -2,6 +2,67 @@ import React, { Component } from 'react';
 import { Map, TileLayer, Marker, Popup } from 'react-leaflet';
 
 class UserMap extends Component {
+  constructor(props){
+    super(props);
+    this.state = {
+      ownLat: null,
+      ownLng: null,
+    }
+
+    this.DeviceLocationUpdater = null;
+    this.updateDeviceLocation = this.updateDeviceLocation.bind(this);
+  }
+
+  componentDidMount(){
+    this.startDeviceLocationUpdater();
+  }
+
+  componentWillUnmount(){
+    if(this.DeviceLocationUpdater != null){
+      clearInterval(this.DeviceLocationUpdater);
+    }
+  }
+
+  startDeviceLocationUpdater(){
+    this.DeviceLocationUpdater = setInterval(this.updateDeviceLocation, 1000);
+  }
+
+  updateDeviceLocation(){
+    this.getCurrentPosition((position) => {
+      this.setCurrentPosition(position);
+    });
+  }
+
+  setCurrentPosition(position){
+    this.setState({
+      ownLat: position.coords.latitude,
+      ownLng: position.coords.longitude,
+    });
+  }
+
+  getCurrentPosition(callback){
+    if(!navigator.geolocation){
+      console.log("Can't get geolocation :/");
+    }
+    else{
+      // Position tracking options
+      const options = {
+        enableHighAccuracy: true,
+        timeout: 30000,
+        maximumAge: 0
+      }
+
+      navigator.geolocation.getCurrentPosition((position) =>{
+        //success
+        if(position != null){
+          callback(position);
+        }
+      }, (error) =>{
+        console.log(error);
+      }, options);
+    }
+  }
+
   render() {
     return (
       <Map className='map' center={this.props.position} zoom={this.props.zoom}>
@@ -14,9 +75,14 @@ class UserMap extends Component {
             Se on perjantai, my dudes <br />
           </Popup>
         </Marker>
+        {this.state.ownLat !== null && <Marker position={[this.state.ownLat, this.state.ownLng]}>
+        <Popup>
+            User's real position.<br />
+          </Popup>
+        </Marker>}
       </Map>
     );
   }
 }
 
-export default UserMap;
+export default UserMap;
\ No newline at end of file