"use strict";
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);
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.UITooltip = void 0;
var aurelia_i18n_1 = require("aurelia-i18n");
var aurelia_framework_1 = require("aurelia-framework");
var ui_tether_1 = require("../utils/ui-tether");
var ui_internal_1 = require("../utils/ui-internal");
var TooltipEl;
var seed = 0;
var UITooltip = exports.UITooltip = (function () {
    function UITooltip(element, i18n) {
        var _this = this;
        this.element = element;
        this.i18n = i18n;
        this.classes = "";
        this.theme = "";
        this.position = "bottom";
        this.delay = 100;
        this.useClick = false;
        this.id = "tooltip-".concat(seed++);
        this.shown = false;
        this.disposables = [];
        this.showFn = function () { return _this.show(); };
        this.hideFn = function () { return _this.hide(); };
        this.toggleFn = function () {
            if (_this.shown) {
                _this.hideTooltip();
            }
            else {
                _this.show();
                _this.shown = true;
                _this.disposables.push(ui_internal_1.UIInternal.subscribe(ui_internal_1.UIInternal.EVT_VIEWPORT_CLICK, function (t) { return _this.close(t); }), ui_internal_1.UIInternal.subscribe(ui_internal_1.UIInternal.EVT_VIEWPORT_WHEEL, function (t) { return _this.close(t); }), ui_internal_1.UIInternal.subscribe(ui_internal_1.UIInternal.EVT_VIEWPORT_RESIZE, function () { return _this.show(); }));
            }
        };
    }
    UITooltip.prototype.attached = function () {
        if (this.element.nodeType === Node.ELEMENT_NODE) {
            this.parentEl = this.element;
        }
        if (this.element.nodeType === Node.COMMENT_NODE) {
            this.parentEl = this.element.previousElementSibling;
        }
        if (!TooltipEl) {
            TooltipEl = document.createElement("div");
            TooltipEl.className = "ui-tooltip";
            TooltipEl.tether = ui_tether_1.UITether.tether(this.parentEl, TooltipEl, {
                anchorPosition: "tc",
                attachToViewport: true,
                position: "bc",
                resize: false
            });
        }
        if (this.useClick) {
            this.parentEl.addEventListener("click", this.toggleFn);
        }
        else {
            this.parentEl.addEventListener("mouseenter", this.showFn);
            this.parentEl.addEventListener("mouseleave", this.hideFn);
        }
    };
    UITooltip.prototype.detached = function () {
        this.hide();
        if (this.useClick) {
            this.parentEl.removeEventListener("click", this.toggleFn);
            this.disposeListeners();
        }
        else {
            this.parentEl.removeEventListener("mouseenter", this.showFn);
            this.parentEl.removeEventListener("mouseleave", this.hideFn);
        }
    };
    UITooltip.prototype.show = function () {
        var _a;
        if (isEmpty(this.value) && isEmpty(this.label)) {
            return;
        }
        TooltipEl.className = "ui-tooltip ui-theme--".concat(this.theme, " ").concat(this.classes);
        TooltipEl.innerHTML = (_a = this.value) !== null && _a !== void 0 ? _a : this.i18n.tr(this.label);
        TooltipEl.dataset.id = this.id;
        TooltipEl.dataset.pos = this.position;
        var anchorPosition = "tc";
        var position = "bc";
        switch (this.position) {
            case "right":
                anchorPosition = "cr";
                position = "cl";
                break;
            case "left":
                anchorPosition = "cl";
                position = "cr";
                break;
            case "bottom":
                anchorPosition = "bc";
                position = "tc";
                break;
        }
        TooltipEl.tether.updatePosition(this.parentEl, { position: position, anchorPosition: anchorPosition });
        this.timer = setTimeout(function () { return (TooltipEl.dataset.open = "true"); }, this.delay);
    };
    UITooltip.prototype.hide = function () {
        clearTimeout(this.timer);
        TooltipEl.dataset.open = "false";
    };
    UITooltip.prototype.valueChanged = function () {
        if (TooltipEl && TooltipEl.dataset.open === "true" && TooltipEl.dataset.id === this.id) {
            this.show();
        }
    };
    UITooltip.prototype.close = function (t) {
        if (this.shown && t != this.parentEl) {
            this.hideTooltip();
        }
    };
    UITooltip.prototype.hideTooltip = function () {
        this.hide();
        this.shown = false;
        this.disposeListeners();
    };
    UITooltip.prototype.disposeListeners = function () {
        this.disposables.forEach(function (d) { return d.dispose(); });
    };
    __decorate([
        (0, aurelia_framework_1.bindable)({ primaryProperty: true }),
        __metadata("design:type", Object)
    ], UITooltip.prototype, "value", void 0);
    __decorate([
        (0, aurelia_framework_1.bindable)(),
        __metadata("design:type", Object)
    ], UITooltip.prototype, "label", void 0);
    __decorate([
        (0, aurelia_framework_1.bindable)(),
        __metadata("design:type", Object)
    ], UITooltip.prototype, "classes", void 0);
    __decorate([
        (0, aurelia_framework_1.bindable)(),
        __metadata("design:type", Object)
    ], UITooltip.prototype, "theme", void 0);
    __decorate([
        (0, aurelia_framework_1.bindable)(),
        __metadata("design:type", String)
    ], UITooltip.prototype, "position", void 0);
    __decorate([
        (0, aurelia_framework_1.bindable)(),
        __metadata("design:type", Object)
    ], UITooltip.prototype, "delay", void 0);
    __decorate([
        (0, aurelia_framework_1.bindable)(),
        __metadata("design:type", Boolean)
    ], UITooltip.prototype, "useClick", void 0);
    UITooltip = __decorate([
        (0, aurelia_framework_1.autoinject)(),
        (0, aurelia_framework_1.customAttribute)("ui-tooltip"),
        __metadata("design:paramtypes", [Element, aurelia_i18n_1.I18N])
    ], UITooltip);
    return UITooltip;
}());

//# sourceMappingURL=ui-tooltip.js.map
