Refs #4614

Add trad to React itineraries

10 files changed, 84 insertions, 42 deletions

diff --git a/app/assets/javascripts/es6_browserified/itineraries/components/App.js b/app/assets/javascripts/es6_browserified/itineraries/components/App.js
index e662d140c..f4cc5e4a6 100644
--- a/app/assets/javascripts/es6_browserified/itineraries/components/App.js
+++ b/app/assets/javascripts/es6_browserified/itineraries/components/App.js
@@ -1,12 +1,28 @@
 var React = require('react')
+var { Component, PropTypes } = require('react')
 var AddStopPoint = require('../containers/AddStopPoint')
 var VisibleStopPoints = require('../containers/VisibleStopPoints')
+const clone = require('../../helpers/clone')
+const I18n = clone(window , "I18n", true)
 
-const App = () => (
-  <div>
-    <VisibleStopPoints />
-    <AddStopPoint />
-  </div>
-)
+class App extends Component {
+
+  getChildContext() {
+    return { I18n }
+  }
+
+  render() {
+    return (
+      <div>
+        <VisibleStopPoints />
+        <AddStopPoint />
+      </div>
+    )  
+  } 
+}
+
+App.childContextTypes = {
+  I18n: PropTypes.object
+}
 
 module.exports = App
diff --git a/app/assets/javascripts/es6_browserified/itineraries/components/BSelect2.js b/app/assets/javascripts/es6_browserified/itineraries/components/BSelect2.js
index 64c6d3ac7..9a82b7925 100644
--- a/app/assets/javascripts/es6_browserified/itineraries/components/BSelect2.js
+++ b/app/assets/javascripts/es6_browserified/itineraries/components/BSelect2.js
@@ -1,6 +1,6 @@
 var _ = require('lodash')
 var React = require('react')
-var PropTypes = require('react').PropTypes
+var { Component, PropTypes } = require('react')
 var Select2 = require('react-select2')
 
 
@@ -9,9 +9,9 @@ var origin = window.location.origin
 var path = window.location.pathname.split('/', 3).join('/')
 
 
-class BSelect3 extends React.Component{
-  constructor(props) {
-    super(props)
+class BSelect3 extends Component{
+  constructor(props, context) {
+    super(props, context)
   }
   onChange(e) {
     this.props.onChange(this.props.index, {
@@ -73,7 +73,7 @@ class BSelect3 extends React.Component{
   }
 }
 
-class BSelect2 extends React.Component{
+class BSelect2 extends Component{
   componentDidMount() {
     this.refs.newSelect.el.select2('open')
   }
@@ -85,7 +85,7 @@ class BSelect2 extends React.Component{
         onSelect={ this.props.onSelect }
         ref='newSelect'
         options={{
-          placeholder: 'Sélectionnez un arrêt existant...',
+          placeholder: this.context.I18n.routes.edit.select2.placeholder,
           allowClear: true,
           language: 'fr', /* Doesn't seem to work... :( */
           theme: 'bootstrap',
@@ -121,4 +121,8 @@ class BSelect2 extends React.Component{
   }
 }
 
+BSelect2.contextTypes = {
+  I18n: PropTypes.object
+}
+
 module.exports = BSelect3
diff --git a/app/assets/javascripts/es6_browserified/itineraries/components/OlMap.js b/app/assets/javascripts/es6_browserified/itineraries/components/OlMap.js
index b9e106c1a..937871346 100644
--- a/app/assets/javascripts/es6_browserified/itineraries/components/OlMap.js
+++ b/app/assets/javascripts/es6_browserified/itineraries/components/OlMap.js
@@ -1,11 +1,10 @@
 var _ = require('lodash')
 var React = require('react')
-var Component = require('react').Component
-var PropTypes = require('react').PropTypes
+var { Component, PropTypes } = require('react')
 
 class OlMap extends Component{
-  constructor(props){
-    super(props)
+  constructor(props, context){
+    super(props, context)
   }
 
   fetchApiURL(id){
@@ -116,40 +115,40 @@ class OlMap extends Component{
               <strong>{this.props.value.olMap.json.name}</strong>
             </p>
             <p>
-              <strong>Type d'arrêt : </strong>
+              <strong>{this.context.I18n.routes.edit.stop_point_type} : </strong>
               {this.props.value.olMap.json.area_type}
             </p>
             <p>
-              <strong>Nom court : </strong>
+              <strong>{this.context.I18n.routes.edit.short_name} : </strong>
               {this.props.value.olMap.json.short_name}
             </p>
             <p>
-              <strong>ID Reflex : </strong>
+              <strong>{this.context.I18n.id_reflex} : </strong>
               {this.props.value.olMap.json.user_objectid}
             </p>
 
-            <p><strong>Coordonnées : </strong></p>
+            <p><strong>{this.context.I18n.routes.edit.map.coordinates} : </strong></p>
             <p style={{paddingLeft: 10, marginTop: 0}}>
-              <em>Proj.: </em>WSG84<br/>
-              <em>Lat.: </em>{this.props.value.olMap.json.latitude} <br/>
-              <em>Lon.: </em>{this.props.value.olMap.json.longitude}
+              <em>{this.context.I18n.routes.edit.map.proj}.: </em>WSG84<br/>
+              <em>{this.context.I18n.routes.edit.map.lat}.: </em>{this.props.value.olMap.json.latitude} <br/>
+              <em>{this.context.I18n.routes.edit.map.lon}.: </em>{this.props.value.olMap.json.longitude}
             </p>
             <p>
-              <strong>Code Postal : </strong>
+              <strong>{this.context.I18n.routes.edit.map.postal_code} : </strong>
               {this.props.value.olMap.json.zip_code}
             </p>
             <p>
-              <strong>Commune : </strong>
+              <strong>{this.context.I18n.routes.edit.map.city} : </strong>
               {this.props.value.olMap.json.city_name}
             </p>
             <p>
-              <strong>Commentaire : </strong>
+              <strong>{this.context.I18n.routes.edit.map.comment} : </strong>
               {this.props.value.olMap.json.comment}
             </p>
             {(this.props.value.stoparea_id != this.props.value.olMap.json.stoparea_id) &&(
               <div className='btn btn-outline-primary btn-sm'
                 onClick= {() => {this.props.onUpdateViaOlMap(this.props.index, this.props.value.olMap.json)}}
-              >Sélectionner</div>
+              >{this.context.I18n.actions.select}</div>
             )}
           </div>
             <div className='map_content'>
@@ -163,7 +162,11 @@ class OlMap extends Component{
   }
 }
 
-OlMap.propTypes = {
+OlMap.PropTypes = {
+}
+
+OlMap.contextTypes = {
+  I18n: PropTypes.object
 }
 
 module.exports = OlMap
diff --git a/app/assets/javascripts/es6_browserified/itineraries/components/StopPoint.js b/app/assets/javascripts/es6_browserified/itineraries/components/StopPoint.js
index 48f77b8e9..c3996f5b3 100644
--- a/app/assets/javascripts/es6_browserified/itineraries/components/StopPoint.js
+++ b/app/assets/javascripts/es6_browserified/itineraries/components/StopPoint.js
@@ -3,7 +3,7 @@ var PropTypes = require('react').PropTypes
 var BSelect2 = require('./BSelect2')
 var OlMap = require('./OlMap')
 
-const StopPoint = (props) => {
+const StopPoint = (props, {I18n}) => {
   return (
     <div className='nested-fields'>
       <div className='wrapper'>
@@ -17,15 +17,15 @@ const StopPoint = (props) => {
 
         <div>
           <select className='form-control' value={props.value.for_boarding} id="for_boarding" onChange={props.onSelectChange}>
-            <option value="normal">Montée autorisée</option>
-            <option value="forbidden">Montée interdite</option>
+            <option value="normal">{I18n.routes.edit.stop_point.boarding.normal}</option>
+            <option value="forbidden">{I18n.routes.edit.stop_point.boarding.forbidden}</option>
           </select>
         </div>
 
         <div>
           <select className='form-control' value={props.value.for_alighting} id="for_alighting" onChange={props.onSelectChange}>
-            <option value="normal">Descente autorisée</option>
-            <option value="forbidden">Descente interdite</option>
+            <option value="normal">{I18n.routes.edit.stop_point.alighting.normal}</option>
+            <option value="forbidden">{I18n.routes.edit.stop_point.alighting.forbidden}</option>
           </select>
         </div>
 
@@ -90,4 +90,8 @@ StopPoint.propTypes = {
   value: PropTypes.object
 }
 
+StopPoint.contextTypes = {
+  I18n: PropTypes.object
+}
+
 module.exports = StopPoint
diff --git a/app/assets/javascripts/es6_browserified/itineraries/components/StopPointList.js b/app/assets/javascripts/es6_browserified/itineraries/components/StopPointList.js
index 77077dbd8..37a480fca 100644
--- a/app/assets/javascripts/es6_browserified/itineraries/components/StopPointList.js
+++ b/app/assets/javascripts/es6_browserified/itineraries/components/StopPointList.js
@@ -2,29 +2,29 @@ var React = require('react')
 var PropTypes = require('react').PropTypes
 var StopPoint = require('./StopPoint')
 
-const StopPointList = ({ stopPoints, onDeleteClick, onMoveUpClick, onMoveDownClick, onChange, onSelectChange, onToggleMap, onToggleEdit, onSelectMarker, onUnselectMarker, onUpdateViaOlMap }) => {
+const StopPointList = ({ stopPoints, onDeleteClick, onMoveUpClick, onMoveDownClick, onChange, onSelectChange, onToggleMap, onToggleEdit, onSelectMarker, onUnselectMarker, onUpdateViaOlMap }, {I18n}) => {
   return (
     <div className='subform'>
       <div className='nested-head'>
         <div className="wrapper">
           <div style={{width: 100}}>
             <div className="form-group">
-              <label className="control-label">ID Reflex</label>
+              <label className="control-label">{I18n.reflex_id}</label>
             </div>
           </div>
           <div>
             <div className="form-group">
-              <label className="control-label">Arrêt</label>
+              <label className="control-label">{I18n.simple_form.labels.stop_point.name}</label>
             </div>
           </div>
           <div>
             <div className="form-group">
-              <label className="control-label">Montée</label>
+              <label className="control-label">{I18n.simple_form.labels.stop_point.for_boarding}</label>
             </div>
           </div>
           <div>
             <div className="form-group">
-              <label className="control-label">Descente</label>
+              <label className="control-label">{I18n.simple_form.labels.stop_point.for_alighting}</label>
             </div>
           </div>
           <div className='actions-5'></div>
@@ -65,4 +65,8 @@ StopPointList.propTypes = {
   onUnselectMarker : PropTypes.func.isRequired
 }
 
+StopPointList.contextTypes = {
+  I18n: PropTypes.object
+}
+
 module.exports = StopPointList
diff --git a/app/assets/javascripts/es6_browserified/itineraries/index.js b/app/assets/javascripts/es6_browserified/itineraries/index.js
index bb06126f7..13d89bec5 100644
--- a/app/assets/javascripts/es6_browserified/itineraries/index.js
+++ b/app/assets/javascripts/es6_browserified/itineraries/index.js
@@ -5,7 +5,9 @@ var createStore = require('redux').createStore
 var reducers = require('./reducers')
 var App = require('./components/App')
 var { handleForm, handleStopPoints } = require('./form_helper')
-let datas = JSON.parse(decodeURIComponent(window.itinerary_stop))
+let clone = require('../helpers/clone')
+let datas = clone(window, "itinerary_stop", true)
+datas = JSON.parse(decodeURIComponent(datas))
 
 // logger, DO NOT REMOVE
 // var applyMiddleware = require('redux').applyMiddleware
diff --git a/app/assets/javascripts/es6_browserified/itineraries/show.js b/app/assets/javascripts/es6_browserified/itineraries/show.js
index 79a11701f..e88469900 100644
--- a/app/assets/javascripts/es6_browserified/itineraries/show.js
+++ b/app/assets/javascripts/es6_browserified/itineraries/show.js
@@ -1,4 +1,7 @@
+const clone = require('../helpers/clone')
+let route = clone(window, "route", true)
 route = JSON.parse(decodeURIComponent(route))
+
 const geoColPts = []
 const geoColLns= []
 const geoColEdges = [
diff --git a/app/assets/javascripts/es6_browserified/time_tables/actions/index.js b/app/assets/javascripts/es6_browserified/time_tables/actions/index.js
index 361e89c36..a421a8ed6 100644
--- a/app/assets/javascripts/es6_browserified/time_tables/actions/index.js
+++ b/app/assets/javascripts/es6_browserified/time_tables/actions/index.js
@@ -1,5 +1,6 @@
 const _ = require('lodash')
-const { I18n } = window
+const clone = require('../../helpers/clone')
+const I18n = clone(window, "I18n")
 
 const actions = {
   weekDays: (index) => {
diff --git a/app/assets/javascripts/es6_browserified/time_tables/containers/App.js b/app/assets/javascripts/es6_browserified/time_tables/containers/App.js
index 772747104..f12fb8a71 100644
--- a/app/assets/javascripts/es6_browserified/time_tables/containers/App.js
+++ b/app/assets/javascripts/es6_browserified/time_tables/containers/App.js
@@ -9,7 +9,9 @@ var PeriodForm = require('./PeriodForm')
 var SaveTimetable = require('./SaveTimetable')
 var ConfirmModal = require('./ConfirmModal')
 var ErrorModal = require('./ErrorModal')
-const { I18n } = window
+
+const clone = require('../../helpers/clone')
+const I18n = clone(window, "I18n", true)
 
 class App extends Component {
   componentDidMount(){
diff --git a/app/assets/javascripts/es6_browserified/time_tables/index.js b/app/assets/javascripts/es6_browserified/time_tables/index.js
index a91747991..6c352df6b 100644
--- a/app/assets/javascripts/es6_browserified/time_tables/index.js
+++ b/app/assets/javascripts/es6_browserified/time_tables/index.js
@@ -5,6 +5,9 @@ var createStore = require('redux').createStore
 var timeTablesApp = require('./reducers')
 var App = require('./containers/App')
 
+const clone = require('../helpers/clone')
+const actionType = clone(window, "actionType", true)
+
 // logger, DO NOT REMOVE
 // var applyMiddleware = require('redux').applyMiddleware
 // var createLogger = require('redux-logger')
@@ -13,7 +16,7 @@ var App = require('./containers/App')
 
 var initialState = {
   status: {
-    actionType: window.actionType,
+    actionType: actionType,
     policy: window.perms,
     fetchSuccess: true,
     isFetching: false