feat(actions): add ability to switch locations

Author: evansiroky

example.js

@@ -7,7 +7,7 @@ import thunk from 'redux-thunk'
 import createLogger from 'redux-logger'
 
 // import Bootstrap Grid components for layout
-import { Navbar, Grid, Row, Col } from 'react-bootstrap'
+import { Navbar, Grid, Row, Col, Button } from 'react-bootstrap'
 
 // import OTP-RR components
 import {
@@ -25,6 +25,8 @@ import {
   ErrorMessage
 } from './lib'
 
+import SwitchButton from './lib/components/form/switchButton'
+
 // load the OTP configuration
 import otpConfig from './config.yml'
 
@@ -63,6 +65,7 @@ class OtpRRExample extends Component {
           <Col xs={12} md={4} className='sidebar'>
             <LocationField type='from' label='Enter start location or click on map...' />
             <LocationField type='to' label='Enter destination or click on map...' />
+            <SwitchButton />
             <ModeSelector />
             <DateTimeSelector />
             <ErrorMessage />

lib/actions/map.js

@@ -13,8 +13,16 @@ import { formChanged } from './form'
  *   }
  */
 
-export const settingLocation = createAction('SET_LOCATION')
 export const clearingLocation = createAction('CLEAR_LOCATION')
+export const settingLocation = createAction('SET_LOCATION')
+export const switchingLocations = createAction('SWITCH_LOCATIONS')
+
+export function clearLocation (payload) {
+  return function (dispatch, getState) {
+    dispatch(clearingLocation(payload))
+    dispatch(formChanged())
+  }
+}
 
 export function setLocation (payload) {
   return function (dispatch, getState) {
@@ -23,9 +31,17 @@ export function setLocation (payload) {
   }
 }
 
-export function clearLocation (payload) {
+export function switchLocations () {
   return function (dispatch, getState) {
-    dispatch(clearingLocation(payload))
+    const {from, to} = getState().otp.currentQuery
+    dispatch(settingLocation({
+      type: 'from',
+      location: to
+    }))
+    dispatch(settingLocation({
+      type: 'to',
+      location: from
+    }))
     dispatch(formChanged())
   }
 }

lib/components/form/switchButton.js

@@ -0,0 +1,33 @@
+import React, { Component, PropTypes } from 'react'
+import { Button } from 'react-bootstrap'
+import { connect } from 'react-redux'
+
+import { switchLocations } from '../../actions/map'
+
+class SwitchButton extends Component {
+  static propTypes = {
+    onClick: PropTypes.func
+  }
+  _onClick = () => {
+    this.props.switchLocations()
+  }
+  render () {
+    return (
+      <Button
+        onClick={this._onClick || this.props.onClick}
+        >Switch</Button>
+    )
+  }
+}
+
+const mapStateToProps = (state, ownProps) => {
+  return {}
+}
+
+const mapDispatchToProps = (dispatch, ownProps) => {
+  return {
+    switchLocations: () => { dispatch(switchLocations()) }
+  }
+}
+
+export default connect(mapStateToProps, mapDispatchToProps)(SwitchButton)