marquex
2015-06-22 c37f80e138d17fb859b7d9a0b554ebc885da809b
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
'use strict';
 
var React = require('react'),
moment = require('moment')
;
 
var DOM = React.DOM;
var DateTimePickerMonths = React.createClass({
    renderMonths: function() {
        var date = this.props.selectedDate,
            month = date.month(),
            monthsShort = date.localeData()._monthsShort,
            rows = [],
            i = 0,
            months = [],
            classes
        ;
 
        while (i < 12) {
            classes = "month";
            if( i === month && this.props.viewDate.year() === date.year() )
                classes += " active";
 
            months.push( DOM.td( {key: i, className: classes, onClick: this.props.setDate('month') }, monthsShort[ i ] ));
            if( months.length == 4 ){
                rows.push( DOM.tr({ key: month + '_' + rows.length }, months) );
                months = [];
            }
 
            i++;
        }
 
        return rows;
    },
 
    render: function() {
        return DOM.div({ className: 'rdtMonths' },[
            DOM.table({ key: 'a'}, DOM.thead({}, DOM.tr({},[
                DOM.th({ key: 'prev', className: 'prev', onClick: this.props.subtractTime(1, 'years') }, '‹'),
                DOM.th({ key: 'year', className: 'switch', onClick: this.props.showView('years'), colSpan: 5 }, this.props.viewDate.year() ),
                DOM.th({ key: 'next', className: 'next', onClick: this.props.addTime(1, 'years')}, '›' )
            ]))),
            DOM.table({ key: 'months'}, DOM.tbody({ key: 'b'}, this.renderMonths()))
        ]);
    }
});
 
module.exports = DateTimePickerMonths;