ng-marquee-improved/esm5/lib/ng-marquee/ng-marquee.component.js

Angular 7/8 CSS-based Scrolling Marquee

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
import { Component, ChangeDetectionStrategy, Input } from "@angular/core";
var NgMarqueeComponent = /** @class */ (function () {
    function NgMarqueeComponent() {
    }
    /**
     * @return {?}
     */
    NgMarqueeComponent.prototype.updateDuration = /**
     * @return {?}
     */
    function () {
        if (!this.duration) {
            return;
        }
        this.animationElem.style.animationDuration = this.duration + "s";
    };
    /**
     * @return {?}
     */
    NgMarqueeComponent.prototype.ngOnInit = /**
     * @return {?}
     */
    function () { };
    /**
     * @return {?}
     */
    NgMarqueeComponent.prototype.ngAfterViewInit = /**
     * @return {?}
     */
    function () {
        this.animationElem = (/** @type {?} */ (document.querySelector(".ng-marquee-wrapper#" + this.marqueeId + " > div")));
        this.updateDuration();
    };
    NgMarqueeComponent.decorators = [
        { type: Component, args: [{
                    selector: "ng-marquee",
                    template: "<div class=\"ng-marquee-wrapper\" id=\"{{ marqueeId }}\">\n  <div>\n    <ng-content></ng-content>\n  </div>\n</div>\n",
                    changeDetection: ChangeDetectionStrategy.OnPush,
                    styles: [".ng-marquee-wrapper{overflow:hidden;position:relative}.ng-marquee-wrapper>div{height:100%;display:inline-block;margin:0;padding-left:100%;-webkit-animation:20s linear infinite marqueeAnimation;animation:20s linear infinite marqueeAnimation;white-space:nowrap}.ng-marquee-wrapper:hover>div{-webkit-animation-play-state:paused;animation-play-state:paused}@-webkit-keyframes marqueeAnimation{0%{-webkit-transform:translateX(0);transform:translateX(0)}100%{-webkit-transform:translateX(-100%);transform:translateX(-100%)}}@keyframes marqueeAnimation{0%{-webkit-transform:translateX(0);transform:translateX(0)}100%{-webkit-transform:translateX(-100%);transform:translateX(-100%)}}@media (max-width:500px){.ng-marquee-wrapper>div{width:100%;height:100%;margin:0;-webkit-transform:translateX(100%);transform:translateX(100%);-webkit-animation:9s linear 1s infinite marqueeAnimation;animation:9s linear 1s infinite marqueeAnimation;white-space:nowrap}}"]
                }] }
    ];
    /** @nocollapse */
    NgMarqueeComponent.ctorParameters = function () { return []; };
    NgMarqueeComponent.propDecorators = {
        duration: [{ type: Input }],
        marqueeId: [{ type: Input }]
    };
    return NgMarqueeComponent;
}());
export { NgMarqueeComponent };
if (false) {
    /** @type {?} */
    NgMarqueeComponent.prototype.duration;
    /** @type {?} */
    NgMarqueeComponent.prototype.marqueeId;
    /** @type {?} */
    NgMarqueeComponent.prototype.animationElem;
}
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibmctbWFycXVlZS5jb21wb25lbnQuanMiLCJzb3VyY2VSb290Ijoibmc6Ly9uZy1tYXJxdWVlLWltcHJvdmVkLyIsInNvdXJjZXMiOlsibGliL25nLW1hcnF1ZWUvbmctbWFycXVlZS5jb21wb25lbnQudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7OztBQUFBLE9BQU8sRUFDTCxTQUFTLEVBRVQsdUJBQXVCLEVBQ3ZCLEtBQUssRUFFTixNQUFNLGVBQWUsQ0FBQztBQUV2QjtJQVdFO0lBQWUsQ0FBQzs7OztJQUVoQiwyQ0FBYzs7O0lBQWQ7UUFDRSxJQUFJLENBQUMsSUFBSSxDQUFDLFFBQVEsRUFBRTtZQUNsQixPQUFPO1NBQ1I7UUFDRCxJQUFJLENBQUMsYUFBYSxDQUFDLEtBQUssQ0FBQyxpQkFBaUIsR0FBTSxJQUFJLENBQUMsUUFBUSxNQUFHLENBQUM7SUFDbkUsQ0FBQzs7OztJQUVELHFDQUFROzs7SUFBUixjQUFZLENBQUM7Ozs7SUFDYiw0Q0FBZTs7O0lBQWY7UUFDRSxJQUFJLENBQUMsYUFBYSxHQUFHLG1CQUFBLFFBQVEsQ0FBQyxhQUFhLENBQ3pDLHlCQUF1QixJQUFJLENBQUMsU0FBUyxXQUFRLENBQzlDLEVBQWtCLENBQUM7UUFDcEIsSUFBSSxDQUFDLGNBQWMsRUFBRSxDQUFDO0lBQ3hCLENBQUM7O2dCQTFCRixTQUFTLFNBQUM7b0JBQ1QsUUFBUSxFQUFFLFlBQVk7b0JBQ3RCLGlJQUEwQztvQkFFMUMsZUFBZSxFQUFFLHVCQUF1QixDQUFDLE1BQU07O2lCQUNoRDs7Ozs7MkJBRUUsS0FBSzs0QkFDTCxLQUFLOztJQW1CUix5QkFBQztDQUFBLEFBM0JELElBMkJDO1NBckJZLGtCQUFrQjs7O0lBQzdCLHNDQUFtQzs7SUFDbkMsdUNBQTJCOztJQUMzQiwyQ0FBOEIiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQge1xuICBDb21wb25lbnQsXG4gIE9uSW5pdCxcbiAgQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3ksXG4gIElucHV0LFxuICBBZnRlclZpZXdJbml0XG59IGZyb20gXCJAYW5ndWxhci9jb3JlXCI7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogXCJuZy1tYXJxdWVlXCIsXG4gIHRlbXBsYXRlVXJsOiBcIi4vbmctbWFycXVlZS5jb21wb25lbnQuaHRtbFwiLFxuICBzdHlsZVVybHM6IFtcIi4vbmctbWFycXVlZS5jb21wb25lbnQuY3NzXCJdLFxuICBjaGFuZ2VEZXRlY3Rpb246IENoYW5nZURldGVjdGlvblN0cmF0ZWd5Lk9uUHVzaFxufSlcbmV4cG9ydCBjbGFzcyBOZ01hcnF1ZWVDb21wb25lbnQgaW1wbGVtZW50cyBPbkluaXQge1xuICBASW5wdXQoKSBkdXJhdGlvbjogc3RyaW5nIHwgbnVtYmVyO1xuICBASW5wdXQoKSBtYXJxdWVlSWQ6IHN0cmluZztcbiAgYW5pbWF0aW9uRWxlbTogSFRNTERpdkVsZW1lbnQ7XG5cbiAgY29uc3RydWN0b3IoKSB7fVxuXG4gIHVwZGF0ZUR1cmF0aW9uKCkge1xuICAgIGlmICghdGhpcy5kdXJhdGlvbikge1xuICAgICAgcmV0dXJuO1xuICAgIH1cbiAgICB0aGlzLmFuaW1hdGlvbkVsZW0uc3R5bGUuYW5pbWF0aW9uRHVyYXRpb24gPSBgJHt0aGlzLmR1cmF0aW9ufXNgO1xuICB9XG5cbiAgbmdPbkluaXQoKSB7fVxuICBuZ0FmdGVyVmlld0luaXQoKSB7XG4gICAgdGhpcy5hbmltYXRpb25FbGVtID0gZG9jdW1lbnQucXVlcnlTZWxlY3RvcihcbiAgICAgIGAubmctbWFycXVlZS13cmFwcGVyIyR7dGhpcy5tYXJxdWVlSWR9ID4gZGl2YFxuICAgICkgYXMgSFRNTERpdkVsZW1lbnQ7XG4gICAgdGhpcy51cGRhdGVEdXJhdGlvbigpO1xuICB9XG59XG4iXX0=