commit | author | age
|
caf7fe
|
1 |
/* eslint-disable */ |
d76f7b
|
2 |
'use strict'; |
M |
3 |
|
11612b
|
4 |
var React = require('react'), |
cf3d92
|
5 |
createClass = require('create-react-class'), |
39b827
|
6 |
onClickOutside = require('react-onclickoutside').default |
cf3d92
|
7 |
; |
d76f7b
|
8 |
|
84755c
|
9 |
var DateTimePickerYears = onClickOutside( createClass({ |
d76f7b
|
10 |
render: function() { |
bdad6c
|
11 |
var year = parseInt( this.props.viewDate.year() / 10, 10 ) * 10; |
d76f7b
|
12 |
|
a50b2e
|
13 |
return React.createElement('div', { className: 'rdtYears' }, [ |
GL |
14 |
React.createElement('table', { key: 'a' }, React.createElement('thead', {}, React.createElement('tr', {}, [ |
|
15 |
React.createElement('th', { key: 'prev', className: 'rdtPrev', onClick: this.props.subtractTime( 10, 'years' )}, React.createElement('span', {}, '‹' )), |
99929e
|
16 |
React.createElement('th', { key: 'year', className: 'rdtSwitch', onClick: this.props.showView( 'years' ), colspan: 2 }, year + '-' + ( year + 9 ) ), |
a50b2e
|
17 |
React.createElement('th', { key: 'next', className: 'rdtNext', onClick: this.props.addTime( 10, 'years' )}, React.createElement('span', {}, '›' )) |
cf3d92
|
18 |
]))), |
a50b2e
|
19 |
React.createElement('table', { key: 'years' }, React.createElement('tbody', {}, this.renderYears( year ))) |
d76f7b
|
20 |
]); |
eba92b
|
21 |
}, |
M |
22 |
|
|
23 |
renderYears: function( year ) { |
|
24 |
var years = [], |
|
25 |
i = -1, |
|
26 |
rows = [], |
|
27 |
renderer = this.props.renderYear || this.renderYear, |
62fd2f
|
28 |
selectedDate = this.props.selectedDate, |
bdad6c
|
29 |
isValid = this.props.isValidDate || this.alwaysValidDate, |
f0ec5a
|
30 |
classes, props, currentYear, isDisabled, noOfDaysInYear, daysInYear, validDay, |
bdad6c
|
31 |
// Month and date are irrelevant here because |
SE |
32 |
// we're only interested in the year |
|
33 |
irrelevantMonth = 0, |
f0ec5a
|
34 |
irrelevantDate = 1 |
cf3d92
|
35 |
; |
f0ec5a
|
36 |
|
SE |
37 |
year--; |
eba92b
|
38 |
while (i < 11) { |
e4010d
|
39 |
classes = 'rdtYear'; |
b8112d
|
40 |
currentYear = this.props.viewDate.clone().set( |
f0ec5a
|
41 |
{ year: year, month: irrelevantMonth, date: irrelevantDate } ); |
e9db5f
|
42 |
|
SE |
43 |
// Not sure what 'rdtOld' is for, commenting out for now as it's not working properly |
|
44 |
// if ( i === -1 | i === 10 ) |
|
45 |
// classes += ' rdtOld'; |
c306f2
|
46 |
|
bdad6c
|
47 |
noOfDaysInYear = currentYear.endOf( 'year' ).format( 'DDD' ); |
SE |
48 |
daysInYear = Array.from({ length: noOfDaysInYear }, function( e, i ) { |
|
49 |
return i + 1; |
|
50 |
}); |
|
51 |
|
|
52 |
validDay = daysInYear.find(function( d ) { |
|
53 |
var day = currentYear.clone().dayOfYear( d ); |
|
54 |
return isValid( day ); |
|
55 |
}); |
|
56 |
|
|
57 |
isDisabled = ( validDay === undefined ); |
|
58 |
|
|
59 |
if ( isDisabled ) |
c306f2
|
60 |
classes += ' rdtDisabled'; |
R |
61 |
|
462115
|
62 |
if ( selectedDate && selectedDate.year() === year ) |
e4010d
|
63 |
classes += ' rdtActive'; |
eba92b
|
64 |
|
M |
65 |
props = { |
|
66 |
key: year, |
|
67 |
'data-value': year, |
c306f2
|
68 |
className: classes |
eba92b
|
69 |
}; |
c306f2
|
70 |
|
bdad6c
|
71 |
if ( !isDisabled ) |
f0ec5a
|
72 |
props.onClick = ( this.props.updateOn === 'years' ? |
SE |
73 |
this.updateSelectedYear : this.props.setDate('year') ); |
eba92b
|
74 |
|
62fd2f
|
75 |
years.push( renderer( props, year, selectedDate && selectedDate.clone() )); |
eba92b
|
76 |
|
f0ec5a
|
77 |
if ( years.length === 4 ) { |
a50b2e
|
78 |
rows.push( React.createElement('tr', { key: i }, years ) ); |
eba92b
|
79 |
years = []; |
M |
80 |
} |
|
81 |
|
|
82 |
year++; |
|
83 |
i++; |
|
84 |
} |
|
85 |
|
|
86 |
return rows; |
|
87 |
}, |
|
88 |
|
f99908
|
89 |
updateSelectedYear: function( event ) { |
11612b
|
90 |
this.props.updateSelectedDate( event ); |
f99908
|
91 |
}, |
SA |
92 |
|
bdad6c
|
93 |
renderYear: function( props, year ) { |
a50b2e
|
94 |
return React.createElement('td', props, year ); |
c306f2
|
95 |
}, |
R |
96 |
|
bdad6c
|
97 |
alwaysValidDate: function() { |
c306f2
|
98 |
return 1; |
11612b
|
99 |
}, |
JM |
100 |
|
cf3d92
|
101 |
handleClickOutside: function() { |
SE |
102 |
this.props.handleClickOutside(); |
|
103 |
} |
11612b
|
104 |
})); |
d76f7b
|
105 |
|
M |
106 |
module.exports = DateTimePickerYears; |
caf7fe
|
107 |
/* eslint-enable */ |