Refs #2982: updating table content layout on tt#edit

4 files changed, 38 insertions, 13 deletions

diff --git a/app/assets/javascripts/es6_browserified/time_tables/components/TimeTableDBody.js b/app/assets/javascripts/es6_browserified/time_tables/components/DayInfos.js
index 35ae79334..59672282b 100644
--- a/app/assets/javascripts/es6_browserified/time_tables/components/TimeTableDBody.js
+++ b/app/assets/javascripts/es6_browserified/time_tables/components/DayInfos.js
@@ -2,23 +2,25 @@ var React = require('react')
 var Component = require('react').Component
 var PropTypes = require('react').PropTypes
 
-class TimeTableDBody extends Component {
+class DayInfos extends Component {
   constructor(props) {
     super(props)
   }
 
   render() {
     return (
-      <div>
-        toto
+      <div className='td-group'>
+        <div className="td">A</div>
+        <div className="td">B</div>
+        <div className="td">C</div>
       </div>
     )
   }
 }
 
-TimeTableDBody.propTypes = {
+DayInfos.propTypes = {
   value: PropTypes.object.isRequired,
   index: PropTypes.number.isRequired
 }
 
-module.exports = TimeTableDBody
+module.exports = DayInfos
diff --git a/app/assets/javascripts/es6_browserified/time_tables/components/TimeTableDHead.js b/app/assets/javascripts/es6_browserified/time_tables/components/TimeTableDay.js
index e849d8d55..cc47c2052 100644
--- a/app/assets/javascripts/es6_browserified/time_tables/components/TimeTableDHead.js
+++ b/app/assets/javascripts/es6_browserified/time_tables/components/TimeTableDay.js
@@ -2,7 +2,7 @@ var React = require('react')
 var Component = require('react').Component
 var PropTypes = require('react').PropTypes
 
-class TimeTableDHead extends Component {
+class TimeTableDay extends Component {
   constructor(props) {
     super(props)
   }
@@ -26,9 +26,9 @@ class TimeTableDHead extends Component {
   }
 }
 
-TimeTableDHead.propTypes = {
+TimeTableDay.propTypes = {
   value: PropTypes.object.isRequired,
   index: PropTypes.number.isRequired
 }
 
-module.exports = TimeTableDHead
+module.exports = TimeTableDay
diff --git a/app/assets/javascripts/es6_browserified/time_tables/components/Timetable.js b/app/assets/javascripts/es6_browserified/time_tables/components/Timetable.js
index c0210a13e..9bc747b6a 100644
--- a/app/assets/javascripts/es6_browserified/time_tables/components/Timetable.js
+++ b/app/assets/javascripts/es6_browserified/time_tables/components/Timetable.js
@@ -1,8 +1,8 @@
 var React = require('react')
 var Component = require('react').Component
 var PropTypes = require('react').PropTypes
-var TimeTableDHead = require('./TimeTableDHead')
-var TimeTableDBody = require('./TimeTableDBody')
+var TimeTableDay = require('./TimeTableDay')
+var DayInfos = require('./DayInfos')
 var actions = require('../actions')
 
 class Timetable extends Component{
@@ -10,6 +10,26 @@ class Timetable extends Component{
     super(props)
   }
 
+  componentDidUpdate(prevProps, prevState) {
+    if(this.props.status.isFetching == false){
+      $('.table-2entries').each(function() {
+        var refH = []
+        var refCol = []
+
+        $(this).find('.t2e-head').children('.td').each(function() {
+          var h = $(this).outerHeight();
+          refH.push(h)
+        });
+
+        $(this).find('.t2e-item').children('.td-group').each(function() {
+          for(var nth = 0; nth < refH.length; nth++) {
+            $(this).find('.td:nth-child('+ (nth + 1) +')').css('height', refH[nth]);
+          }
+        });
+      });
+    }
+  }
+
   render() {
     return (
       <div className='row'>
@@ -33,7 +53,7 @@ class Timetable extends Component{
 
                     <div className='monthDays'>
                       {this.props.timetable.current_month.map((day, i) =>
-                        <TimeTableDHead
+                        <TimeTableDay
                           key={i}
                           index={i}
                           value={day}
@@ -41,8 +61,9 @@ class Timetable extends Component{
                       )}
                     </div>
                   </div>
+
                   {this.props.timetable.current_month.map((day, i) =>
-                    <TimeTableDBody
+                    <DayInfos
                       key={i}
                       index={i}
                       value={day}
@@ -60,6 +81,7 @@ class Timetable extends Component{
 
 Timetable.propTypes = {
   timetable: PropTypes.object.isRequired,
+  status: PropTypes.object.isRequired
 }
 
 module.exports = Timetable
diff --git a/app/assets/javascripts/es6_browserified/time_tables/containers/Timetable.js b/app/assets/javascripts/es6_browserified/time_tables/containers/Timetable.js
index 2282afe80..0bd1444c4 100644
--- a/app/assets/javascripts/es6_browserified/time_tables/containers/Timetable.js
+++ b/app/assets/javascripts/es6_browserified/time_tables/containers/Timetable.js
@@ -3,7 +3,8 @@ var TimetableComponent = require('../components/Timetable')
 
 const mapStateToProps = (state) => {
   return {
-    timetable: state.timetable
+    timetable: state.timetable,
+    status: state.status
   }
 }