Add retrieve datas when stop areas already exist

Signed-off-by: Thomas Shawarma Haddad <thomas.haddad@af83.com>
Signed-off-by: Paul-Xavier Ceccaldi <paul-xavier.ceccaldi@af83.com>

7 files changed, 44 insertions, 19 deletions

diff --git a/app/assets/javascripts/es6_browserified/actions/index.js b/app/assets/javascripts/es6_browserified/actions/index.js
index 06b0410b6..c0f64005e 100644
--- a/app/assets/javascripts/es6_browserified/actions/index.js
+++ b/app/assets/javascripts/es6_browserified/actions/index.js
@@ -1,10 +1,8 @@
-let nextTodoId = 0
 module.exports = {
 
   addStop : () => {
     return {
-      type: 'ADD_STOP',
-      id: nextTodoId++
+      type: 'ADD_STOP'
     }
   },
 
diff --git a/app/assets/javascripts/es6_browserified/components/Todo.js b/app/assets/javascripts/es6_browserified/components/Todo.js
index 574f3ac88..aeee78295 100644
--- a/app/assets/javascripts/es6_browserified/components/Todo.js
+++ b/app/assets/javascripts/es6_browserified/components/Todo.js
@@ -9,10 +9,10 @@ const Todo = (props)  => (
   <div className='list-group-item' style={Container}>
     <div style={firstBlock}>
       <div style={{display: 'inline-block', width: '9%'}}>
-        <span className='strong'>Id: {props.id}</span>
+        <span className='strong'>Id: {props.index}</span>
       </div>
       <div style={{display: 'inline-block', width: '91%'}}>
-        <input type='text' className='form-control' id={'route_stop_points_' + props.id} value={props.text} onChange={props.onChange}/>
+        <input type='text' className='form-control' id={'route_stop_points_' + props.index} value={props.text} onChange={props.onChange}/>
       </div>
     </div>
 
diff --git a/app/assets/javascripts/es6_browserified/components/TodoList.js b/app/assets/javascripts/es6_browserified/components/TodoList.js
index 96991e76b..768c691bb 100644
--- a/app/assets/javascripts/es6_browserified/components/TodoList.js
+++ b/app/assets/javascripts/es6_browserified/components/TodoList.js
@@ -21,7 +21,7 @@ const TodoList = ({ todos, onDeleteClick, onMoveUpClick, onMoveDownClick, onChan
 
 TodoList.propTypes = {
   todos: PropTypes.arrayOf(PropTypes.shape({
-    id: PropTypes.number.isRequired,
+    index: PropTypes.number.isRequired,
   }).isRequired).isRequired,
   onDeleteClick: PropTypes.func.isRequired,
   onMoveUpClick: PropTypes.func.isRequired,
diff --git a/app/assets/javascripts/es6_browserified/getJSON.js b/app/assets/javascripts/es6_browserified/getJSON.js
deleted file mode 100644
index c65336b2d..000000000
--- a/app/assets/javascripts/es6_browserified/getJSON.js
+++ /dev/null
@@ -1,4 +0,0 @@
-data = decodeURIComponent(window.itinerary_stop)
-JSONobject = JSON.parse(data)
-
-console.log("JSON", JSONobject)
diff --git a/app/assets/javascripts/es6_browserified/reducers/todos.js b/app/assets/javascripts/es6_browserified/reducers/todos.js
index 53bceb62d..d5a02f40a 100644
--- a/app/assets/javascripts/es6_browserified/reducers/todos.js
+++ b/app/assets/javascripts/es6_browserified/reducers/todos.js
@@ -1,17 +1,15 @@
-const todo = (state = {}, action) => {
+const todo = (state = {}, action, length) => {
   switch (action.type) {
     case 'ADD_STOP':
       return {
         text: '',
-        id: action.id
+        index: length
       }
     case 'UPDATE_INPUT_VALUE':
-      if (state.id !== action.index) {
+      if (state.index !== action.index) {
         return state
       }
 
-      // console.log('action', action)
-      // console.log('state', state)
       return Object.assign(
         {},
         state,
@@ -27,9 +25,11 @@ const todos = (state = [], action) => {
     case 'ADD_STOP':
       return [
         ...state,
-        todo(undefined, action)
+        todo(undefined, action, state.length)
       ]
     case 'MOVE_STOP_UP':
+      state[action.index].index = state[action.index - 1].index
+      state[action.index - 1].index = state[action.index].index + 1
       return [
         ...state.slice(0, action.index - 1),
         state[action.index],
@@ -37,6 +37,8 @@ const todos = (state = [], action) => {
         ...state.slice(action.index + 1)
       ]
     case 'MOVE_STOP_DOWN':
+      state[action.index + 1].index = state[action.index].index
+      state[action.index].index = state[action.index + 1].index + 1
       return [
         ...state.slice(0, action.index),
         state[action.index + 1],
@@ -46,7 +48,10 @@ const todos = (state = [], action) => {
     case 'DELETE_STOP':
       return [
         ...state.slice(0, action.index),
-        ...state.slice(action.index + 1)
+        ...state.slice(action.index + 1).map((todo)=>{
+          todo.index--
+          return todo
+        })
       ]
     case 'UPDATE_INPUT_VALUE':
       return state.map(t =>
diff --git a/app/assets/javascripts/es6_browserified/stop_points.js b/app/assets/javascripts/es6_browserified/stop_points.js
index a324ef5bd..41c99c90f 100644
--- a/app/assets/javascripts/es6_browserified/stop_points.js
+++ b/app/assets/javascripts/es6_browserified/stop_points.js
@@ -2,10 +2,37 @@ var React = require('react')
 var render = require('react-dom').render
 var Provider = require('react-redux').Provider
 var createStore = require('redux').createStore
+// var applyMiddleware = require('redux').applyMiddleware
 var todoApp = require('./reducers')
 var App = require('./components/App')
+// var createLogger = require('redux-logger').default
+// var thunkMiddleware = require('redux-thunk').default
+// var promise = require('redux-promise')
 
-let store = createStore(todoApp)
+const getInitialState = () => {
+  let state = []
+  let datas = JSON.parse(decodeURIComponent(window.itinerary_stop))
+  for (let [index, value] of datas.entries()){
+    state.push({
+      index: index,
+      text: value.name,
+      city_name: value.city_name,
+      zip_code: value.zip_code
+    })
+  }
+  console.log(state)
+  return state
+}
+
+var initialState = {todos: getInitialState()}
+// const loggerMiddleware = createLogger()
+let store = createStore(
+  todoApp,
+  initialState
+  // applyMiddleware(thunkMiddleware, promise, loggerMiddleware)
+)
+
+console.log(store.getState())
 
 render(
   <Provider store={store}>
diff --git a/app/views/routes/_form.html.slim b/app/views/routes/_form.html.slim
index 9a42a3e26..2b1fe0687 100644
--- a/app/views/routes/_form.html.slim
+++ b/app/views/routes/_form.html.slim
@@ -50,7 +50,6 @@
 // Get JSON data for route stop points
 = javascript_tag do
   | window.itinerary_stop = "#{URI.escape(@route.stop_areas.all.to_json)}"
-= javascript_include_tag 'es6_browserified/getJSON.js'
 
 / StopPoints Reactux component
 = javascript_include_tag 'es6_browserified/stop_points.js'