'use strict';

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

var _react = require('react');

var _react2 = _interopRequireDefault(_react);

var _classnames = require('classnames');

var _classnames2 = _interopRequireDefault(_classnames);

var _CircularProgress = require('./CircularProgress.scss');

var _CircularProgress2 = _interopRequireDefault(_CircularProgress);

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

function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }

var RADIUS = 20;
var DIAMETER = 50;
var CENTER_POSITION = 25;
var SIZE = {
	small: 'small',
	default: 'default',
	large: 'large'
};
var CIRCUMFERENCE = Math.PI * (RADIUS * 2);

function getCircleStyle(percent) {
	if (percent) {
		return {
			strokeDasharray: CIRCUMFERENCE,
			strokeDashoffset: (100 - percent) / 100 * CIRCUMFERENCE
		};
	}
	return {
		strokeDasharray: CIRCUMFERENCE / 10,
		strokeDashoffset: 0
	};
}

/**
 * @param {object} props react props
 * @example
 <CircularProgress size="large" />
 */
function CircularProgress(_ref) {
	var _classNames;

	var size = _ref.size,
	    light = _ref.light,
	    percent = _ref.percent;

	var classes = (0, _classnames2.default)(_CircularProgress2.default.loader, (_classNames = {}, _defineProperty(_classNames, _CircularProgress2.default.loaderlight, light), _defineProperty(_classNames, _CircularProgress2.default.animate, !percent), _defineProperty(_classNames, _CircularProgress2.default.fixed, percent), _defineProperty(_classNames, _CircularProgress2.default.small, size === SIZE.small), _defineProperty(_classNames, _CircularProgress2.default.default, size === SIZE.default), _defineProperty(_classNames, _CircularProgress2.default.large, size === SIZE.large), _classNames));

	return _react2.default.createElement(
		'svg',
		{
			focusable: 'false',
			className: classes,
			viewBox: '0 0 ' + DIAMETER + ' ' + DIAMETER
		},
		_react2.default.createElement('circle', {
			className: _CircularProgress2.default.path,
			r: RADIUS,
			cx: CENTER_POSITION,
			cy: CENTER_POSITION,
			fill: 'none',
			style: getCircleStyle(percent)
		})
	);
}

CircularProgress.propTypes = {
	size: _react.PropTypes.oneOf([SIZE.small, SIZE.default, SIZE.large]),
	light: _react.PropTypes.bool,
	percent: _react.PropTypes.number
};

CircularProgress.defaultProps = {
	size: SIZE.default
};

exports.default = CircularProgress;