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 __assign = (this && this.__assign) || Object.assign || function(t) {
    for (var s, i = 1, n = arguments.length; i < n; i++) {
        s = arguments[i];
        for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
            t[p] = s[p];
    }
    return t;
};
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
    return c > 3 && r && Object.defineProperty(target, key, r), r;
};
define(["require", "exports", "react", "../../Utilities", "../../Image", "./Persona.Props", "./PersonaConsts", "./Persona.scss"], function (require, exports, React, Utilities_1, Image_1, Persona_Props_1, PersonaConsts_1, Persona_scss_1) {
    "use strict";
    // The RGB color swatches
    var COLOR_SWATCHES_LOOKUP = [
        Persona_Props_1.PersonaInitialsColor.lightGreen,
        Persona_Props_1.PersonaInitialsColor.lightBlue,
        Persona_Props_1.PersonaInitialsColor.lightPink,
        Persona_Props_1.PersonaInitialsColor.green,
        Persona_Props_1.PersonaInitialsColor.darkGreen,
        Persona_Props_1.PersonaInitialsColor.pink,
        Persona_Props_1.PersonaInitialsColor.magenta,
        Persona_Props_1.PersonaInitialsColor.purple,
        Persona_Props_1.PersonaInitialsColor.black,
        Persona_Props_1.PersonaInitialsColor.teal,
        Persona_Props_1.PersonaInitialsColor.blue,
        Persona_Props_1.PersonaInitialsColor.darkBlue,
        Persona_Props_1.PersonaInitialsColor.orange,
        Persona_Props_1.PersonaInitialsColor.darkRed,
        Persona_Props_1.PersonaInitialsColor.red
    ];
    var COLOR_SWATCHES_NUM_ENTRIES = COLOR_SWATCHES_LOOKUP.length;
    var Persona = (function (_super) {
        __extends(Persona, _super);
        function Persona(props) {
            var _this = _super.call(this, props) || this;
            _this.state = {
                isImageLoaded: false,
            };
            return _this;
        }
        Persona.prototype.render = function () {
            var _a = this.props, className = _a.className, size = _a.size, imageUrl = _a.imageUrl, initialsColor = _a.initialsColor, presence = _a.presence, primaryText = _a.primaryText, secondaryText = _a.secondaryText, tertiaryText = _a.tertiaryText, optionalText = _a.optionalText, hidePersonaDetails = _a.hidePersonaDetails, imageShouldFadeIn = _a.imageShouldFadeIn, _b = _a.onRenderInitials, onRenderInitials = _b === void 0 ? this._onRenderInitials : _b, imageShouldStartVisible = _a.imageShouldStartVisible;
            initialsColor = initialsColor !== undefined && initialsColor !== null ? initialsColor : this._getColorFromName(primaryText);
            var presenceElement = null;
            if (presence !== Persona_Props_1.PersonaPresence.none) {
                var userPresence = Persona_Props_1.PersonaPresence[presence], statusIcon = null;
                switch (userPresence) {
                    case 'online':
                        userPresence = 'SkypeCheck';
                        break;
                    case 'away':
                        userPresence = 'SkypeClock';
                        break;
                    case 'dnd':
                        userPresence = 'SkypeMinus';
                        break;
                    default:
                        userPresence = '';
                }
                if (userPresence) {
                    var iconClass = Utilities_1.css("ms-Persona-presenceIcon ms-Icon ms-Icon--" + userPresence, Persona_scss_1.default.presenceIcon);
                    statusIcon = React.createElement("i", { className: iconClass });
                }
                presenceElement = React.createElement("div", { className: Utilities_1.css('ms-Persona-presence', Persona_scss_1.default.presence) }, statusIcon);
            }
            var divProps = Utilities_1.getNativeProps(this.props, Utilities_1.divProperties);
            var personaDetails = React.createElement("div", { className: Utilities_1.css('ms-Persona-details', Persona_scss_1.default.details) },
                React.createElement("div", { className: Utilities_1.css('ms-Persona-primaryText', Persona_scss_1.default.primaryText) }, primaryText),
                secondaryText ? (React.createElement("div", { className: Utilities_1.css('ms-Persona-secondaryText', Persona_scss_1.default.secondaryText) }, secondaryText)) : (null),
                React.createElement("div", { className: Utilities_1.css('ms-Persona-tertiaryText', Persona_scss_1.default.tertiaryText) }, tertiaryText),
                React.createElement("div", { className: Utilities_1.css('ms-Persona-optionalText', Persona_scss_1.default.optionalText) }, optionalText),
                this.props.children);
            return (React.createElement("div", __assign({}, divProps, { className: Utilities_1.css('ms-Persona', Persona_scss_1.default.root, className, PersonaConsts_1.PERSONA_SIZE[size], PersonaConsts_1.PERSONA_PRESENCE[presence]) }),
                size !== Persona_Props_1.PersonaSize.tiny && (React.createElement("div", { className: Utilities_1.css('ms-Persona-imageArea', Persona_scss_1.default.imageArea) },
                    !this.state.isImageLoaded &&
                        (React.createElement("div", { className: Utilities_1.css('ms-Persona-initials', Persona_scss_1.default.initials, PersonaConsts_1.PERSONA_INITIALS_COLOR[initialsColor]), "aria-hidden": 'true' }, onRenderInitials(this.props, this._onRenderInitials))),
                    React.createElement(Image_1.Image, { className: Utilities_1.css('ms-Persona-image', Persona_scss_1.default.image), imageFit: Image_1.ImageFit.cover, src: imageUrl, shouldFadeIn: imageShouldFadeIn, shouldStartVisible: imageShouldStartVisible, onLoadingStateChange: this._onPhotoLoadingStateChange }))),
                presenceElement,
                (!hidePersonaDetails || (size === Persona_Props_1.PersonaSize.tiny)) && personaDetails));
        };
        Persona.prototype._onRenderInitials = function (props) {
            var imageInitials = props.imageInitials, primaryText = props.primaryText;
            var isRTL = Utilities_1.getRTL();
            imageInitials = imageInitials || Utilities_1.getInitials(primaryText, isRTL);
            return (React.createElement("span", null, imageInitials));
        };
        Persona.prototype._getColorFromName = function (displayName) {
            var color = Persona_Props_1.PersonaInitialsColor.blue;
            if (!displayName) {
                return color;
            }
            var hashCode = 0;
            for (var iLen = displayName.length - 1; iLen >= 0; iLen--) {
                var ch = displayName.charCodeAt(iLen);
                var shift = iLen % 8;
                // tslint:disable-next-line:no-bitwise
                hashCode ^= (ch << shift) + (ch >> (8 - shift));
            }
            color = COLOR_SWATCHES_LOOKUP[hashCode % COLOR_SWATCHES_NUM_ENTRIES];
            return color;
        };
        Persona.prototype._onPhotoLoadingStateChange = function (loadState) {
            this.setState({
                isImageLoaded: loadState === Image_1.ImageLoadState.loaded
            });
        };
        return Persona;
    }(React.Component));
    Persona.defaultProps = {
        primaryText: '',
        size: Persona_Props_1.PersonaSize.regular,
        presence: Persona_Props_1.PersonaPresence.none
    };
    __decorate([
        Utilities_1.autobind
    ], Persona.prototype, "_onRenderInitials", null);
    __decorate([
        Utilities_1.autobind
    ], Persona.prototype, "_onPhotoLoadingStateChange", null);
    exports.Persona = Persona;
});

//# sourceMappingURL=Persona.js.map
