import _extends from 'babel-runtime/helpers/extends';
import _defineProperty from 'babel-runtime/helpers/defineProperty';
import _objectWithoutProperties from 'babel-runtime/helpers/objectWithoutProperties';
var _jsxFileName = 'src/progress/CircularProgress.jsx';
import React from 'react';
import PropTypes from 'prop-types';
import classNames from 'classnames';

var VIEW_BOX_SIZE = 100;
CircularProgress.propTypes = {
    prefixCls: PropTypes.string,
    className: PropTypes.string,
    /** 当前值 */
    value: PropTypes.number,
    /** 最大值 */
    max: PropTypes.number,
    /** 最小值 */
    min: PropTypes.number,
    /** 进度信息 function(percent) => node */
    infoFormat: PropTypes.func,
    /** 是否显示进度信息 */
    showInfo: PropTypes.bool,
    /** 宽度 */
    strokeWidth: PropTypes.number,
    /** 半径 */
    radius: PropTypes.number,
    /** 缺口位置 */
    gapPosition: PropTypes.oneOf(['top', 'bottom', 'left', 'right']),
    /** 缺口大小（单位：角度） */
    gapDegree: PropTypes.number,
    /** 显示阴影 */
    showShadow: PropTypes.bool,
    /** 进度条元素属性 */
    pathProps: PropTypes.object,
    /** 进度条颜色 */
    pathColor: PropTypes.string
};

CircularProgress.defaultProps = {
    prefixCls: 'ne-circular-progress',
    value: 0,
    infoFormat: function infoFormat(percent) {
        return percent + '%';
    },
    showInfo: true,
    strokeWidth: 6,
    max: 100,
    min: 0,
    size: 100,
    gapDegree: 0,
    gapPosition: 'top',
    showShadow: true,
    pathColor: '',
    pathProps: {}
};

var posMap = {
    top: -90,
    right: 0,
    bottom: 90,
    left: 180
};

/**
 * CircularProgress
 */
export default function CircularProgress(props) {
    var infoFormat = props.infoFormat,
        className = props.className,
        value = props.value,
        max = props.max,
        min = props.min,
        prefixCls = props.prefixCls,
        showInfo = props.showInfo,
        strokeWidth = props.strokeWidth,
        size = props.size,
        style = props.style,
        gapDegree = props.gapDegree,
        gapPosition = props.gapPosition,
        showShadow = props.showShadow,
        pathProps = props.pathProps,
        pathColor = props.pathColor,
        other = _objectWithoutProperties(props, ['infoFormat', 'className', 'value', 'max', 'min', 'prefixCls', 'showInfo', 'strokeWidth', 'size', 'style', 'gapDegree', 'gapPosition', 'showShadow', 'pathProps', 'pathColor']);

    var classes = classNames(prefixCls, _defineProperty({}, prefixCls + '-success', value === max), className);
    var radius = (VIEW_BOX_SIZE - strokeWidth - 8) / 2;
    var trailLength = 2 * Math.PI * radius * (360 - gapDegree) / 360;
    var trailStyle = {
        strokeDasharray: Math.round(trailLength * 1000) / 1000,
        transform: 'rotateZ(' + (posMap[gapPosition] + gapDegree / 2) + 'deg)'
    };
    var pathStyle = _extends({
        strokeDashoffset: Math.round((max - value) / (max - min) * trailLength * 1000) / 1000 + 'px'
    }, trailStyle, pathProps.style || {});
    if (pathColor) {
        pathStyle.stroke = pathColor;
    }
    return React.createElement(
        'div',
        Object.assign({
            className: classes,
            style: _extends({ width: size, height: size }, style),
            role: 'progressbar',
            'aria-valuenow': value,
            'aria-valuemin': min,
            'aria-valuemax': max
        }, other, {
            __source: {
                fileName: _jsxFileName,
                lineNumber: 103
            },
            __self: this
        }),
        React.createElement(
            'svg',
            { viewBox: '0 0 ' + VIEW_BOX_SIZE + ' ' + VIEW_BOX_SIZE, __source: {
                    fileName: _jsxFileName,
                    lineNumber: 111
                },
                __self: this
            },
            React.createElement('circle', {
                style: trailStyle,
                className: prefixCls + '-trail',
                cx: VIEW_BOX_SIZE / 2,
                cy: VIEW_BOX_SIZE / 2,
                r: radius,
                fill: 'none',
                strokeWidth: strokeWidth,
                __source: {
                    fileName: _jsxFileName,
                    lineNumber: 112
                },
                __self: this
            }),
            showShadow ? React.createElement(
                'filter',
                { id: 'dropshadow', height: '150%', __source: {
                        fileName: _jsxFileName,
                        lineNumber: 122
                    },
                    __self: this
                },
                React.createElement('feGaussianBlur', { 'in': 'SourceAlpha', stdDeviation: '2', __source: {
                        fileName: _jsxFileName,
                        lineNumber: 123
                    },
                    __self: this
                }),
                React.createElement('feOffset', { dx: '-1', dy: '1', result: 'offsetblur', __source: {
                        fileName: _jsxFileName,
                        lineNumber: 124
                    },
                    __self: this
                }),
                React.createElement(
                    'feComponentTransfer',
                    {
                        __source: {
                            fileName: _jsxFileName,
                            lineNumber: 125
                        },
                        __self: this
                    },
                    React.createElement('feFuncA', { type: 'linear', slope: '0.2', __source: {
                            fileName: _jsxFileName,
                            lineNumber: 126
                        },
                        __self: this
                    })
                ),
                React.createElement(
                    'feMerge',
                    {
                        __source: {
                            fileName: _jsxFileName,
                            lineNumber: 128
                        },
                        __self: this
                    },
                    React.createElement('feMergeNode', {
                        __source: {
                            fileName: _jsxFileName,
                            lineNumber: 129
                        },
                        __self: this
                    }),
                    React.createElement('feMergeNode', { 'in': 'SourceGraphic', __source: {
                            fileName: _jsxFileName,
                            lineNumber: 130
                        },
                        __self: this
                    })
                )
            ) : null,
            React.createElement('circle', Object.assign({
                style: pathStyle,
                className: prefixCls + '-path',
                cx: VIEW_BOX_SIZE / 2,
                cy: VIEW_BOX_SIZE / 2,
                r: radius,
                fill: 'none',
                strokeWidth: strokeWidth,
                filter: showShadow ? 'url(#dropshadow)' : undefined
            }, pathProps, {
                __source: {
                    fileName: _jsxFileName,
                    lineNumber: 134
                },
                __self: this
            }))
        ),
        showInfo ? React.createElement(
            'div',
            { className: prefixCls + '-info', __source: {
                    fileName: _jsxFileName,
                    lineNumber: 146
                },
                __self: this
            },
            infoFormat(value)
        ) : null
    );
}