import React from 'react';
import { Modal, Button } from 'react-bootstrap';

export default class MessageDlg extends React.Component {

    constructor(props) {
        super(props);
        this.yesClick = this.yesClick.bind(this);
        this.noClick = this.noClick.bind(this);
        this.okClick = this.okClick.bind(this);
        this.cancelClick = this.cancelClick.bind(this);
    }

    createButtons() {
        switch (this.props.type) {
            case 'YesNo':
                return React.createElement(
                    'p',
                    { className: 'text-center' },
                    React.createElement(
                        Button,
                        { bsSize: 'large', bsStyle: 'primary',
                            onClick: this.yesClick },
                        __('global.yes')
                    ),
                    React.createElement(
                        Button,
                        { bsSize: 'large', bsStyle: 'default',
                            onClick: this.noClick },
                        __('global.no')
                    )
                );
            default:
                return React.createElement(
                    'p',
                    { className: 'text-center' },
                    React.createElement(
                        Button,
                        { bsSize: 'large',
                            bsStyle: 'primary',
                            onClick: this.okClick },
                        __('form.ok')
                    )
                );
        }
    }

    yesClick() {
        this.close('yes');
    }

    cancelClick() {
        this.close('cancel');
    }

    noClick() {
        this.close('no');
    }

    okClick() {
        this.close('ok');
    }

    close(evt) {
        if (this.props.onClose) {
            this.props.onClose(evt);
        }
    }

    render() {
        const buttons = this.createButtons();

        let icon = 'fa fa-4x fa-';
        let icondiv = 'circle-5x';
        switch (this.props.style) {
            case 'danger':
                icon += 'exclamation';
                icondiv += ' bg-danger text-danger';
                break;
            case 'warning':
                icon += 'exclamation-triangle';
                icondiv += ' bg-warning text-warning';
                break;
            default:
                icon += 'info';
                icondiv += ' bg-info text-info';
        }

        return React.createElement(
            Modal,
            { show: this.props.show, onHide: this.cancelClick, bsSize: this.props.size },
            React.createElement(
                Modal.Header,
                { closeButton: true },
                React.createElement(
                    Modal.Title,
                    null,
                    this.props.title
                )
            ),
            React.createElement(
                Modal.Body,
                null,
                React.createElement(
                    'div',
                    { className: 'text-center' },
                    React.createElement(
                        'div',
                        { className: icondiv },
                        React.createElement('i', { className: icon })
                    ),
                    React.createElement(
                        'div',
                        { className: 'mtop-2x' },
                        React.createElement(
                            'p',
                            { className: 'lead' },
                            this.props.message
                        )
                    )
                )
            ),
            React.createElement(
                Modal.Footer,
                null,
                buttons
            )
        );
    }
}

MessageDlg.propTypes = {
    show: React.PropTypes.bool,
    title: React.PropTypes.string,
    message: React.PropTypes.string,
    style: React.PropTypes.oneOf(['info', 'danger', 'warning']),
    type: React.PropTypes.oneOf(['YesNo', 'Ok']),
    onClose: React.PropTypes.func,
    size: React.PropTypes.string
};

MessageDlg.defaultProps = {
    show: false,
    style: 'info',
    type: 'Ok'
};