office-ui-fabric-react
Version:
Reusable React components for building experiences for Office 365.
53 lines (51 loc) • 2.37 kB
JavaScript
;
var __extends = (this && this.__extends) || function (d, b) {
for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p];
function __() { this.constructor = d; }
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
};
var React = require('react');
var Spinner_Props_1 = require('./Spinner.Props');
var rtl_1 = require('../../utilities/rtl');
var css_1 = require('../../utilities/css');
require('./Spinner.scss');
var CIRCLE_COUNT = 8;
var PARENT_SIZE_LARGE = 28;
var PARENT_SIZE_NORMAL = 20;
var OFFSET_SIZE_LARGE = 0.179;
var OFFSET_SIZE_NORMAL = 0.2;
var Spinner = (function (_super) {
__extends(Spinner, _super);
function Spinner() {
_super.apply(this, arguments);
}
Spinner.prototype.render = function () {
var _a = this.props, type = _a.type, label = _a.label, className = _a.className;
var isRTL = rtl_1.getRTL();
var parentSize = type === Spinner_Props_1.SpinnerType.large ? PARENT_SIZE_LARGE : PARENT_SIZE_NORMAL;
var offsetSize = type === Spinner_Props_1.SpinnerType.large ? OFFSET_SIZE_LARGE : OFFSET_SIZE_NORMAL;
var offset = parentSize * offsetSize;
var step = (2 * Math.PI) / CIRCLE_COUNT;
var angle = 0;
var i = CIRCLE_COUNT;
var radius = (parentSize - offset) * 0.5;
var circleObjects = [];
while (i--) {
var x = Math.round(parentSize * 0.5 + radius * Math.cos(angle)) - offset * 0.5;
var y = Math.round(parentSize * 0.5 + radius * Math.sin(angle)) - offset * 0.5;
var size = offset + 'px';
var style = { left: !isRTL ? x : 'auto', right: !isRTL ? 'auto' : x, top: y, width: size, height: size };
angle += step;
circleObjects.push(React.createElement("div", {className: 'ms-Spinner-circle', key: i, style: style}));
}
return (React.createElement("div", {className: css_1.css('ms-Spinner', className, {
'ms-Spinner--large': type === Spinner_Props_1.SpinnerType.large
})}, label && (React.createElement("div", {className: 'ms-Spinner-label', role: 'alert'}, label)), circleObjects));
};
Spinner.defaultProps = {
type: Spinner_Props_1.SpinnerType.normal
};
return Spinner;
}(React.Component));
exports.Spinner = Spinner;
//# sourceMappingURL=Spinner.js.map