view | history | commit | commitdiff
marquex
2015-07-06 eba92bd9c24111756afb06f05b8478130a3beef0
commit | author | age
d76f7b 1 'use strict';
M 2
3 var React = require('react'),
4 moment = require('moment')
5 ;
6
7 var DOM = React.DOM;
8 var DateTimePickerMonths = React.createClass({
eba92b 9     render: function() {
M 10         return DOM.div({ className: 'rdtMonths' },[
11             DOM.table({ key: 'a'}, DOM.thead({}, DOM.tr({},[
12                 DOM.th({ key: 'prev', className: 'prev' }, DOM.button({onClick: this.props.subtractTime(1, 'years')}, '‹')),
13                 DOM.th({ key: 'year', className: 'switch', onClick: this.props.showView('years'), colSpan: 2 }, this.props.viewDate.year() ),
14                 DOM.th({ key: 'next', className: 'next' }, DOM.button({onClick: this.props.addTime(1, 'years')}, '›'))
15             ]))),
16             DOM.table({ key: 'months'}, DOM.tbody({ key: 'b'}, this.renderMonths()))
17         ]);
18     },
19
d76f7b 20     renderMonths: function() {
c37f80 21         var date = this.props.selectedDate,
M 22             month = date.month(),
eba92b 23             year = this.props.viewDate.year(),
d76f7b 24             rows = [],
M 25             i = 0,
26             months = [],
eba92b 27             renderer = this.props.renderMonth || this.renderMonth,
M 28             classes, props
d76f7b 29         ;
M 30
31         while (i < 12) {
32             classes = "month";
eba92b 33             if( i === month && year === date.year() )
d76f7b 34                 classes += " active";
M 35
eba92b 36             props = {
M 37                 key: i,
38                 'data-value': i,
39                 className: classes,
40                 onClick: this.props.setDate('month')
41             };
42
43             months.push( renderer( props, i, year, date.clone() ));
44
d76f7b 45             if( months.length == 4 ){
18dc17 46                 rows.push( DOM.tr({ key: month + '_' + rows.length }, months) );
d76f7b 47                 months = [];
M 48             }
49
50             i++;
51         }
52
53         return rows;
54     },
55
eba92b 56     renderMonth: function( props, month, year, selectedDate ) {
M 57         return DOM.td( props, selectedDate.localeData()._monthsShort[ month ] );
d76f7b 58     }
M 59 });
60
61 module.exports = DateTimePickerMonths;