import { Component, ViewEncapsulation, Input, EventEmitter, Output, Renderer2, ContentChild } from '@angular/core';
import { trigger, style, transition, animate } from '@angular/animations';
// import { Observable } from 'rxjs/Observable';
import { RxChain } from '@angular/cdk';
import { fromEvent } from 'rxjs/observable/fromEvent';
import { throttleTime } from 'rxjs/operator/throttleTime';
import { distinctUntilChanged } from 'rxjs/operator/distinctUntilChanged';
import { NzScrollService } from "../core/scroll/nz-scroll.service";
var NzBackTopComponent = (function () {
    function NzBackTopComponent(scrollSrv, _renderer) {
        this.scrollSrv = scrollSrv;
        this._renderer = _renderer;
        this.scroll$ = null;
        this.target = null;
        this._display = false;
        this.nzVisibilityHeight = 400;
        this.nzClick = new EventEmitter();
    }
    Object.defineProperty(NzBackTopComponent.prototype, "nzTarget", {
        set: function (el) {
            this.target = el;
            this.registerScrollEvent();
        },
        enumerable: true,
        configurable: true
    });
    NzBackTopComponent.prototype.ngOnInit = function () {
        if (!this.scroll$)
            this.registerScrollEvent();
    };
    NzBackTopComponent.prototype.clickBackTop = function () {
        this.scrollSrv.scrollTo(this.getTarget(), 0);
        this.nzClick.emit(true);
    };
    NzBackTopComponent.prototype.getTarget = function () {
        return this.target || window;
    };
    NzBackTopComponent.prototype.handleScroll = function () {
        this._display = this.scrollSrv.getScroll(this.getTarget()) > this.nzVisibilityHeight;
    };
    NzBackTopComponent.prototype.removeListen = function () {
        if (this.scroll$)
            this.scroll$.unsubscribe();
    };
    NzBackTopComponent.prototype.registerScrollEvent = function () {
        var _this = this;
        this.removeListen();
        this.handleScroll();
        this.scroll$ = RxChain.from(fromEvent(this.getTarget(), 'scroll'))
            .call(throttleTime, 50)
            .call(distinctUntilChanged)
            .subscribe(function (e) {
            _this.handleScroll();
        });
    };
    NzBackTopComponent.prototype.ngOnDestroy = function () {
        this.removeListen();
    };
    return NzBackTopComponent;
}());
export { NzBackTopComponent };
NzBackTopComponent.decorators = [
    { type: Component, args: [{
                selector: 'nz-back-top',
                encapsulation: ViewEncapsulation.None,
                animations: [
                    trigger('enterLeave', [
                        transition(':enter', [
                            style({ opacity: 0 }),
                            animate(300, style({ opacity: 1 }))
                        ]),
                        transition(':leave', [
                            style({ opacity: 1 }),
                            animate(300, style({ opacity: 0 }))
                        ])
                    ])
                ],
                template: "\n  <div class=\"ant-back-top\" (click)=\"clickBackTop()\" [@enterLeave] *ngIf=\"_display\">\n    <ng-template #defaultContent>\n      <div class=\"ant-back-top-content\"><i class=\"anticon anticon-to-top ant-back-top-icon\"></i></div>\n    </ng-template>\n    <ng-template [ngTemplateOutlet]=\"nzTemplate || defaultContent\"></ng-template>\n  </div>\n  ",
                styles: [
                    "/* stylelint-disable at-rule-empty-line-before,at-rule-name-space-after,at-rule-no-unknown */\n/* stylelint-disable declaration-bang-space-before */\n/* stylelint-disable declaration-bang-space-before */\n.ant-back-top {\n  z-index: 10;\n  position: fixed;\n  right: 100px;\n  bottom: 50px;\n  height: 40px;\n  width: 40px;\n  cursor: pointer;\n}\n.ant-back-top-content {\n  height: 40px;\n  width: 40px;\n  border-radius: 20px;\n  background-color: rgba(64, 64, 64, 0.4);\n  color: #fff;\n  text-align: center;\n  transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);\n}\n.ant-back-top-content:hover {\n  background-color: rgba(64, 64, 64, 0.6);\n  transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);\n}\n.ant-back-top-icon {\n  font-size: 20px;\n  margin-top: 10px;\n}\n",
                    ""
                ]
            },] },
];
/** @nocollapse */
NzBackTopComponent.ctorParameters = function () { return [
    { type: NzScrollService, },
    { type: Renderer2, },
]; };
NzBackTopComponent.propDecorators = {
    'nzTemplate': [{ type: ContentChild, args: ['nzTemplate',] },],
    'nzVisibilityHeight': [{ type: Input },],
    'nzTarget': [{ type: Input },],
    'nzClick': [{ type: Output },],
};
