ng-marquee-improved/fesm2015/ng-marquee-improved.js

Angular 7/8 CSS-based Scrolling Marquee

import { Component, ChangeDetectionStrategy, Input, NgModule } from '@angular/core';

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
class NgMarqueeComponent {
    constructor() { }
    /**
     * @return {?}
     */
    updateDuration() {
        if (!this.duration) {
            return;
        }
        this.animationElem.style.animationDuration = `${this.duration}s`;
    }
    /**
     * @return {?}
     */
    ngOnInit() { }
    /**
     * @return {?}
     */
    ngAfterViewInit() {
        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 = () => [];
NgMarqueeComponent.propDecorators = {
    duration: [{ type: Input }],
    marqueeId: [{ type: Input }]
};

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
class NgMarqueeModule {
}
NgMarqueeModule.decorators = [
    { type: NgModule, args: [{
                imports: [],
                declarations: [NgMarqueeComponent],
                exports: [NgMarqueeComponent]
            },] }
];

export { NgMarqueeComponent, NgMarqueeModule };
//# sourceMappingURL=ng-marquee-improved.js.map