ng-marquee/esm2015/lib/ng-marquee/ng-marquee.component.js

Angular 8+ CSS Marquee (Alternative To HTML Marquee Tag)

/**
 * @fileoverview added by tsickle
 * Generated from: lib/ng-marquee/ng-marquee.component.ts
 * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
import { Component, ChangeDetectionStrategy, Input } from '@angular/core';
/** @enum {string} */
const MarqueeDirection = {
    left: "left",
    right: "right",
    alternate: "alternate",
};
/** @enum {string} */
const MarqueeSpeed = {
    drowsy: "drowsy",
    slow: "slow",
    normal: "normal",
    fast: "fast",
    swift: "swift",
    hyper: "hyper",
};
export class NgMarqueeComponent {
    constructor() {
        this.stopOnHover = false;
        this.marqueeDirection = MarqueeDirection;
        this.marqueeSpeed = MarqueeSpeed;
    }
    /**
     * @return {?}
     */
    ngOnInit() {
    }
}
NgMarqueeComponent.decorators = [
    { type: Component, args: [{
                selector: 'ng-marquee',
                template: "<div class=\"ng-marquee\" [ngClass]=\"{\n  'ng-marquee-direction-left': marqueeDirection.left === direction,\n  'ng-marquee-direction-right': marqueeDirection.right === direction,\n  'ng-marquee-direction-alternate': marqueeDirection.alternate === direction,\n  'ng-marquee-speed-drowsy': marqueeSpeed.drowsy === speed,\n  'ng-marquee-speed-slow': marqueeSpeed.slow === speed,\n  'ng-marquee-speed-normal': marqueeSpeed.normal === speed,\n  'ng-marquee-speed-fast': marqueeSpeed.fast === speed,\n  'ng-marquee-speed-swift': marqueeSpeed.swift === speed,\n  'ng-marquee-speed-hyper': marqueeSpeed.hyper === speed,\n  'ng-marquee-stop-on-hover': stopOnHover\n}\">\n  <span [ngStyle]=\"{'animation-duration': duration}\">\n    <ng-content></ng-content>\n  </span>\n</div>",
                changeDetection: ChangeDetectionStrategy.OnPush,
                styles: [".ng-marquee{overflow:hidden;text-align:left}.ng-marquee.ng-marquee-speed-drowsy>span{-webkit-animation-duration:30s;animation-duration:30s}.ng-marquee.ng-marquee-speed-slow>span{-webkit-animation-duration:20s;animation-duration:20s}.ng-marquee.ng-marquee-speed-normal>span{-webkit-animation-duration:10s;animation-duration:10s}.ng-marquee.ng-marquee-speed-fast>span{-webkit-animation-duration:7s;animation-duration:7s}.ng-marquee.ng-marquee-speed-swift>span{-webkit-animation-duration:5s;animation-duration:5s}.ng-marquee.ng-marquee-speed-hyper>span{-webkit-animation-duration:2s;animation-duration:2s}.ng-marquee.ng-marquee-stop-on-hover:hover>span{-webkit-animation-play-state:paused;animation-play-state:paused}@-webkit-keyframes movement-smooth{from{transform:translateX(0);left:100%}to{transform:translateX(-100%);left:0}}@keyframes movement-smooth{from{transform:translateX(0);left:100%}to{transform:translateX(-100%);left:0}}@-webkit-keyframes movement-steps20{0%{transform:translateX(0);left:100%}5%,9.99%{transform:translateX(-5%);left:95%}10%,14.99%{transform:translateX(-10%);left:90%}15%,19.99%{transform:translateX(-15%);left:85%}20%,24.99%{transform:translateX(-20%);left:80%}25%,29.99%{transform:translateX(-25%);left:75%}30%,34.99%{transform:translateX(-30%);left:70%}35%,39.99%{transform:translateX(-35%);left:65%}40%,44.99%{transform:translateX(-40%);left:60%}45%,49.99%{transform:translateX(-45%);left:55%}50%,54.99%{transform:translateX(-50%);left:50%}55%,59.99%{transform:translateX(-55%);left:45%}60%,64.99%{transform:translateX(-60%);left:40%}65%,69.99%{transform:translateX(-65%);left:35%}70%,74.99%{transform:translateX(-70%);left:30%}75%,79.99%{transform:translateX(-75%);left:25%}80%,84.99%{transform:translateX(-80%);left:20%}85%,89.99%{transform:translateX(-85%);left:15%}90%,94.99%{transform:translateX(-90%);left:10%}95%,99.99%{transform:translateX(-95%);left:5%}100%{transform:translateX(-100%);left:0}}@keyframes movement-steps20{0%{transform:translateX(0);left:100%}5%,9.99%{transform:translateX(-5%);left:95%}10%,14.99%{transform:translateX(-10%);left:90%}15%,19.99%{transform:translateX(-15%);left:85%}20%,24.99%{transform:translateX(-20%);left:80%}25%,29.99%{transform:translateX(-25%);left:75%}30%,34.99%{transform:translateX(-30%);left:70%}35%,39.99%{transform:translateX(-35%);left:65%}40%,44.99%{transform:translateX(-40%);left:60%}45%,49.99%{transform:translateX(-45%);left:55%}50%,54.99%{transform:translateX(-50%);left:50%}55%,59.99%{transform:translateX(-55%);left:45%}60%,64.99%{transform:translateX(-60%);left:40%}65%,69.99%{transform:translateX(-65%);left:35%}70%,74.99%{transform:translateX(-70%);left:30%}75%,79.99%{transform:translateX(-75%);left:25%}80%,84.99%{transform:translateX(-80%);left:20%}85%,89.99%{transform:translateX(-85%);left:15%}90%,94.99%{transform:translateX(-90%);left:10%}95%,99.99%{transform:translateX(-95%);left:5%}100%{transform:translateX(-100%);left:0}}@-webkit-keyframes movement-steps10{0%{transform:translateX(0);left:100%}10%,19.99%{transform:translateX(-10%);left:90%}20%,29.99%{transform:translateX(-20%);left:80%}30%,39.99%{transform:translateX(-30%);left:70%}40%,49.99%{transform:translateX(-40%);left:60%}50%,59.99%{transform:translateX(-50%);left:50%}60%,69.99%{transform:translateX(-60%);left:40%}70%,79.99%{transform:translateX(-70%);left:30%}80%,89.99%{transform:translateX(-80%);left:20%}90%,99.99%{transform:translateX(-90%);left:10%}100%{transform:translateX(-100%);left:0}}@keyframes movement-steps10{0%{transform:translateX(0);left:100%}10%,19.99%{transform:translateX(-10%);left:90%}20%,29.99%{transform:translateX(-20%);left:80%}30%,39.99%{transform:translateX(-30%);left:70%}40%,49.99%{transform:translateX(-40%);left:60%}50%,59.99%{transform:translateX(-50%);left:50%}60%,69.99%{transform:translateX(-60%);left:40%}70%,79.99%{transform:translateX(-70%);left:30%}80%,89.99%{transform:translateX(-80%);left:20%}90%,99.99%{transform:translateX(-90%);left:10%}100%{transform:translateX(-100%);left:0}}@-webkit-keyframes movement-steps5{0%,19.99%{transform:translateX(0);left:100%}20%,39.99%{transform:translateX(-20%);left:80%}40%,59.99%{transform:translateX(-40%);left:60%}60%,79.99%{transform:translateX(-60%);left:40%}80%,99.99%{transform:translateX(-80%);left:20%}100%{transform:translateX(-100%);left:0}}@keyframes movement-steps5{0%,19.99%{transform:translateX(0);left:100%}20%,39.99%{transform:translateX(-20%);left:80%}40%,59.99%{transform:translateX(-40%);left:60%}60%,79.99%{transform:translateX(-60%);left:40%}80%,99.99%{transform:translateX(-80%);left:20%}100%{transform:translateX(-100%);left:0}}.ng-marquee.ng-marquee-movement-smooth>span{-webkit-animation-name:movement-smooth;animation-name:movement-smooth}.ng-marquee.ng-marquee-movement-steps20>span{-webkit-animation-name:movement-steps20;animation-name:movement-steps20}.ng-marquee.ng-marquee-movement-steps10>span{-webkit-animation-name:movement-steps10;animation-name:movement-steps10}.ng-marquee.ng-marquee-movement-steps5>span{-webkit-animation-name:movement-steps5;animation-name:movement-steps5}.ng-marquee.ng-marquee-direction-left>span,.ng-marquee.ng-marquee-direction-normal>span{-webkit-animation-direction:normal;animation-direction:normal}.ng-marquee.ng-marquee-direction-alternate>span{-webkit-animation-direction:alternate;animation-direction:alternate}.ng-marquee.ng-marquee-direction-reverse>span,.ng-marquee.ng-marquee-direction-right>span{animation-direction:reverse}.ng-marquee>span{content:attr(data-marquee);white-space:nowrap;position:relative;transform:translateX(-50%);display:inline-block;left:50%;-webkit-animation:10s linear infinite movement-smooth;animation:10s linear infinite movement-smooth}"]
            }] }
];
NgMarqueeComponent.propDecorators = {
    speed: [{ type: Input }],
    duration: [{ type: Input }],
    direction: [{ type: Input }],
    stopOnHover: [{ type: Input }]
};
if (false) {
    /** @type {?} */
    NgMarqueeComponent.prototype.speed;
    /** @type {?} */
    NgMarqueeComponent.prototype.duration;
    /** @type {?} */
    NgMarqueeComponent.prototype.direction;
    /** @type {?} */
    NgMarqueeComponent.prototype.stopOnHover;
    /** @type {?} */
    NgMarqueeComponent.prototype.marqueeDirection;
    /** @type {?} */
    NgMarqueeComponent.prototype.marqueeSpeed;
}
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibmctbWFycXVlZS5jb21wb25lbnQuanMiLCJzb3VyY2VSb290Ijoibmc6Ly9uZy1tYXJxdWVlLyIsInNvdXJjZXMiOlsibGliL25nLW1hcnF1ZWUvbmctbWFycXVlZS5jb21wb25lbnQudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7Ozs7QUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFVLHVCQUF1QixFQUFFLEtBQUssRUFBRSxNQUFNLGVBQWUsQ0FBQzs7QUFFbEYsTUFBSyxnQkFBZ0I7SUFDbkIsSUFBSSxRQUFTO0lBQ2IsS0FBSyxTQUFVO0lBQ2YsU0FBUyxhQUFjO0VBQ3hCOztBQUVELE1BQUssWUFBWTtJQUNmLE1BQU0sVUFBVztJQUNqQixJQUFJLFFBQVM7SUFDYixNQUFNLFVBQVc7SUFDakIsSUFBSSxRQUFTO0lBQ2IsS0FBSyxTQUFVO0lBQ2YsS0FBSyxTQUFVO0VBQ2hCO0FBUUQsTUFBTSxPQUFPLGtCQUFrQjtJQU4vQjtRQVdXLGdCQUFXLEdBQUcsS0FBSyxDQUFDO1FBRTdCLHFCQUFnQixHQUFHLGdCQUFnQixDQUFDO1FBQ3BDLGlCQUFZLEdBQUcsWUFBWSxDQUFDO0lBSTlCLENBQUM7Ozs7SUFGQyxRQUFRO0lBQ1IsQ0FBQzs7O1lBakJGLFNBQVMsU0FBQztnQkFDVCxRQUFRLEVBQUUsWUFBWTtnQkFDdEIsNHdCQUEwQztnQkFFMUMsZUFBZSxFQUFFLHVCQUF1QixDQUFDLE1BQU07O2FBQ2hEOzs7b0JBR0UsS0FBSzt1QkFDTCxLQUFLO3dCQUNMLEtBQUs7MEJBQ0wsS0FBSzs7OztJQUhOLG1DQUF1Qjs7SUFDdkIsc0NBQTBCOztJQUMxQix1Q0FBcUM7O0lBQ3JDLHlDQUE2Qjs7SUFFN0IsOENBQW9DOztJQUNwQywwQ0FBNEIiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21wb25lbnQsIE9uSW5pdCwgQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3ksIElucHV0IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5cbmVudW0gTWFycXVlZURpcmVjdGlvbiB7XG4gIGxlZnQgPSAnbGVmdCcsXG4gIHJpZ2h0ID0gJ3JpZ2h0JyxcbiAgYWx0ZXJuYXRlID0gJ2FsdGVybmF0ZSdcbn1cblxuZW51bSBNYXJxdWVlU3BlZWQge1xuICBkcm93c3kgPSAnZHJvd3N5JyxcbiAgc2xvdyA9ICdzbG93JyxcbiAgbm9ybWFsID0gJ25vcm1hbCcsXG4gIGZhc3QgPSAnZmFzdCcsXG4gIHN3aWZ0ID0gJ3N3aWZ0JyxcbiAgaHlwZXIgPSAnaHlwZXInLFxufVxuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICduZy1tYXJxdWVlJyxcbiAgdGVtcGxhdGVVcmw6ICcuL25nLW1hcnF1ZWUuY29tcG9uZW50Lmh0bWwnLFxuICBzdHlsZVVybHM6IFsnLi9uZy1tYXJxdWVlLmNvbXBvbmVudC5jc3MnXSxcbiAgY2hhbmdlRGV0ZWN0aW9uOiBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneS5PblB1c2gsXG59KVxuZXhwb3J0IGNsYXNzIE5nTWFycXVlZUNvbXBvbmVudCBpbXBsZW1lbnRzIE9uSW5pdCB7XG5cbiAgQElucHV0KCkgc3BlZWQ6IHN0cmluZztcbiAgQElucHV0KCkgZHVyYXRpb246IHN0cmluZztcbiAgQElucHV0KCkgZGlyZWN0aW9uOiBNYXJxdWVlRGlyZWN0aW9uO1xuICBASW5wdXQoKSBzdG9wT25Ib3ZlciA9IGZhbHNlO1xuXG4gIG1hcnF1ZWVEaXJlY3Rpb24gPSBNYXJxdWVlRGlyZWN0aW9uO1xuICBtYXJxdWVlU3BlZWQgPSBNYXJxdWVlU3BlZWQ7XG5cbiAgbmdPbkluaXQoKSB7XG4gIH1cbn1cbiJdfQ==