'use strict';

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

var _extends2 = require('babel-runtime/helpers/extends');

var _extends3 = _interopRequireDefault(_extends2);

var _objectDestructuringEmpty2 = require('babel-runtime/helpers/objectDestructuringEmpty');

var _objectDestructuringEmpty3 = _interopRequireDefault(_objectDestructuringEmpty2);

var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');

var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);

var _createClass2 = require('babel-runtime/helpers/createClass');

var _createClass3 = _interopRequireDefault(_createClass2);

var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn');

var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2);

var _inherits2 = require('babel-runtime/helpers/inherits');

var _inherits3 = _interopRequireDefault(_inherits2);

var _react = require('react');

var _react2 = _interopRequireDefault(_react);

var _reactDraggable = require('react-draggable');

var _reactDraggable2 = _interopRequireDefault(_reactDraggable);

var _classnames = require('classnames');

var _classnames2 = _interopRequireDefault(_classnames);

var _antd = require('antd');

var _LocaleReceiver = require('antd/es/locale-provider/LocaleReceiver');

var _LocaleReceiver2 = _interopRequireDefault(_LocaleReceiver);

var _configProvider = require('../config-provider');

var _default = require('../locale/default');

var _default2 = _interopRequireDefault(_default);

var _icon = require('../icon');

var _icon2 = _interopRequireDefault(_icon);

require('@whalecloud/fdx-theme-fdx/Imageviewer.less');

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

// 加法
var accAdd = function accAdd(arg1, arg2) {
    var r1 = void 0;
    var r2 = void 0;
    var newArg1 = void 0;
    var newArg2 = void 0;
    try {
        r1 = arg1.toString().split(".")[1].length;
    } catch (e) {
        r1 = 0;
    }
    try {
        r2 = arg2.toString().split(".")[1].length;
    } catch (e) {
        r2 = 0;
    }
    var c = Math.abs(r1 - r2);
    var m = Math.pow(10, Math.max(r1, r2));
    if (c > 0) {
        var cm = Math.pow(10, c);
        if (r1 > r2) {
            newArg1 = Number(arg1.toString().replace(".", ""));
            newArg2 = Number(arg2.toString().replace(".", "")) * cm;
        } else {
            newArg1 = Number(arg1.toString().replace(".", "")) * cm;
            newArg2 = Number(arg2.toString().replace(".", ""));
        }
    } else {
        newArg1 = Number(arg1.toString().replace(".", ""));
        newArg2 = Number(arg2.toString().replace(".", ""));
    }
    return (newArg1 + newArg2) / m;
};
// 减法
var accSub = function accSub(arg1, arg2) {
    var r1 = void 0;
    var r2 = void 0;
    try {
        r1 = arg1.toString().split(".")[1].length;
    } catch (e) {
        r1 = 0;
    }
    try {
        r2 = arg2.toString().split(".")[1].length;
    } catch (e) {
        r2 = 0;
    }
    var m = Math.pow(10, Math.max(r1, r2));
    // 动态控制精度长度
    var n = r1 >= r2 ? r1 : r2;
    return ((arg1 * m - arg2 * m) / m).toFixed(n);
};

var Imageviewer = function (_React$Component) {
    (0, _inherits3['default'])(Imageviewer, _React$Component);

    function Imageviewer(props) {
        (0, _classCallCheck3['default'])(this, Imageviewer);

        var _this = (0, _possibleConstructorReturn3['default'])(this, (Imageviewer.__proto__ || Object.getPrototypeOf(Imageviewer)).call(this, props));

        _this.prev = function () {
            var _this$props$data = _this.props.data,
                data = _this$props$data === undefined ? [] : _this$props$data;
            var index = _this.state.index;

            if (index === 0 && data.length > 0) {
                return false;
            }
            if (index > 0 && data.length > 0) {
                _this.setState({
                    index: index - 1
                });
            }
            _this.backPosition();
        };
        _this.next = function () {
            var _this$props$data2 = _this.props.data,
                data = _this$props$data2 === undefined ? [] : _this$props$data2;
            var index = _this.state.index;

            if (index === data.length - 1 && data.length > 0) {
                return false;
            }
            if (index < data.length - 1 && data.length > 0) {
                _this.setState({
                    index: index + 1
                });
            }
            _this.backPosition();
        };
        _this.backPosition = function () {
            setTimeout(function () {
                _this.setState({ scale: 1 });
                _this.setState({ defaultPosition: { x: 0, y: 0 } });
            }, 500);
        };
        // 缩小
        _this.onToOut = function () {
            var scale = _this.state.scale;

            if (scale > 0.2) {
                _this.setState({ scale: accSub(scale, 0.2) });
            } else {
                _antd.message.warning("已缩小到最小级别");
            }
        };
        // 放大
        _this.onToIn = function () {
            var scale = _this.state.scale;

            if (scale < 3) {
                _this.setState({ scale: accAdd(scale, 0.2) });
            } else {
                _antd.message.warning("已放大到最大级别");
            }
        };
        _this.handleStart = function () {
            _this.setState({ defaultPosition: null });
        };
        _this.handleClose = function () {
            var _this$props$onClose = _this.props.onClose,
                onClose = _this$props$onClose === undefined ? function () {} : _this$props$onClose;

            _this.setState({
                scale: 1
            });
            onClose();
        };
        _this.state = {
            scale: 1,
            defaultPosition: null,
            index: 0
        };
        return _this;
    }

    (0, _createClass3['default'])(Imageviewer, [{
        key: 'componentWillReceiveProps',
        value: function componentWillReceiveProps(nextProps) {
            this.setState({
                index: nextProps.index
            });
        }
    }, {
        key: 'render',
        value: function render() {
            var _this2 = this;

            var _props = this.props,
                _props$data = _props.data,
                data = _props$data === undefined ? [] : _props$data,
                shadeStyle = _props.shadeStyle,
                imageStyle = _props.imageStyle,
                visible = _props.visible;
            var _state = this.state,
                scale = _state.scale,
                defaultPosition = _state.defaultPosition,
                index = _state.index;

            return _react2['default'].createElement(
                _configProvider.ConfigConsumer,
                null,
                function (_ref) {
                    (0, _objectDestructuringEmpty3['default'])(_ref);

                    return _react2['default'].createElement(
                        _LocaleReceiver2['default'],
                        { componentName: 'ImageViewer', defaultLocale: _default2['default'].ImageViewer },
                        function (locale) {
                            return _react2['default'].createElement(
                                'div',
                                { className: 'imageviewer', style: { display: '' + (visible ? "block" : "none") } },
                                _react2['default'].createElement(
                                    'div',
                                    { className: 'shadeWrapper', style: (0, _extends3['default'])({}, shadeStyle) },
                                    _react2['default'].createElement(
                                        'div',
                                        { className: 'inner' },
                                        _react2['default'].createElement(
                                            _reactDraggable2['default'],
                                            { defaultPosition: { x: 0, y: 0 }, position: defaultPosition, scale: 1, onStart: _this2.handleStart },
                                            _react2['default'].createElement(
                                                'span',
                                                null,
                                                _react2['default'].createElement(
                                                    'div',
                                                    { className: (0, _classnames2['default'])({ "imageWrapper": true, "hide": false }), style: { transform: 'scale(' + scale + ')' } },
                                                    _react2['default'].createElement('img', { className: "image", id: 'TargetImage', src: data[index], alt: data[index], style: (0, _extends3['default'])({ width: "100%" }, imageStyle) })
                                                )
                                            )
                                        )
                                    ),
                                    _react2['default'].createElement(
                                        _antd.Row,
                                        { type: 'flex', className: 'operateTool' },
                                        _react2['default'].createElement(
                                            _antd.Tooltip,
                                            { title: locale.previousOne },
                                            _react2['default'].createElement(
                                                'div',
                                                { onClick: _this2.prev },
                                                _react2['default'].createElement(_icon2['default'], { type: 'arrow-left' })
                                            )
                                        ),
                                        _react2['default'].createElement(
                                            _antd.Tooltip,
                                            { title: locale.nextOne },
                                            _react2['default'].createElement(
                                                'div',
                                                { onClick: _this2.next },
                                                _react2['default'].createElement(_icon2['default'], { type: 'arrow-right' })
                                            )
                                        ),
                                        _react2['default'].createElement(
                                            _antd.Tooltip,
                                            { title: locale.zoomIn },
                                            _react2['default'].createElement(
                                                'div',
                                                { onClick: _this2.onToIn },
                                                _react2['default'].createElement(_icon2['default'], { type: 'plus' })
                                            )
                                        ),
                                        _react2['default'].createElement(
                                            _antd.Tooltip,
                                            { title: locale.zoomOut },
                                            _react2['default'].createElement(
                                                'div',
                                                { onClick: _this2.onToOut },
                                                _react2['default'].createElement(_icon2['default'], { type: 'minus' })
                                            )
                                        )
                                    ),
                                    _react2['default'].createElement(
                                        'div',
                                        { className: 'closeBtnWrapper', onClick: _this2.handleClose },
                                        _react2['default'].createElement(_icon2['default'], { type: 'close', style: { fontSize: "24px" } })
                                    )
                                )
                            );
                        }
                    );
                }
            );
        }
    }]);
    return Imageviewer;
}(_react2['default'].Component);

Imageviewer.defaultProps = {
    data: [],
    onClose: function onClose() {},
    shadeStyle: {},
    imageStyle: {},
    wrapperStyle: {},
    innerStyle: {},
    scale: 1,
    visible: false
};
;
exports['default'] = Imageviewer;
module.exports = exports['default'];