'use strict';

Object.defineProperty(exports, "__esModule", {
    value: true
});

var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();

var _react = require('react');

var _react2 = _interopRequireDefault(_react);

var _utils = require('../../../common/utils');

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }

function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }

function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }

var ROW = 4;
var COL = 3;

function goYear(direction) {
    var value = this.state.value.clone();
    value.add(direction, 'year');
    this.setState({ value: value });
}

function chooseYear(year) {
    var _props = this.props,
        shadowValue = _props.shadowValue,
        onShadowValueChange = _props.onShadowValueChange,
        onChangeMode = _props.onChangeMode;

    var newValue = shadowValue.clone().year(year);
    // value.month(this.state.value.month())
    onShadowValueChange(newValue);
    onChangeMode('day');
}

var YearPanel = function (_Component) {
    _inherits(YearPanel, _Component);

    function YearPanel(props) {
        _classCallCheck(this, YearPanel);

        var _this = _possibleConstructorReturn(this, (YearPanel.__proto__ || Object.getPrototypeOf(YearPanel)).call(this, props));

        _this.prefixCls = props.rootPrefixCls + '-year-panel';
        _this.state = {
            value: props.shadowValue
        };
        _this.nextDecade = goYear.bind(_this, 10);
        _this.previousDecade = goYear.bind(_this, -10);
        // this.showDecadePanel = this.showDecadePanel.bind(this)
        _this.onDecadePanelSelect = _this.onDecadePanelSelect.bind(_this);
        return _this;
    }

    _createClass(YearPanel, [{
        key: 'onDecadePanelSelect',
        value: function onDecadePanelSelect(current) {
            this.setState({ value: current });
        }
    }, {
        key: 'getElements',
        value: function getElements(years) {
            var _this2 = this;

            var _props2 = this.props,
                onChangeToPreviousDecade = _props2.onChangeToPreviousDecade,
                onChangeToNextDecade = _props2.onChangeToNextDecade,
                startYear = _props2.startYear,
                endYear = _props2.endYear;

            return years.map(function (row, index) {
                var tds = row.map(function (yearData) {
                    var styles = getStyles();
                    var clickHandler = void 0;
                    if (yearData.year < startYear) {
                        clickHandler = onChangeToPreviousDecade;
                    } else if (yearData.year > endYear) {
                        clickHandler = onChangeToNextDecade;
                    } else {
                        clickHandler = chooseYear.bind(_this2, yearData.year);
                    }

                    return _react2.default.createElement(
                        'td',
                        {
                            role: "gridcell",
                            title: yearData.title,
                            key: yearData.content,
                            onClick: clickHandler
                        },
                        _react2.default.createElement(
                            'a',
                            { className: _this2.prefixCls + '-year' },
                            ' ',
                            yearData.content,
                            ' '
                        ),
                        ' '
                    );
                });
                return _react2.default.createElement(
                    'tr',
                    { key: index, role: 'row' },
                    tds
                );
            });
        }
    }, {
        key: 'render',
        value: function render() {
            var shadowValue = this.props.shadowValue;

            var yearsContent = years(shadowValue);
            var prefixCls = this.prefixCls;

            var yearEls = this.getElements(yearsContent);
            return _react2.default.createElement(
                'div',
                { className: prefixCls + '-body' },
                _react2.default.createElement(
                    'table',
                    { className: prefixCls + '-table', cellSpacing: '0', role: 'grid' },
                    _react2.default.createElement(
                        'tbody',
                        { className: prefixCls + '-tbody' },
                        yearEls
                    )
                )
            );
            //   return (
            //     <div className={this.prefixCls}>
            //       <div>
            //
            //         <div className={`${prefixCls}-body`}>
            //           <table className={`${prefixCls}-table`} cellSpacing="0" role="grid">
            //             <tbody className={`${prefixCls}-tbody`}>
            //             {yeasEls}
            //             </tbody>
            //           </table>
            //         </div>
            //       </div>
            //       {decadePanel}
            //     </div>);
        }
    }]);

    return YearPanel;
}(_react.Component);

function getStyles(value) {
    return {};
    // const classNameMap = {
    //   [`${prefixCls}-cell`]: 1,
    //   [`${prefixCls}-selected-cell`]: yearData.year === currentYear,
    //   [`${prefixCls}-last-decade-cell`]: yearData.year < startYear,
    //   [`${prefixCls}-next-decade-cell`]: yearData.year > endYear,
    // };
}

function years(value) {
    var currentYear = value.year();
    var startYear = parseInt(currentYear / 10, 10) * 10;
    var previousYear = startYear - 1;
    var years = [];
    var index = 0;
    (0, _utils.range)(ROW).forEach(function (rowIndex) {
        years[rowIndex] = [];
        (0, _utils.range)(COL).forEach(function (colIndex) {
            var index = rowIndex * COL + colIndex;
            var year = previousYear + index;
            var content = String(year);
            years[rowIndex][colIndex] = {
                content: content,
                year: year,
                title: content
            };
        });
    });
    return years;
}

/// OLD
// class YearPanel extends React.Component {
//   constructor(props) {
//     super(props);
//     this.prefixCls = `${props.rootPrefixCls}-year-panel`;
//     this.state = {
//       value: props.value || props.defaultValue,
//     };
//     this.nextDecade = goYear.bind(this, 10);
//     this.previousDecade = goYear.bind(this, -10);
//     ['showDecadePanel', 'onDecadePanelSelect'].forEach(method => {
//       this[method] = this[method].bind(this);
//     });
//   }
//
//   onDecadePanelSelect(current) {
//     this.setState({
//       value: current,
//       showDecadePanel: 0,
//     });
//   }
//
//   years() {
//     const value = this.state.value;
//     const currentYear = value.year();
//     const startYear = parseInt(currentYear / 10, 10) * 10;
//     const previousYear = startYear - 1;
//     const years = [];
//     let index = 0;
//     for (let rowIndex = 0; rowIndex < ROW; rowIndex++) {
//       years[rowIndex] = [];
//       for (let colIndex = 0; colIndex < COL; colIndex++) {
//         const year = previousYear + index;
//         const content = String(year);
//         years[rowIndex][colIndex] = {
//           content,
//           year,
//           title: content,
//         };
//         index++;
//       }
//     }
//     return years;
//   }
//
//   showDecadePanel() {
//     this.setState({
//       showDecadePanel: 1,
//     });
//   }
//
//   render() {
//     const props = this.props;
//     const value = this.state.value;
//     const locale = props.locale;
//     const years = this.years();
//     const currentYear = value.year();
//     const startYear = parseInt(currentYear / 10, 10) * 10;
//     const endYear = startYear + 9;
//     const prefixCls = this.prefixCls;
//
//     const yeasEls = years.map((row, index) => {
//       const tds = row.map(yearData => {
//         const classNameMap = {
//           [`${prefixCls}-cell`]: 1,
//           [`${prefixCls}-selected-cell`]: yearData.year === currentYear,
//           [`${prefixCls}-last-decade-cell`]: yearData.year < startYear,
//           [`${prefixCls}-next-decade-cell`]: yearData.year > endYear,
//         };
//         let clickHandler;
//         if (yearData.year < startYear) {
//           clickHandler = this.previousDecade;
//         } else if (yearData.year > endYear) {
//           clickHandler = this.nextDecade;
//         } else {
//           clickHandler = chooseYear.bind(this, yearData.year);
//         }
//         return (
//           <td
//             role="gridcell"
//             title={yearData.title}
//             key={yearData.content}
//             onClick={clickHandler}
//             className={classnames(classNameMap)}
//           >
//             <a
//               className={`${prefixCls}-year`}
//             >
//               {yearData.content}
//             </a>
//           </td>);
//       });
//       return (<tr key={index} role="row">{tds}</tr>);
//     });
//
//     let decadePanel;
//     if (this.state.showDecadePanel) {
//       decadePanel = (<DecadePanel
//         locale={locale}
//         value={value}
//         rootPrefixCls={props.rootPrefixCls}
//         onSelect={this.onDecadePanelSelect}
//       />);
//     }
//
//     return (
//       <div className={this.prefixCls}>
//         <div>
//           <div className={`${prefixCls}-header`}>
//             <a
//               className={`${prefixCls}-prev-decade-btn`}
//               role="button"
//               onClick={this.previousDecade}
//               title={locale.previousDecade}
//             />
//             <a
//               className={`${prefixCls}-decade-select`}
//               role="button"
//               onClick={this.showDecadePanel}
//               title={locale.decadeSelect}
//             >
//               <span className={`${prefixCls}-decade-select-content`}>
//                 {startYear}-{endYear}
//               </span>
//               <span className={`${prefixCls}-decade-select-arrow`}>x</span>
//             </a>
//
//             <a
//               className={`${prefixCls}-next-decade-btn`}
//               role="button"
//               onClick={this.nextDecade}
//               title={locale.nextDecade}
//             />
//           </div>
//           <div className={`${prefixCls}-body`}>
//             <table className={`${prefixCls}-table`} cellSpacing="0" role="grid">
//               <tbody className={`${prefixCls}-tbody`}>
//               {yeasEls}
//               </tbody>
//             </table>
//           </div>
//         </div>
//         {decadePanel}
//       </div>);
//   }
// }
//
exports.default = YearPanel;


YearPanel.propTypes = {
    rootPrefixCls: _react.PropTypes.string,
    value: _react.PropTypes.object,
    defaultValue: _react.PropTypes.object
};

YearPanel.defaultProps = {
    onSelect: function onSelect() {}
};
//# sourceMappingURL=Body.js.map