var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };

import React from 'react';
import { Grid, Row, Col } from 'react-bootstrap';
import PopupControl from './popup-control';
import Fa from './fa';

import './year-picker.less';

/**
 * React component for selecting an year
 */
export default class YearPicker extends React.Component {

    constructor(props) {
        super(props);

        this.prevClick = this.prevClick.bind(this);
        this.nextClick = this.nextClick.bind(this);
        this.selectYear = this.selectYear.bind(this);
        this.state = { page: 0 };
    }

    componentWillReceiveProps(newProps) {
        if (newProps.value !== this.props.value) {
            this.setState({ page: 0 });
        }
    }

    prevClick(evt) {
        this.setState({ page: this.state.page - 1 });
        evt.preventDefault();
    }

    nextClick(evt) {
        this.setState({ page: this.state.page + 1 });
        evt.preventDefault();
    }

    selectYear(year) {
        return () => {
            if (this.props.onChange) {
                this.props.onChange(year);
            }
        };
    }

    renderPopup() {
        // get the year
        const props = this.props;
        let year = props.value ? props.value : new Date().getFullYear();

        year = Math.floor(year / 20) * 20;
        year -= this.state.page * 20;

        const addRow = y => React.createElement(
            Col,
            { xs: 3, className: 'year' + (y === props.value ? ' active' : ''),
                onClick: this.selectYear(y) },
            y
        );

        const lst = [];
        for (var i = 0; i < 5; i++) {
            lst.push(React.createElement(
                Row,
                { key: i + 1 },
                addRow(year++),
                addRow(year++),
                addRow(year++),
                addRow(year++)
            ));
        }

        return React.createElement(
            'div',
            { className: 'year-picker' },
            React.createElement(
                Grid,
                { fluid: true },
                React.createElement(
                    Row,
                    null,
                    React.createElement(
                        Col,
                        { xs: 12 },
                        React.createElement(
                            'a',
                            { className: 'pull-right btn-naveg', onClick: this.prevClick },
                            React.createElement(Fa, { icon: 'chevron-right' })
                        ),
                        React.createElement(
                            'a',
                            { onClick: this.nextClick, className: 'btn-naveg' },
                            React.createElement(Fa, { icon: 'chevron-left' })
                        )
                    )
                ),
                lst
            )
        );
    }

    render() {
        if (this.props.noPopup) {
            return this.renderPopup();
        }

        const props = Object.assign({}, this.props);

        const content = props.value ? props.value : React.createElement(
            'span',
            { className: 'text-muted' },
            __('datetime.year')
        );

        delete props.value;
        delete props.onChange;

        return React.createElement(PopupControl, _extends({}, props, {
            content: content,
            autoHide: false,
            popupContent: this.renderPopup() }));
    }
}

YearPicker.propTypes = {
    value: React.PropTypes.number,
    onChange: React.PropTypes.func,
    noPopup: React.PropTypes.bool,

    // to be used by popupControl
    label: React.PropTypes.node,
    bsStyle: React.PropTypes.oneOf(['success', 'warning', 'error']),
    help: React.PropTypes.string,
    wrapperClassName: React.PropTypes.string
};