Refs #2404: Toggle olMap when clicking on button for each stop point

Signed-off-by: Thomas Shawarma Haddad <thomas.haddad@af83.com>
Signed-off-by: Jean-Paul Lescouzeres <jean-paul.lescouzeres@af83.com>

6 files changed, 35 insertions, 30 deletions

diff --git a/app/assets/javascripts/es6_browserified/itineraries/components/OlMap.js b/app/assets/javascripts/es6_browserified/itineraries/components/OlMap.js
index a0135bb3c..593528d65 100644
--- a/app/assets/javascripts/es6_browserified/itineraries/components/OlMap.js
+++ b/app/assets/javascripts/es6_browserified/itineraries/components/OlMap.js
@@ -6,11 +6,29 @@ class OlMap extends Component{
   constructor(props){
     super(props)
   }
-  componentDidMount() {
+  componentDidUpdate(prev, next) {
+    if(prev.value.olMap.isOpened == false){
+      var map = new ol.Map({
+       target: 'CUSTOM_map' + this.props.index,
+       layers: [
+         new ol.layer.Tile({
+           source: new ol.source.OSM()
+         })
+       ],
+       view: new ol.View({
+         center: ol.proj.fromLonLat([37.41, 8.82]),
+         zoom: 4
+       })
+      });
+    }
   }
 
   render() {
-    return <div></div>
+    if (this.props.value.olMap.isOpened){
+      return <div id={"CUSTOM_map" + this.props.index}></div>
+    }else{
+      return false
+    }
   }
 }
 
diff --git a/app/assets/javascripts/es6_browserified/itineraries/components/StopPoint.js b/app/assets/javascripts/es6_browserified/itineraries/components/StopPoint.js
index eee3a05f8..b4ba3cab9 100644
--- a/app/assets/javascripts/es6_browserified/itineraries/components/StopPoint.js
+++ b/app/assets/javascripts/es6_browserified/itineraries/components/StopPoint.js
@@ -70,7 +70,10 @@ const StopPoint = (props) => {
         </div>
       </div>
       <div>
-        <OlMap />
+        <OlMap
+          value = {props.value}
+          index = {props.index}
+        />
       </div>
     </div>
   )
diff --git a/app/assets/javascripts/es6_browserified/itineraries/containers/OlMap.js b/app/assets/javascripts/es6_browserified/itineraries/containers/OlMap.js
deleted file mode 100644
index 369795a39..000000000
--- a/app/assets/javascripts/es6_browserified/itineraries/containers/OlMap.js
+++ /dev/null
@@ -1,15 +0,0 @@
-var actions = require('../actions')
-var connect = require('react-redux').connect
-
-const mapStateToProps = (state) => {
-}
-
-const mapDispatchToProps = (dispatch) => {
-}
-
-const OlMap = connect(
-  mapStateToProps,
-  mapDispatchToProps
-)(StopPointList)
-
-module.exports = OlMap
diff --git a/app/assets/javascripts/es6_browserified/itineraries/reducers/index.js b/app/assets/javascripts/es6_browserified/itineraries/reducers/index.js
index bf20aacf7..446c9ed36 100644
--- a/app/assets/javascripts/es6_browserified/itineraries/reducers/index.js
+++ b/app/assets/javascripts/es6_browserified/itineraries/reducers/index.js
@@ -1,10 +1,8 @@
 var combineReducers = require('redux').combineReducers
 var stopPoints = require('./stopPoints')
-var olMap = require('./olMap')
 
 const stopPointsApp = combineReducers({
-  stopPoints,
-  olMap
+  stopPoints
 })
 
 module.exports = stopPointsApp
diff --git a/app/assets/javascripts/es6_browserified/itineraries/reducers/olMap.js b/app/assets/javascripts/es6_browserified/itineraries/reducers/olMap.js
deleted file mode 100644
index 346420cde..000000000
--- a/app/assets/javascripts/es6_browserified/itineraries/reducers/olMap.js
+++ /dev/null
@@ -1,8 +0,0 @@
-const olMap = (state = {}, action) => {
-  switch (action.type) {
-    default:
-      return state
-  }
-}
-
-module.exports = olMap
diff --git a/app/assets/javascripts/es6_browserified/itineraries/reducers/stopPoints.js b/app/assets/javascripts/es6_browserified/itineraries/reducers/stopPoints.js
index 8cf57e2c1..a66ff5453 100644
--- a/app/assets/javascripts/es6_browserified/itineraries/reducers/stopPoints.js
+++ b/app/assets/javascripts/es6_browserified/itineraries/reducers/stopPoints.js
@@ -78,7 +78,16 @@ const stopPoints = (state = [], action) => {
         }
       })
     case 'TOGGLE_MAP':
-      return state
+      return state.map( (t,i) => {
+        if (i === action.index){
+          let val = !t.olMap.isOpened
+          let stateMap = Object.assign({},t.olMap, {isOpened: val})
+          return Object.assign({}, t, {olMap: stateMap})
+        }else {
+          let emptyMap = Object.assign({}, t.olMap, {isOpened: false, json : {}})
+          return Object.assign({}, t, {olMap: emptyMap})
+        }
+      })
     default:
       return state
   }