view | history | commit | commitdiff
Anna Kurylo
2018-10-16 caf7fe1a309d8da984b077ff3c49d59a1c751065
commit | author | age
caf7fe 1 /* eslint-disable */
462115 2 'use strict';
SE 3
d76f7b 4 var React = require('react'),
cf3d92 5     createClass = require('create-react-class'),
11612b 6     moment = require('moment'),
39b827 7     onClickOutside = require('react-onclickoutside').default
cf3d92 8     ;
d76f7b 9
84755c 10 var DateTimePickerDays = onClickOutside( createClass({
d76f7b 11     render: function() {
M 12         var footer = this.renderFooter(),
13             date = this.props.viewDate,
c37f80 14             locale = date.localeData(),
d76f7b 15             tableChildren
cf3d92 16             ;
d76f7b 17
M 18         tableChildren = [
a50b2e 19             React.createElement('thead', { key: 'th' }, [
GL 20                 React.createElement('tr', { key: 'h' }, [
21                     React.createElement('th', { key: 'p', className: 'rdtPrev', onClick: this.props.subtractTime( 1, 'months' )}, React.createElement('span', {}, '‹' )),
99929e 22                     React.createElement('th', { key: 's', className: 'rdtSwitch', onClick: this.props.showView( 'months' ), colspan: 5, 'data-value': this.props.viewDate.month() }, locale.months( date ) + ' ' + date.year() ),
a50b2e 23                     React.createElement('th', { key: 'n', className: 'rdtNext', onClick: this.props.addTime( 1, 'months' )}, React.createElement('span', {}, '›' ))
18dc17 24                 ]),
a50b2e 25                 React.createElement('tr', { key: 'd'}, this.getDaysOfWeek( locale ).map( function( day, index ) { return React.createElement('th', { key: day + index, className: 'dow'}, day ); }) )
d76f7b 26             ]),
a50b2e 27             React.createElement('tbody', { key: 'tb' }, this.renderDays())
d76f7b 28         ];
M 29
462115 30         if ( footer )
d76f7b 31             tableChildren.push( footer );
M 32
a50b2e 33         return React.createElement('div', { className: 'rdtDays' },
GL 34             React.createElement('table', {}, tableChildren )
d76f7b 35         );
M 36     },
37
c37f80 38     /**
M 39      * Get a list of the days of the week
40      * depending on the current locale
41      * @return {array} A list with the shortname of the days
42      */
f0ec5a 43     getDaysOfWeek: function( locale ) {
c37f80 44         var days = locale._weekdaysMin,
M 45             first = locale.firstDayOfWeek(),
46             dow = [],
47             i = 0
cf3d92 48             ;
c37f80 49
f0ec5a 50         days.forEach( function( day ) {
SE 51             dow[ (7 + ( i++ ) - first) % 7 ] = day;
c37f80 52         });
M 53
54         return dow;
55     },
56
d76f7b 57     renderDays: function() {
M 58         var date = this.props.viewDate,
62fd2f 59             selected = this.props.selectedDate && this.props.selectedDate.clone(),
d76f7b 60             prevMonth = date.clone().subtract( 1, 'months' ),
M 61             currentYear = date.year(),
62             currentMonth = date.month(),
63             weeks = [],
64             days = [],
eba92b 65             renderer = this.props.renderDay || this.renderDay,
bdad6c 66             isValid = this.props.isValidDate || this.alwaysValidDate,
f0ec5a 67             classes, isDisabled, dayProps, currentDate
cf3d92 68             ;
d76f7b 69
M 70         // Go to the last week of the previous month
f0ec5a 71         prevMonth.date( prevMonth.daysInMonth() ).startOf( 'week' );
SE 72         var lastDay = prevMonth.clone().add( 42, 'd' );
d76f7b 73
f0ec5a 74         while ( prevMonth.isBefore( lastDay ) ) {
e4010d 75             classes = 'rdtDay';
e7f876 76             currentDate = prevMonth.clone();
d76f7b 77
462115 78             if ( ( prevMonth.year() === currentYear && prevMonth.month() < currentMonth ) || ( prevMonth.year() < currentYear ) )
e4010d 79                 classes += ' rdtOld';
462115 80             else if ( ( prevMonth.year() === currentYear && prevMonth.month() > currentMonth ) || ( prevMonth.year() > currentYear ) )
e4010d 81                 classes += ' rdtNew';
d76f7b 82
f0ec5a 83             if ( selected && prevMonth.isSame( selected, 'day' ) )
e4010d 84                 classes += ' rdtActive';
d76f7b 85
9eae92 86             if ( prevMonth.isSame( moment(), 'day' ) )
e4010d 87                 classes += ' rdtToday';
d76f7b 88
f0ec5a 89             isDisabled = !isValid( currentDate, selected );
SE 90             if ( isDisabled )
e4010d 91                 classes += ' rdtDisabled';
d76f7b 92
eba92b 93             dayProps = {
f0ec5a 94                 key: prevMonth.format( 'M_D' ),
eba92b 95                 'data-value': prevMonth.date(),
M 96                 className: classes
97             };
f0ec5a 98
SE 99             if ( !isDisabled )
1fdc4e 100                 dayProps.onClick = this.updateSelectedDate;
d76f7b 101
e7f876 102             days.push( renderer( dayProps, currentDate, selected ) );
eba92b 103
f0ec5a 104             if ( days.length === 7 ) {
a50b2e 105                 weeks.push( React.createElement('tr', { key: prevMonth.format( 'M_D' )}, days ) );
d76f7b 106                 days = [];
M 107             }
108
109             prevMonth.add( 1, 'd' );
110         }
111
112         return weeks;
113     },
114
1fdc4e 115     updateSelectedDate: function( event ) {
f0ec5a 116         this.props.updateSelectedDate( event, true );
1fdc4e 117     },
EC 118
f0ec5a 119     renderDay: function( props, currentDate ) {
a50b2e 120         return React.createElement('td',  props, currentDate.date() );
eba92b 121     },
M 122
f0ec5a 123     renderFooter: function() {
462115 124         if ( !this.props.timeFormat )
d76f7b 125             return '';
M 126
62fd2f 127         var date = this.props.selectedDate || this.props.viewDate;
0390c2 128
a50b2e 129         return React.createElement('tfoot', { key: 'tf'},
GL 130             React.createElement('tr', {},
99929e 131                 React.createElement('td', { onClick: this.props.showView( 'time' ), colspan: 7, className: 'rdtTimeToggle' }, date.format( this.props.timeFormat ))
d76f7b 132             )
M 133         );
e7f876 134     },
9f1b61 135
f0ec5a 136     alwaysValidDate: function() {
bdad6c 137         return 1;
11612b 138     },
JM 139
cf3d92 140     handleClickOutside: function() {
SE 141         this.props.handleClickOutside();
142     }
11612b 143 }));
d76f7b 144
M 145 module.exports = DateTimePickerDays;
caf7fe 146 /* eslint-enable */