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;
};
var __metadata = (this && this.__metadata) || function (k, v) {
    if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
};
import { Guid } from './../../resources/elements/utilities/guid';
import { observable } from "aurelia-binding";
import { bindable, children, customElement } from "aurelia-templating";
import { UIInternal } from '../../utils/ui-internal';
export var UISegmentedControl = (function () {
    function UISegmentedControl(element) {
        this.element = element;
        this.isUpdatingSelector = false;
        this.name = Guid.newGuid().toString();
    }
    UISegmentedControl.prototype.bind = function () {
        this.element.onclick = function (ev) {
            ev.stopPropagation();
        };
    };
    UISegmentedControl.prototype.nameChanged = function () {
        var _this = this;
        var _a;
        (_a = this.options) === null || _a === void 0 ? void 0 : _a.forEach(function (option) { return option.name = _this.name; });
    };
    UISegmentedControl.prototype.optionsChanged = function () {
        var _this = this;
        var _a;
        this.nameChanged();
        this.initSelector();
        (_a = this.options) === null || _a === void 0 ? void 0 : _a.forEach(function (option) { return option.updateGUI = function () { return _this.translateSelector(); }; });
    };
    UISegmentedControl.prototype.initSelector = function () {
        var _a;
        if (((_a = this.options) === null || _a === void 0 ? void 0 : _a.length) > 0 && this.selector != null) {
            this.selector.style.setProperty("width", "".concat(100 / this.options.length, "%"));
            this.translateSelector();
        }
    };
    UISegmentedControl.prototype.translateSelector = function () {
        var _this = this;
        if (!this.isUpdatingSelector) {
            this.isUpdatingSelector = true;
            UIInternal.queueTask(function () {
                if (_this.selector != null) {
                    if (_this.options.find(function (x) { return x.checked == null; }) || !_this.options.find(function (x) { return x.checked == x.model; })) {
                        _this.selector.style.setProperty("display", "none");
                    }
                    else {
                        _this.selector.style.removeProperty("display");
                        _this.selector.style.transform = "translate(".concat(100 * _this.options.findIndex(function (x) { return x.checked == x.model; }), "%)");
                    }
                }
                _this.isUpdatingSelector = false;
            });
        }
    };
    __decorate([
        observable,
        children('ui-segmented-option'),
        __metadata("design:type", Array)
    ], UISegmentedControl.prototype, "options", void 0);
    __decorate([
        bindable,
        observable,
        __metadata("design:type", String)
    ], UISegmentedControl.prototype, "name", void 0);
    UISegmentedControl = __decorate([
        customElement("ui-segmented-control"),
        __metadata("design:paramtypes", [Element])
    ], UISegmentedControl);
    return UISegmentedControl;
}());

//# sourceMappingURL=ui-segmented-control.js.map
