Merge pull request #290 from af83/4126-add-i18n-js

4126 Add i18n to JS

9 files changed, 43 insertions, 44 deletions

diff --git a/app/javascript/vehicle_journeys/components/ConfirmModal.js b/app/javascript/vehicle_journeys/components/ConfirmModal.js
index 3bfc852fb..75e8a3932 100644
--- a/app/javascript/vehicle_journeys/components/ConfirmModal.js
+++ b/app/javascript/vehicle_journeys/components/ConfirmModal.js
@@ -7,7 +7,7 @@ export default function ConfirmModal({dispatch, modal, onModalAccept, onModalCan
       <div className='modal-dialog'>
         <div className='modal-content'>
           <div className='modal-body'>
-            <p> Voulez-vous valider vos modifications avant de changer de page? </p>
+            <p> {I18n.t('vehicle_journeys.vehicle_journeys_matrix.modal_confirm')} </p>
           </div>
           <div className='modal-footer'>
             <button
@@ -31,11 +31,11 @@ export default function ConfirmModal({dispatch, modal, onModalAccept, onModalCan
       </div>
     </div>
   )
-} 
+}
 
 ConfirmModal.propTypes = {
   vehicleJourneys: PropTypes.array.isRequired,
   modal: PropTypes.object.isRequired,
   onModalAccept: PropTypes.func.isRequired,
   onModalCancel: PropTypes.func.isRequired
-}
\ No newline at end of file
+}
diff --git a/app/javascript/vehicle_journeys/components/Filters.js b/app/javascript/vehicle_journeys/components/Filters.js
index 2bd912e3e..f8697c930 100644
--- a/app/javascript/vehicle_journeys/components/Filters.js
+++ b/app/javascript/vehicle_journeys/components/Filters.js
@@ -46,10 +46,10 @@ export default function Filters({filters, pagination, missions, onFilter, onRese
           <div className='ffg-row'>
             {/* Plage horaire */}
             <div className='form-group togglable'>
-              <label className='control-label'>Plage horaire au départ de la course</label>
+              <label className='control-label'>{I18n.t("vehicle_journeys.form.departure_range.label")}</label>
               <div className='filter_menu'>
                 <div className='form-group time filter_menu-item'>
-                  <label className='control-label time'>Début</label>
+                  <label className='control-label time'>{I18n.t("vehicle_journeys.form.departure_range.start")}</label>
                   <div className='form-inline'>
                     <div className='input-group time'>
                       <input
@@ -73,7 +73,7 @@ export default function Filters({filters, pagination, missions, onFilter, onRese
                   </div>
                 </div>
                 <div className='form-group time filter_menu-item'>
-                  <label className='control-label time'>Fin</label>
+                  <label className='control-label time'>{I18n.t("vehicle_journeys.form.departure_range.end")}</label>
                   <div className='form-inline'>
                     <div className='input-group time'>
                       <input
@@ -101,7 +101,7 @@ export default function Filters({filters, pagination, missions, onFilter, onRese
 
             {/* Switch avec/sans horaires */}
             <div className='form-group has_switch'>
-              <label className='control-label pull-left'>Afficher les courses sans horaires</label>
+              <label className='control-label pull-left'>{I18n.t("vehicle_journeys.form.show_journeys_without_schedule")}</label>
               <div className='form-group pull-left' style={{padding: 0}}>
                 <div className='checkbox'>
                   <label>
@@ -110,8 +110,8 @@ export default function Filters({filters, pagination, missions, onFilter, onRese
                       onChange={onToggleWithoutSchedule}
                       checked={filters.query.withoutSchedule}
                       ></input>
-                    <span className='switch-label' data-checkedvalue='Non' data-uncheckedvalue='Oui'>
-                      {filters.query.withoutSchedule ? 'Oui' : 'Non'}
+                    <span className='switch-label' data-checkedvalue={I18n.t("no")} data-uncheckedvalue={I18n.t("yes")}>
+                      {filters.query.withoutSchedule ? I18n.t("yes") : I18n.t("no")}
                     </span>
                   </label>
                 </div>
@@ -122,7 +122,7 @@ export default function Filters({filters, pagination, missions, onFilter, onRese
           <div className="ffg-row">
             {/* Switch avec/sans calendrier */}
             <div className='form-group has_switch'>
-              <label className='control-label pull-left'>Afficher les courses avec calendrier</label>
+              <label className='control-label pull-left'>{I18n.t("vehicle_journeys.form.show_journeys_with_calendar")}</label>
               <div className='form-group pull-left' style={{padding: 0}}>
                 <div className='checkbox'>
                   <label>
@@ -131,8 +131,8 @@ export default function Filters({filters, pagination, missions, onFilter, onRese
                       onChange={onToggleWithoutTimeTable}
                       checked={filters.query.withoutTimeTable}
                       ></input>
-                    <span className='switch-label' data-checkedvalue='Non' data-uncheckedvalue='Oui'>
-                      {filters.query.withoutTimeTable ? 'Oui' : 'Non'}
+                    <span className='switch-label' data-checkedvalue={I18n.t("no")} data-uncheckedvalue={I18n.t("yes")}>
+                      {filters.query.withoutTimeTable ? I18n.t("yes") : I18n.t("no")}
                     </span>
                   </label>
                 </div>
diff --git a/app/javascript/vehicle_journeys/components/Navigate.js b/app/javascript/vehicle_journeys/components/Navigate.js
index 0158b8392..24843babc 100644
--- a/app/javascript/vehicle_journeys/components/Navigate.js
+++ b/app/javascript/vehicle_journeys/components/Navigate.js
@@ -17,8 +17,7 @@ export default function Navigate({ dispatch, vehicleJourneys, pagination, status
   if(status.fetchSuccess == true) {
     return (
       <div className="pagination">
-        Liste des horaires {minVJ} à {maxVJ} sur {pagination.totalCount}
-
+        {I18n.t("vehicle_journeys.vehicle_journeys_matrix.pagination", {minVJ, maxVJ, total:pagination.totalCount})}
         <form className='page_links' onSubmit={e => {e.preventDefault()}}>
           <button
             onClick={e => {
@@ -53,4 +52,4 @@ Navigate.propTypes = {
   status: PropTypes.object.isRequired,
   pagination: PropTypes.object.isRequired,
   dispatch: PropTypes.func.isRequired
-}
\ No newline at end of file
+}
diff --git a/app/javascript/vehicle_journeys/components/ToggleArrivals.js b/app/javascript/vehicle_journeys/components/ToggleArrivals.js
index 9e7089be5..9a2b0097f 100644
--- a/app/javascript/vehicle_journeys/components/ToggleArrivals.js
+++ b/app/javascript/vehicle_journeys/components/ToggleArrivals.js
@@ -5,7 +5,7 @@ import PropTypes from 'prop-types'
 export default function ToggleArrivals({filters, onToggleArrivals}) {
   return (
     <div className='has_switch form-group inline'>
-      <label htmlFor='toggleArrivals' className='control-label'>Afficher et éditer les horaires d'arrivée</label>
+      <label htmlFor='toggleArrivals' className='control-label'>{I18n.t('vehicle_journeys.form.show_arrival_time')}</label>
       <div className='form-group'>
         <div className='checkbox'>
           <label>
diff --git a/app/javascript/vehicle_journeys/components/Tools.js b/app/javascript/vehicle_journeys/components/Tools.js
index ee02e5a68..22ea44283 100644
--- a/app/javascript/vehicle_journeys/components/Tools.js
+++ b/app/javascript/vehicle_journeys/components/Tools.js
@@ -44,8 +44,8 @@ export default class Tools extends Component {
           <DeleteVehicleJourneys disabled={!this.hasPolicy("destroy") || !editMode}/>
         </ul>
 
-        <span className='info-msg'>{actions.getSelected(vehicleJourneys).length} course(s) sélectionnée(s)</span>
-        <button className='btn btn-xs btn-link pull-right' onClick={onCancelSelection}>Annuler la sélection</button>
+        <span className='info-msg'>{I18n.t('vehicle_journeys.vehicle_journeys_matrix.selected_journeys', {count: actions.getSelected(vehicleJourneys).length})}</span>
+        <button className='btn btn-xs btn-link pull-right' onClick={onCancelSelection}>{I18n.t('vehicle_journeys.vehicle_journeys_matrix.cancel_selection')}</button>
       </div>
     )
   }
diff --git a/app/javascript/vehicle_journeys/components/VehicleJourney.js b/app/javascript/vehicle_journeys/components/VehicleJourney.js
index 99a458f50..4a9432231 100644
--- a/app/javascript/vehicle_journeys/components/VehicleJourney.js
+++ b/app/javascript/vehicle_journeys/components/VehicleJourney.js
@@ -23,7 +23,7 @@ export default class VehicleJourney extends Component {
     let ttURL = refURL + '/time_tables/' + tt.id
 
     return (
-      <a href={ttURL} title='Voir le calendrier'><span className='fa fa-calendar' style={{ color: (tt.color ? tt.color : '#4B4B4B')}}></span></a>
+      <a href={ttURL} title={I18n.t('vehicle_journeys.vehicle_journeys_matrix.show_timetable')}><span className='fa fa-calendar' style={{ color: (tt.color ? tt.color : '#4B4B4B')}}></span></a>
     )
   }
 
@@ -32,7 +32,7 @@ export default class VehicleJourney extends Component {
     let ttURL = refURL + '/purchase_windows/' + tt.id
 
     return (
-      <a href={ttURL} title='Voir le calendrier commercial'><span className='fa fa-calendar' style={{color: (tt.color ? tt.color : '')}}></span></a>
+      <a href={ttURL} title={I18n.t('vehicle_journeys.vehicle_journeys_matrix.show_purchase_window')}><span className='fa fa-calendar' style={{color: (tt.color ? tt.color : '')}}></span></a>
     )
   }
 
@@ -65,7 +65,7 @@ export default class VehicleJourney extends Component {
           }
           >
           <div className='strong mb-xs'>{this.props.value.short_id || '-'}</div>
-          <div>{this.props.value.published_journey_name && this.props.value.published_journey_name != "non renseigné" ? this.props.value.published_journey_name : '-'}</div>
+          <div>{this.props.value.published_journey_name && this.props.value.published_journey_name != I18n.t('undefined') ? this.props.value.published_journey_name : '-'}</div>
           <div>{this.props.value.journey_pattern.short_id || '-'}</div>
           <div>{this.props.value.company ? this.props.value.company.name : '-'}</div>
           <div>
@@ -100,7 +100,7 @@ export default class VehicleJourney extends Component {
           <div key={i} className='td text-center'>
             <div className={'cellwrap' + (this.cityNameChecker(vj) ? ' headlined' : '')}>
               {this.props.filters.toggleArrivals &&
-                <div data-headline='Arrivée à'>
+                <div data-headline={I18n.t("vehicle_journeys.form.arrival_at")}>
                   <span className={((this.isDisabled(this.props.value.deletable, vj.dummy) || this.props.filters.policy['vehicle_journeys.update'] == false) ? 'disabled ' : '') + 'input-group time'}>
                     <input
                       type='number'
@@ -131,7 +131,7 @@ export default class VehicleJourney extends Component {
                     <span className='sb sb-chrono sb-lg text-warning' data-textinside={vj.delta}></span>
                   }
                 </div>
-                <div data-headline='Départ à'>
+                <div data-headline={I18n.t("vehicle_journeys.form.departure_at")}>
                   <span className={((this.isDisabled(this.props.value.deletable, vj.dummy) || this.props.filters.policy['vehicle_journeys.update'] == false) ? 'disabled ' : '') + 'input-group time'}>
                     <input
                       type='number'
diff --git a/app/javascript/vehicle_journeys/components/VehicleJourneys.js b/app/javascript/vehicle_journeys/components/VehicleJourneys.js
index ae852b35a..01e07ee0c 100644
--- a/app/javascript/vehicle_journeys/components/VehicleJourneys.js
+++ b/app/javascript/vehicle_journeys/components/VehicleJourneys.js
@@ -106,14 +106,14 @@ export default class VehicleJourneys extends Component {
           <div className='col-lg-12'>
             {(this.props.status.fetchSuccess == false) && (
               <div className='alert alert-danger mt-sm'>
-                <strong>Erreur : </strong>
-                la récupération des missions a rencontré un problème. Rechargez la page pour tenter de corriger le problème.
+                <strong>{I18n.tc("error")}</strong>
+                {I18n.t("vehicle_journeys.vehicle_journeys_matrix.fetching_error")}
               </div>
             )}
 
             { this.vehicleJourneysList().errors && this.vehicleJourneysList().errors.length && _.some(this.vehicleJourneysList(), 'errors') && (
               <div className="alert alert-danger mt-sm">
-                <strong>Erreur : </strong>
+                <strong>{I18n.tc("error")}</strong>
                 {this.vehicleJourneysList().map((vj, index) =>
                   vj.errors && vj.errors.map((err, i) => {
                     return (
@@ -129,12 +129,12 @@ export default class VehicleJourneys extends Component {
             <div className={'table table-2entries mt-sm mb-sm' + ((this.vehicleJourneysList().length > 0) ? '' : ' no_result')}>
               <div className='t2e-head w20'>
                 <div className='th'>
-                  <div className='strong mb-xs'>ID course</div>
-                  <div>Nom course</div>
-                  <div>ID mission</div>
-                  <div>Transporteur</div>
-                  <div>Calendriers</div>
-                  { this.hasFeature('purchase_windows') && <div>Calendriers Commerciaux</div> }
+                  <div className='strong mb-xs'>{I18n.attribute_name("vehicle_journey", "id")}</div>
+                  <div>{I18n.attribute_name("vehicle_journey", "name")}</div>
+                  <div>{I18n.attribute_name("vehicle_journey", "journey_pattern_id")}</div>
+                  <div>{I18n.model_name("company")}</div>
+                  <div>{I18n.model_name("time_table", "plural": true)}</div>
+                  { this.hasFeature('purchase_windows') && <div>{I18n.model_name("purchase_window", "plural": true)}</div> }
                 </div>
                 {this.stopPoints().map((sp, i) =>{
                   return (
diff --git a/app/javascript/vehicle_journeys/components/tools/EditVehicleJourney.js b/app/javascript/vehicle_journeys/components/tools/EditVehicleJourney.js
index f6a0e3c61..d3c01f154 100644
--- a/app/javascript/vehicle_journeys/components/tools/EditVehicleJourney.js
+++ b/app/javascript/vehicle_journeys/components/tools/EditVehicleJourney.js
@@ -59,7 +59,7 @@ export default class EditVehicleJourney extends Component {
               <div className='modal-dialog'>
                 <div className='modal-content'>
                   <div className='modal-header'>
-                    <h4 className='modal-title'>Informations</h4>
+                    <h4 className='modal-title'>{I18n.t('vehicle_journeys.form.infos')}</h4>
                     <span type="button" className="close modal-close" data-dismiss="modal">&times;</span>
                   </div>
 
@@ -69,7 +69,7 @@ export default class EditVehicleJourney extends Component {
                           <div className='row'>
                             <div className='col-lg-6 col-md-6 col-sm-6 col-xs-12'>
                               <div className='form-group'>
-                                <label className='control-label'>Nom de la course</label>
+                                <label className='control-label'>{I18n.attribute_name('vehicle_journey', 'journey_name')}</label>
                                 <input
                                   type='text'
                                   ref='published_journey_name'
@@ -82,7 +82,7 @@ export default class EditVehicleJourney extends Component {
                             </div>
                             <div className='col-lg-6 col-md-6 col-sm-6 col-xs-12'>
                               <div className='form-group'>
-                                <label className='control-label'>Mission</label>
+                                <label className='control-label'>{I18n.attribute_name('vehicle_journey', 'journey_pattern')}</label>
                                 <input
                                   type='text'
                                   className='form-control'
@@ -96,7 +96,7 @@ export default class EditVehicleJourney extends Component {
                         <div className='row'>
                           <div className='col-lg-6 col-md-6 col-sm-6 col-xs-12'>
                             <div className='form-group'>
-                              <label className='control-label'>Numéro de train</label>
+                              <label className='control-label'>{I18n.attribute_name('vehicle_journey', 'company')}</label>
                               <input
                                 type='text'
                                 ref='published_journey_identifier'
@@ -109,7 +109,7 @@ export default class EditVehicleJourney extends Component {
                           </div>
                           <div className='col-lg-6 col-md-6 col-sm-6 col-xs-12'>
                             <div className='form-group'>
-                              <label className='control-label'>Transporteur</label>
+                              <label className='control-label'>{I18n.attribute_name('vehicle_journey', 'company')}</label>
                               <CompanySelect2
                                 editModal={this.props.modal.type == "edit"}
                                 editMode={this.editMode()}
@@ -124,29 +124,29 @@ export default class EditVehicleJourney extends Component {
                         <div className='row'>
                           <div className='col-lg-6 col-md-6 col-sm-6 col-xs-12'>
                             <div className='form-group'>
-                              <label className='control-label'>Mode de transport</label>
+                              <label className='control-label'>{I18n.attribute_name('vehicle_journey', 'transport_mode')}</label>
                               <input
                                 type='text'
                                 className='form-control'
-                                value={window.I18n.fr.enumerize.transport_mode[this.props.modal.modalProps.vehicleJourney.transport_mode]}
+                                value={I18n.enumerize('transport_mode', this.props.modal.modalProps.vehicleJourney.transport_mode)}
                                 disabled={true}
                               />
                             </div>
                           </div>
                           <div className='col-lg-6 col-md-6 col-sm-6 col-xs-12'>
                             <div className='form-group'>
-                              <label className='control-label'>Sous mode de transport</label>
+                              <label className='control-label'>{I18n.attribute_name('vehicle_journey', 'transport_submode')}</label>
                               <input
                                 type='text'
                                 className='form-control'
-                                value={window.I18n.fr.enumerize.transport_submode[this.props.modal.modalProps.vehicleJourney.transport_submode]}
+                                value={I18n.enumerize('transport_submode', this.props.modal.modalProps.vehicleJourney.transport_submode)}
                                 disabled={true}
                               />
                             </div>
                           </div>
                         </div>
                         <div className='form-group'>
-                          <label className='control-label'>Signature métier</label>
+                          <label className='control-label'>{I18n.attribute_name('vehicle_journey', 'checksum')}</label>
                             <input
                             type='text'
                             ref='checksum'
diff --git a/app/javascript/vehicle_journeys/components/tools/VehicleJourneyInfoButton.js b/app/javascript/vehicle_journeys/components/tools/VehicleJourneyInfoButton.js
index a63a1d701..538bbdbd6 100644
--- a/app/javascript/vehicle_journeys/components/tools/VehicleJourneyInfoButton.js
+++ b/app/javascript/vehicle_journeys/components/tools/VehicleJourneyInfoButton.js
@@ -10,7 +10,7 @@ export default class VehicleJourneyInfoButton extends Component {
 
   render() {
     return (
-      <li className='st_action'>
+      <div className='info-button'>
         <button
           type='button'
           data-toggle='modal'
@@ -19,7 +19,7 @@ export default class VehicleJourneyInfoButton extends Component {
         >
           <span className='fa fa-info'></span>
         </button>
-      </li>
+      </div>
     )
   }
 }