import * as tslib_1 from "tslib";
import { Input, Component, ViewEncapsulation, ChangeDetectionStrategy, ElementRef, Output, EventEmitter, ChangeDetectorRef, Renderer2 } from '@angular/core';
import { OnChange } from '../core/decorators';
import { OverlayPositionService } from './overlay-position.service';
var OverlayComponent = /** @class */ (function () {
    function OverlayComponent(el, cdRef, render, overlayPositionService) {
        this.el = el;
        this.cdRef = cdRef;
        this.render = render;
        this.overlayPositionService = overlayPositionService;
        /** the event of opening the overlay */
        this.openHandler = new EventEmitter();
        /** the event of closing the overlay */
        this.closeHandler = new EventEmitter();
        /** A selector specifying the element the popover should be appended to. */
        /** Currently only supports "body".*/
        this.container = 'body';
        /** overlay element's original position such as 'bottom-top' */
        this.placement = 'bottom-left';
        /** the delay of changing visibility */
        this.delay = 0;
        /** overlay state about visibility */
        this.visibility = false;
    }
    OverlayComponent.prototype.ngOnInit = function () {
        var _this = this;
        // when click on other area, hide the overlay
        this._documentClickListener = this.render.listen('document', 'click', function () {
            if (_this.visibility) {
                _this.visibility = false;
                _this.closeHandler.emit(_this);
                _this.cdRef.markForCheck();
            }
        });
    };
    OverlayComponent.prototype.ngOnDestroy = function () {
        var nativeElement = this.el.nativeElement;
        if (nativeElement && nativeElement.parentNode) {
            nativeElement.parentNode.removeChild(nativeElement);
        }
        // remove document click listener
        if (this._documentClickListener) {
            this._documentClickListener();
            this._documentClickListener = null;
        }
    };
    OverlayComponent.prototype.ngAfterViewInit = function () {
        if (this.container === 'body') {
            window.document.querySelector(this.container).appendChild(this.el.nativeElement);
        }
        if (this.origin) {
            this._positionStategy = this.overlayPositionService
                .attachTo(this.origin.el, this, this.placement);
        }
        // 调用show方法和组件渲染完成在不同场景下的执行顺序不同，所以两处都需要重新定位。
        // 此处定位一是因为渲染完成能够获得真实宽高，此时定位更为准确。
        // 二是因为当show方法执行早于此方法时，show方法中并没有定位。比如Tooltip的hover场景。
        if (this._positionStategy) {
            this.overlayPositionService.updatePosition(this._positionStategy);
        }
    };
    /**
     * show or hide
     */
    OverlayComponent.prototype.toggle = function () {
        this.visibility ? this.hide() : this.show();
    };
    /**
     * position the overlay element and show it
     */
    OverlayComponent.prototype.show = function () {
        var _this = this;
        if (this.hideTimeoutId) {
            clearTimeout(this.hideTimeoutId);
        }
        this.showTimeoutId = window.setTimeout(function () {
            // 调用show方法和组件渲染完成在不同场景下的执行顺序不同，所以两处都需要重新定位。
            // 此处定位是因为渲染完成后计算的位置可能并不准确，比如overlay渲染完成早于overlay上方的DOM或组件渲染完成。
            if (_this._positionStategy) {
                _this.overlayPositionService.updatePosition(_this._positionStategy);
            }
            _this.visibility = true;
            _this.openHandler.emit(_this);
            _this.cdRef.markForCheck();
        }, this.delay);
    };
    /**
     * hide the overlay element
     */
    OverlayComponent.prototype.hide = function () {
        var _this = this;
        if (this.showTimeoutId) {
            clearTimeout(this.showTimeoutId);
        }
        this.hideTimeoutId = window.setTimeout(function () {
            _this.visibility = false;
            _this.closeHandler.emit(_this);
            _this.cdRef.markForCheck();
        }, this.delay);
    };
    /**
     * check the visibility of the overlay
     * @param { boolean } this.visibility
     */
    OverlayComponent.prototype.isVisible = function () {
        return this.visibility;
    };
    /**
     * prevent default when click the overlay itself
     * @param { MouseEvent } event
     */
    OverlayComponent.prototype._preventDefault = function (event) {
        event.stopPropagation();
    };
    /**
     * 变更提示框的内容，e.g slider的提示
     * @param { string } content
     */
    OverlayComponent.prototype.changeOrigin = function (origin) {
        if (this.origin !== origin) {
            this._positionStategy = this.overlayPositionService
                .attachTo(origin.el, this, this.placement);
        }
        this.origin = origin;
    };
    tslib_1.__decorate([
        Output(),
        tslib_1.__metadata("design:type", EventEmitter)
    ], OverlayComponent.prototype, "openHandler", void 0);
    tslib_1.__decorate([
        Output(),
        tslib_1.__metadata("design:type", EventEmitter)
    ], OverlayComponent.prototype, "closeHandler", void 0);
    tslib_1.__decorate([
        Input(),
        tslib_1.__metadata("design:type", Object)
    ], OverlayComponent.prototype, "origin", void 0);
    tslib_1.__decorate([
        Input(),
        tslib_1.__metadata("design:type", String)
    ], OverlayComponent.prototype, "container", void 0);
    tslib_1.__decorate([
        Input(),
        tslib_1.__metadata("design:type", String)
    ], OverlayComponent.prototype, "placement", void 0);
    tslib_1.__decorate([
        Input(),
        tslib_1.__metadata("design:type", Number)
    ], OverlayComponent.prototype, "delay", void 0);
    tslib_1.__decorate([
        OnChange(true),
        Input(),
        tslib_1.__metadata("design:type", Boolean)
    ], OverlayComponent.prototype, "visibility", void 0);
    OverlayComponent = tslib_1.__decorate([
        Component({
            selector: 'nb-overlay',
            template: "<ng-content></ng-content>",
            encapsulation: ViewEncapsulation.None,
            changeDetection: ChangeDetectionStrategy.OnPush,
            providers: [OverlayPositionService],
            preserveWhitespaces: false,
            host: {
                'class': 'nb-widget nb-overlay',
                '[class.invisible]': '!visibility',
                '(click)': '_preventDefault($event)'
            },
            exportAs: 'nbOverlay'
        }),
        tslib_1.__metadata("design:paramtypes", [ElementRef,
            ChangeDetectorRef,
            Renderer2,
            OverlayPositionService])
    ], OverlayComponent);
    return OverlayComponent;
}());
export { OverlayComponent };
//# sourceMappingURL=overlay.js.map