feat(form): Make 'use current location' option functional

Author: David Emory

lib/actions/location.js

@@ -0,0 +1,22 @@
+import { createAction } from 'redux-actions'
+
+export const receivedPositionError = createAction('POSITION_ERROR')
+export const receivedPositionResponse = createAction('POSITION_RESPONSE')
+
+export function getCurrentPosition () {
+  return async function (dispatch, getState) {
+    if (navigator.geolocation) {
+      navigator.geolocation.getCurrentPosition(position => {
+        if (position) {
+          console.log('current loc', position)
+          dispatch(receivedPositionResponse({ position }))
+        } else {
+          dispatch(receivedPositionError())
+        }
+      })
+    } else {
+      console.log('current position not supported')
+      dispatch(receivedPositionError())
+    }
+  }
+}

lib/components/form/location-field.js

@@ -9,6 +9,7 @@ import { setLocation, clearLocation } from '../../actions/map'
 class LocationField extends Component {
   static propTypes = {
     config: PropTypes.object,
+    currentPosition: PropTypes.object,
     location: PropTypes.object,
     label: PropTypes.string,
     type: PropTypes.string, // replace with locationType?
@@ -74,15 +75,25 @@ class LocationField extends Component {
   }
 
   render () {
-    const currentLocationOption = createOption('location-arrow', 'Use Current Location', 'test1')
+    const { currentPosition } = this.props
+
+    const currentLocationOption = currentPosition !== null
+      ? createOption('location-arrow', 'Use Current Location', () => {
+        this.props.setLocation(this.props.type, {
+          lat: currentPosition.coords.latitude,
+          lon: currentPosition.coords.longitude,
+          name: '(Current Location)'
+        })
+      })
+      : null
 
     let geocodedFeatures = this.state.geocodedFeatures
     if (geocodedFeatures.length > 5) geocodedFeatures = geocodedFeatures.splice(0, 5)
 
-    let nearbyStops = [] /*{
+    const nearbyStops = [] /* {
       name: 'Stop X',
       routes: ['10','11']
-    }]*/
+    }] */
 
     const formControlClassname = this.props.type + '-form-control'
     return (
@@ -104,7 +115,7 @@ class LocationField extends Component {
               noCaret
             >
               {/* current location option */}
-              {createOption('location-arrow', 'Use Current Location')}
+              {currentLocationOption}
 
               {/* geocode search result option(s) */}
               {geocodedFeatures.length > 0 && <MenuItem header>Search Results</MenuItem>}
@@ -194,7 +205,8 @@ function createTransitStopOption (name, routes, onSelect) {
 const mapStateToProps = (state, ownProps) => {
   return {
     config: state.otp.config,
-    location: state.otp.currentQuery[ownProps.type]
+    location: state.otp.currentQuery[ownProps.type],
+    currentPosition: state.otp.location.currentPosition
   }
 }
 

lib/index.js

@@ -16,6 +16,7 @@ import NarrativeItineraries from './components/narrative/narrative-itineraries'
 import NarrativeItinerary from './components/narrative/narrative-itinerary'
 
 import { setAutoPlan } from './actions/config'
+import { getCurrentPosition } from './actions/location'
 
 import createOtpReducer from './reducers/create-otp-reducer'
 
@@ -53,6 +54,7 @@ export {
   NarrativeItinerary,
 
   // actions
+  getCurrentPosition,
   setAutoPlan,
 
   // redux utilities

lib/reducers/create-otp-reducer.js

@@ -30,6 +30,10 @@ function createOtpReducer (config, initialQuery) {
   const initialState = {
     config: Object.assign(defaultConfig, config),
     currentQuery,
+    location: {
+      currentPosition: null,
+      sessionSearches: []
+    },
     searches: [],
     activeSearch: 0
   }
@@ -108,6 +112,9 @@ function createOtpReducer (config, initialQuery) {
       case 'SET_AUTOPLAN':
         return update(state, { config: { autoPlan: { $set: action.payload.autoPlan } } })
 
+      case 'POSITION_RESPONSE':
+        return update(state, { location: { currentPosition: { $set: action.payload.position } } })
+
       default:
         return state
     }