Refs #2521: Add vjas time modification for vehicle journeys

Signed-off-by: Thomas Shawarma Haddad <thomas.haddad@af83.com>

5 files changed, 74 insertions, 5 deletions

diff --git a/app/assets/javascripts/es6_browserified/vehicle_journeys/actions/index.js b/app/assets/javascripts/es6_browserified/vehicle_journeys/actions/index.js
index b89f52258..fff0399f6 100644
--- a/app/assets/javascripts/es6_browserified/vehicle_journeys/actions/index.js
+++ b/app/assets/javascripts/es6_browserified/vehicle_journeys/actions/index.js
@@ -32,6 +32,14 @@ const actions = {
   toggleArrivals : () => ({
     type: 'TOGGLE_ARRIVALS',
   }),
+  updateTime : (val, subIndex, index, timeUnit, isDeparture) => ({
+    type: 'UPDATE_TIME',
+    val,
+    subIndex,
+    index,
+    timeUnit,
+    isDeparture
+  }),
   fetchVehicleJourneys : (dispatch, currentPage, nextPage) => {
     if(currentPage == undefined){
       currentPage = 1
diff --git a/app/assets/javascripts/es6_browserified/vehicle_journeys/components/VehicleJourney.js b/app/assets/javascripts/es6_browserified/vehicle_journeys/components/VehicleJourney.js
index ab3375a32..46f1f777f 100644
--- a/app/assets/javascripts/es6_browserified/vehicle_journeys/components/VehicleJourney.js
+++ b/app/assets/javascripts/es6_browserified/vehicle_journeys/components/VehicleJourney.js
@@ -47,15 +47,39 @@ class VehicleJourney extends Component {
                 key={i}
               >
                 <span>
-                  <input type='number' min='00' max='23' onInput={(e) => {this.format(e)}} defaultValue={moment(vj.arrival_time).format('hh')}/>
+                  <input
+                    type='number'
+                    min='00'
+                    max='23'
+                    onBlur={(e) => {this.props.onUpdateTime(e, i, this.props.index, 'hour', true)}}
+                    onInput={(e) => {this.format(e)}} defaultValue={moment(vj.arrival_time).utc().format('HH')}
+                  />
                   <span>:</span>
-                  <input type='number' min='00' max='59' onInput={(e) => {this.format(e)}} defaultValue={moment(vj.arrival_time).format('mm')}/>
+                  <input
+                    type='number'
+                    min='00'
+                    max='59'
+                    onBlur={(e) => {this.props.onUpdateTime(e, i, this.props.index, "minute", true)}}
+                    onInput={(e) => {this.format(e)}} defaultValue={moment(vj.arrival_time).utc().format('mm')}
+                  />
                 </span>
                 {this.props.filters.toggleArrivals &&
                   <span>
-                    <input type='number' min='00' max='23' onInput={(e) => {this.format(e)}} defaultValue={moment(vj.departure_time).format('hh')}/>
+                    <input
+                      type='number'
+                      min='00'
+                      max='23'
+                      onBlur={(e) => {this.props.onUpdateTime(e, i, this.props.index, 'hour', false)}}
+                      onInput={(e) => {this.format(e)}} defaultValue={moment(vj.departure_time).utc().format('HH')}
+                    />
                     <span>:</span>
-                    <input type='number' min='00' max='59' onInput={(e) => {this.format(e)}} defaultValue={moment(vj.departure_time).format('mm')}/>
+                    <input
+                      type='number'
+                      min='00'
+                      max='59'
+                      onBlur={(e) => {this.props.onUpdateTime(e, i, this.props.index, 'minute', false)}}
+                      onInput={(e) => {this.format(e)}} defaultValue={moment(vj.departure_time).utc().format('mm')}
+                    />
                   </span>
                 }
               </li>
@@ -70,7 +94,9 @@ class VehicleJourney extends Component {
 
 VehicleJourney.propTypes = {
   value: PropTypes.object.isRequired,
-  filters: PropTypes.object.isRequired
+  filters: PropTypes.object.isRequired,
+  index: PropTypes.number.isRequired,
+  onUpdateTime: PropTypes.func.isRequired,
 }
 
 module.exports = VehicleJourney
diff --git a/app/assets/javascripts/es6_browserified/vehicle_journeys/components/VehicleJourneys.js b/app/assets/javascripts/es6_browserified/vehicle_journeys/components/VehicleJourneys.js
index 0fbb5feaa..0c2a11bac 100644
--- a/app/assets/javascripts/es6_browserified/vehicle_journeys/components/VehicleJourneys.js
+++ b/app/assets/javascripts/es6_browserified/vehicle_journeys/components/VehicleJourneys.js
@@ -31,7 +31,9 @@ class VehicleJourneys extends Component{
             <VehicleJourney
               value = {vj}
               key = {index}
+              index = {index}
               filters = {this.props.filters}
+              onUpdateTime = {this.props.onUpdateTime}
               />
           )}
         </div>
@@ -43,6 +45,7 @@ class VehicleJourneys extends Component{
 VehicleJourneys.propTypes = {
   status: PropTypes.object.isRequired,
   onLoadFirstPage: PropTypes.func.isRequired,
+  onUpdateTime: PropTypes.func.isRequired,
   filters: PropTypes.object.isRequired
 }
 
diff --git a/app/assets/javascripts/es6_browserified/vehicle_journeys/containers/VehicleJourneysList.js b/app/assets/javascripts/es6_browserified/vehicle_journeys/containers/VehicleJourneysList.js
index b9aba78af..0819fed6a 100644
--- a/app/assets/javascripts/es6_browserified/vehicle_journeys/containers/VehicleJourneysList.js
+++ b/app/assets/javascripts/es6_browserified/vehicle_journeys/containers/VehicleJourneysList.js
@@ -15,6 +15,9 @@ const mapDispatchToProps = (dispatch) => {
     onLoadFirstPage: () =>{
       dispatch(actions.fetchingApi())
       actions.fetchVehicleJourneys(dispatch)
+    },
+    onUpdateTime: (e, subIndex, index, timeUnit, isDeparture) => {
+      dispatch(actions.updateTime(e.target.value, subIndex, index, timeUnit, isDeparture))
     }
   }
 }
diff --git a/app/assets/javascripts/es6_browserified/vehicle_journeys/reducers/vehicleJourneys.js b/app/assets/javascripts/es6_browserified/vehicle_journeys/reducers/vehicleJourneys.js
index 7d7db9930..dde247521 100644
--- a/app/assets/javascripts/es6_browserified/vehicle_journeys/reducers/vehicleJourneys.js
+++ b/app/assets/javascripts/es6_browserified/vehicle_journeys/reducers/vehicleJourneys.js
@@ -1,5 +1,26 @@
 var actions = require("../actions")
 
+const vehicleJourney= (state = {}, action) => {
+  switch (action.type) {
+    case 'UPDATE_TIME':
+      let vj, vjas, vjasArray
+      vjasArray = state.vehicle_journey_at_stops.map((vjas, i) =>{
+        if(i == action.subIndex){
+          if (action.isDeparture){
+            return Object.assign({}, state.vehicle_journey_at_stops[action.subIndex],  {departure_time: moment(state.vehicle_journey_at_stops[action.subIndex].departure_time).set(action.timeUnit, action.val).format()})
+          }else{
+            return Object.assign({}, state.vehicle_journey_at_stops[action.subIndex],  {arrival_time: moment(state.vehicle_journey_at_stops[action.subIndex].arrival_time).set(action.timeUnit, action.val).format()})
+          }
+        }else{
+          return vjas
+        }
+      })
+      return Object.assign({}, state, {vehicle_journey_at_stops: vjasArray})
+    default:
+      return state
+  }
+}
+
 const vehicleJourneys = (state = [], action) => {
   switch (action.type) {
     case 'RECEIVE_VEHICLE_JOURNEYS':
@@ -14,6 +35,14 @@ const vehicleJourneys = (state = [], action) => {
         actions.fetchVehicleJourneys(action.dispatch, action.pagination.page, action.nextPage)
       }
       return state
+    case 'UPDATE_TIME':
+      return state.map((vj, i) =>{
+        if (i == action.index){
+          return vehicleJourney(vj, action)
+        } else {
+          return vj
+        }
+      })
     default:
       return state
   }