ng-marquee - npm Package Compare versions

Comparing version 8.0.0 to 9.2.0

bundles/ng-marquee.umd.js

 (function (global, factory) {
-    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core')) :
-    typeof define === 'function' && define.amd ? define('ng-marquee', ['exports', '@angular/core'], factory) :
-    (global = global || self, factory(global['ng-marquee'] = {}, global.ng.core));
-}(this, (function (exports, core) { 'use strict';
+    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@angular/common')) :
+    typeof define === 'function' && define.amd ? define('ng-marquee', ['exports', '@angular/core', '@angular/common'], factory) :
+    (global = global || self, factory(global['ng-marquee'] = {}, global.ng.core, global.ng.common));
+}(this, (function (exports, core, common) { 'use strict';
 
@@ -12,22 +12,25 @@ /**
      */
+    /** @enum {string} */
+    var MarqueeDirection = {
+        left: "left",
+        right: "right",
+        alternate: "alternate",
+    };
+    /** @enum {string} */
+    var MarqueeSpeed = {
+        drowsy: "drowsy",
+        slow: "slow",
+        normal: "normal",
+        fast: "fast",
+        swift: "swift",
+        hyper: "hyper",
+    };
     var NgMarqueeComponent = /** @class */ (function () {
         function NgMarqueeComponent() {
+            this.marqueeDirection = MarqueeDirection;
+            this.marqueeSpeed = MarqueeSpeed;
         }
         /**
-         * @private
          * @return {?}
          */
-        NgMarqueeComponent.prototype.updateDuration = /**
-         * @private
-         * @return {?}
-         */
-        function () {
-            if (!this.duration) {
-                return;
-            }
-            this.animationElem.nativeElement.style.animationDuration = this.duration + "s";
-        };
-        /**
-         * @return {?}
-         */
         NgMarqueeComponent.prototype.ngOnInit = /**
@@ -38,24 +41,13 @@ * @return {?}
         };
-        /**
-         * @return {?}
-         */
-        NgMarqueeComponent.prototype.ngAfterViewInit = /**
-         * @return {?}
-         */
-        function () {
-            this.updateDuration();
-        };
         NgMarqueeComponent.decorators = [
             { type: core.Component, args: [{
                         selector: 'ng-marquee',
-                        template: "<div class=\"ng-marquee-wrapper\">\n  <div #marqueeContainer>\n      <ng-content></ng-content>\n  </div>\n</div>",
+                        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}\">\n  <span>\n    <ng-content></ng-content>\n  </span>\n</div>",
                         changeDetection: core.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%{transform:translateX(0)}100%{transform:translateX(-100%)}}@keyframes marqueeAnimation{0%{transform:translateX(0)}100%{transform:translateX(-100%)}}@media (max-width:500px){.ng-marquee-wrapper>div{width:100%;height:100%;margin:0;transform:translateX(100%);-webkit-animation:9s linear 1s infinite marqueeAnimation;animation:9s linear 1s infinite marqueeAnimation;white-space:nowrap}}"]
+                        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-custom>span{-webkit-animation-duration:inherit;animation-duration:inherit}.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}@-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}"]
                     }] }
         ];
-        /** @nocollapse */
-        NgMarqueeComponent.ctorParameters = function () { return []; };
         NgMarqueeComponent.propDecorators = {
-            duration: [{ type: core.Input }],
-            animationElem: [{ type: core.ViewChild, args: ['marqueeContainer', { static: true },] }]
+            speed: [{ type: core.Input }],
+            direction: [{ type: core.Input }]
         };
@@ -66,5 +58,9 @@ return NgMarqueeComponent;
         /** @type {?} */
-        NgMarqueeComponent.prototype.duration;
+        NgMarqueeComponent.prototype.speed;
         /** @type {?} */
-        NgMarqueeComponent.prototype.animationElem;
+        NgMarqueeComponent.prototype.direction;
+        /** @type {?} */
+        NgMarqueeComponent.prototype.marqueeDirection;
+        /** @type {?} */
+        NgMarqueeComponent.prototype.marqueeSpeed;
     }
@@ -82,3 +78,5 @@
             { type: core.NgModule, args: [{
-                        imports: [],
+                        imports: [
+                            common.CommonModule,
+                        ],
                         declarations: [NgMarqueeComponent],
@@ -85,0 +83,0 @@ exports: [NgMarqueeComponent]

bundles/ng-marquee.umd.min.js

@@ -1,2 +0,2 @@
-!function(e,n){"object"==typeof exports&&"undefined"!=typeof module?n(exports,require("@angular/core")):"function"==typeof define&&define.amd?define("ng-marquee",["exports","@angular/core"],n):n((e=e||self)["ng-marquee"]={},e.ng.core)}(this,(function(e,n){"use strict";var t=function(){function e(){}return e.prototype.updateDuration=function(){this.duration&&(this.animationElem.nativeElement.style.animationDuration=this.duration+"s")},e.prototype.ngOnInit=function(){},e.prototype.ngAfterViewInit=function(){this.updateDuration()},e.decorators=[{type:n.Component,args:[{selector:"ng-marquee",template:'<div class="ng-marquee-wrapper">\n  <div #marqueeContainer>\n      <ng-content></ng-content>\n  </div>\n</div>',changeDetection:n.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%{transform:translateX(0)}100%{transform:translateX(-100%)}}@keyframes marqueeAnimation{0%{transform:translateX(0)}100%{transform:translateX(-100%)}}@media (max-width:500px){.ng-marquee-wrapper>div{width:100%;height:100%;margin:0;transform:translateX(100%);-webkit-animation:9s linear 1s infinite marqueeAnimation;animation:9s linear 1s infinite marqueeAnimation;white-space:nowrap}}"]}]}],e.ctorParameters=function(){return[]},e.propDecorators={duration:[{type:n.Input}],animationElem:[{type:n.ViewChild,args:["marqueeContainer",{static:!0}]}]},e}();var a=function(){function e(){}return e.decorators=[{type:n.NgModule,args:[{imports:[],declarations:[t],exports:[t]}]}],e}();e.NgMarqueeComponent=t,e.NgMarqueeModule=a,Object.defineProperty(e,"__esModule",{value:!0})}));
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@angular/core"),require("@angular/common")):"function"==typeof define&&define.amd?define("ng-marquee",["exports","@angular/core","@angular/common"],t):t((e=e||self)["ng-marquee"]={},e.ng.core,e.ng.common)}(this,(function(e,t,a){"use strict";var n={left:"left",right:"right",alternate:"alternate"},r={drowsy:"drowsy",slow:"slow",normal:"normal",fast:"fast",swift:"swift",hyper:"hyper"},s=function(){function e(){this.marqueeDirection=n,this.marqueeSpeed=r}return e.prototype.ngOnInit=function(){},e.decorators=[{type:t.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}\">\n  <span>\n    <ng-content></ng-content>\n  </span>\n</div>",changeDetection:t.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-custom>span{-webkit-animation-duration:inherit;animation-duration:inherit}.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}@-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}"]}]}],e.propDecorators={speed:[{type:t.Input}],direction:[{type:t.Input}]},e}();var o=function(){function e(){}return e.decorators=[{type:t.NgModule,args:[{imports:[a.CommonModule],declarations:[s],exports:[s]}]}],e}();e.NgMarqueeComponent=s,e.NgMarqueeModule=o,Object.defineProperty(e,"__esModule",{value:!0})}));
 //# sourceMappingURL=ng-marquee.umd.min.js.map

esm2015/lib/ng-marquee.module.js

@@ -8,2 +8,3 @@ /**
 import { NgMarqueeComponent } from './ng-marquee/ng-marquee.component';
+import { CommonModule } from '@angular/common';
 export class NgMarqueeModule {
@@ -13,3 +14,5 @@ }
     { type: NgModule, args: [{
-                imports: [],
+                imports: [
+                    CommonModule,
+                ],
                 declarations: [NgMarqueeComponent],
@@ -19,2 +22,2 @@ exports: [NgMarqueeComponent]
 ];
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibmctbWFycXVlZS5tb2R1bGUuanMiLCJzb3VyY2VSb290Ijoibmc6Ly9uZy1tYXJxdWVlLyIsInNvdXJjZXMiOlsibGliL25nLW1hcnF1ZWUubW9kdWxlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7Ozs7O0FBQUEsT0FBTyxFQUFFLFFBQVEsRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUN6QyxPQUFPLEVBQUUsa0JBQWtCLEVBQUUsTUFBTSxtQ0FBbUMsQ0FBQztBQVF2RSxNQUFNLE9BQU8sZUFBZTs7O1lBTjNCLFFBQVEsU0FBQztnQkFDUixPQUFPLEVBQUUsRUFDUjtnQkFDRCxZQUFZLEVBQUUsQ0FBQyxrQkFBa0IsQ0FBQztnQkFDbEMsT0FBTyxFQUFFLENBQUMsa0JBQWtCLENBQUM7YUFDOUIiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBOZ01vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgTmdNYXJxdWVlQ29tcG9uZW50IH0gZnJvbSAnLi9uZy1tYXJxdWVlL25nLW1hcnF1ZWUuY29tcG9uZW50JztcblxuQE5nTW9kdWxlKHtcbiAgaW1wb3J0czogW1xuICBdLFxuICBkZWNsYXJhdGlvbnM6IFtOZ01hcnF1ZWVDb21wb25lbnRdLFxuICBleHBvcnRzOiBbTmdNYXJxdWVlQ29tcG9uZW50XVxufSlcbmV4cG9ydCBjbGFzcyBOZ01hcnF1ZWVNb2R1bGUgeyB9XG4iXX0=
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibmctbWFycXVlZS5tb2R1bGUuanMiLCJzb3VyY2VSb290Ijoibmc6Ly9uZy1tYXJxdWVlLyIsInNvdXJjZXMiOlsibGliL25nLW1hcnF1ZWUubW9kdWxlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7Ozs7O0FBQUEsT0FBTyxFQUFFLFFBQVEsRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUN6QyxPQUFPLEVBQUUsa0JBQWtCLEVBQUUsTUFBTSxtQ0FBbUMsQ0FBQztBQUN2RSxPQUFPLEVBQUUsWUFBWSxFQUFFLE1BQU0saUJBQWlCLENBQUM7QUFTL0MsTUFBTSxPQUFPLGVBQWU7OztZQVAzQixRQUFRLFNBQUM7Z0JBQ1IsT0FBTyxFQUFFO29CQUNQLFlBQVk7aUJBQ2I7Z0JBQ0QsWUFBWSxFQUFFLENBQUMsa0JBQWtCLENBQUM7Z0JBQ2xDLE9BQU8sRUFBRSxDQUFDLGtCQUFrQixDQUFDO2FBQzlCIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgTmdNb2R1bGUgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IE5nTWFycXVlZUNvbXBvbmVudCB9IGZyb20gJy4vbmctbWFycXVlZS9uZy1tYXJxdWVlLmNvbXBvbmVudCc7XG5pbXBvcnQgeyBDb21tb25Nb2R1bGUgfSBmcm9tICdAYW5ndWxhci9jb21tb24nO1xuXG5ATmdNb2R1bGUoe1xuICBpbXBvcnRzOiBbXG4gICAgQ29tbW9uTW9kdWxlLFxuICBdLFxuICBkZWNsYXJhdGlvbnM6IFtOZ01hcnF1ZWVDb21wb25lbnRdLFxuICBleHBvcnRzOiBbTmdNYXJxdWVlQ29tcG9uZW50XVxufSlcbmV4cG9ydCBjbGFzcyBOZ01hcnF1ZWVNb2R1bGUgeyB9XG4iXX0=

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

@@ -6,14 +6,22 @@ /**
  */
-import { Component, ChangeDetectionStrategy, Input, ViewChild, ElementRef } from '@angular/core';
+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() { }
-    /**
-     * @private
-     * @return {?}
-     */
-    updateDuration() {
-        if (!this.duration) {
-            return;
-        }
-        this.animationElem.nativeElement.style.animationDuration = `${this.duration}s`;
+    constructor() {
+        this.marqueeDirection = MarqueeDirection;
+        this.marqueeSpeed = MarqueeSpeed;
     }
@@ -25,8 +33,2 @@ /**
     }
-    /**
-     * @return {?}
-     */
-    ngAfterViewInit() {
-        this.updateDuration();
-    }
 }
@@ -36,19 +38,21 @@ NgMarqueeComponent.decorators = [
                 selector: 'ng-marquee',
-                template: "<div class=\"ng-marquee-wrapper\">\n  <div #marqueeContainer>\n      <ng-content></ng-content>\n  </div>\n</div>",
+                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}\">\n  <span>\n    <ng-content></ng-content>\n  </span>\n</div>",
                 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%{transform:translateX(0)}100%{transform:translateX(-100%)}}@keyframes marqueeAnimation{0%{transform:translateX(0)}100%{transform:translateX(-100%)}}@media (max-width:500px){.ng-marquee-wrapper>div{width:100%;height:100%;margin:0;transform:translateX(100%);-webkit-animation:9s linear 1s infinite marqueeAnimation;animation:9s linear 1s infinite marqueeAnimation;white-space:nowrap}}"]
+                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-custom>span{-webkit-animation-duration:inherit;animation-duration:inherit}.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}@-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}"]
             }] }
 ];
-/** @nocollapse */
-NgMarqueeComponent.ctorParameters = () => [];
 NgMarqueeComponent.propDecorators = {
-    duration: [{ type: Input }],
-    animationElem: [{ type: ViewChild, args: ['marqueeContainer', { static: true },] }]
+    speed: [{ type: Input }],
+    direction: [{ type: Input }]
 };
 if (false) {
     /** @type {?} */
-    NgMarqueeComponent.prototype.duration;
+    NgMarqueeComponent.prototype.speed;
     /** @type {?} */
-    NgMarqueeComponent.prototype.animationElem;
+    NgMarqueeComponent.prototype.direction;
+    /** @type {?} */
+    NgMarqueeComponent.prototype.marqueeDirection;
+    /** @type {?} */
+    NgMarqueeComponent.prototype.marqueeSpeed;
 }
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibmctbWFycXVlZS5jb21wb25lbnQuanMiLCJzb3VyY2VSb290Ijoibmc6Ly9uZy1tYXJxdWVlLyIsInNvdXJjZXMiOlsibGliL25nLW1hcnF1ZWUvbmctbWFycXVlZS5jb21wb25lbnQudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7Ozs7QUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFVLHVCQUF1QixFQUFFLEtBQUssRUFBaUIsU0FBUyxFQUFFLFVBQVUsRUFBRSxNQUFNLGVBQWUsQ0FBQztBQVF4SCxNQUFNLE9BQU8sa0JBQWtCO0lBSzdCLGdCQUNJLENBQUM7Ozs7O0lBRUcsY0FBYztRQUNwQixJQUFJLENBQUMsSUFBSSxDQUFDLFFBQVEsRUFBRTtZQUNsQixPQUFPO1NBQ1I7UUFFRCxJQUFJLENBQUMsYUFBYSxDQUFDLGFBQWEsQ0FBQyxLQUFLLENBQUMsaUJBQWlCLEdBQUcsR0FBRyxJQUFJLENBQUMsUUFBUSxHQUFHLENBQUM7SUFDakYsQ0FBQzs7OztJQUVELFFBQVE7SUFDUixDQUFDOzs7O0lBRUQsZUFBZTtRQUNiLElBQUksQ0FBQyxjQUFjLEVBQUUsQ0FBQztJQUN4QixDQUFDOzs7WUEzQkYsU0FBUyxTQUFDO2dCQUNULFFBQVEsRUFBRSxZQUFZO2dCQUN0Qiw0SEFBMEM7Z0JBRTFDLGVBQWUsRUFBRSx1QkFBdUIsQ0FBQyxNQUFNOzthQUNoRDs7Ozs7dUJBR0UsS0FBSzs0QkFDTCxTQUFTLFNBQUMsa0JBQWtCLEVBQUUsRUFBRSxNQUFNLEVBQUUsSUFBSSxFQUFFOzs7O0lBRC9DLHNDQUFtQzs7SUFDbkMsMkNBQTJGIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tcG9uZW50LCBPbkluaXQsIENoYW5nZURldGVjdGlvblN0cmF0ZWd5LCBJbnB1dCwgQWZ0ZXJWaWV3SW5pdCwgVmlld0NoaWxkLCBFbGVtZW50UmVmIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ25nLW1hcnF1ZWUnLFxuICB0ZW1wbGF0ZVVybDogJy4vbmctbWFycXVlZS5jb21wb25lbnQuaHRtbCcsXG4gIHN0eWxlVXJsczogWycuL25nLW1hcnF1ZWUuY29tcG9uZW50LmNzcyddLFxuICBjaGFuZ2VEZXRlY3Rpb246IENoYW5nZURldGVjdGlvblN0cmF0ZWd5Lk9uUHVzaCxcbn0pXG5leHBvcnQgY2xhc3MgTmdNYXJxdWVlQ29tcG9uZW50IGltcGxlbWVudHMgT25Jbml0LCBBZnRlclZpZXdJbml0IHtcblxuICBASW5wdXQoKSBkdXJhdGlvbjogc3RyaW5nIHwgbnVtYmVyO1xuICBAVmlld0NoaWxkKCdtYXJxdWVlQ29udGFpbmVyJywgeyBzdGF0aWM6IHRydWUgfSkgYW5pbWF0aW9uRWxlbTogRWxlbWVudFJlZjxIVE1MRGl2RWxlbWVudD47XG5cbiAgY29uc3RydWN0b3IoXG4gICkgeyB9XG5cbiAgcHJpdmF0ZSB1cGRhdGVEdXJhdGlvbigpIHtcbiAgICBpZiAoIXRoaXMuZHVyYXRpb24pIHtcbiAgICAgIHJldHVybjtcbiAgICB9XG5cbiAgICB0aGlzLmFuaW1hdGlvbkVsZW0ubmF0aXZlRWxlbWVudC5zdHlsZS5hbmltYXRpb25EdXJhdGlvbiA9IGAke3RoaXMuZHVyYXRpb259c2A7XG4gIH1cblxuICBuZ09uSW5pdCgpIHtcbiAgfVxuXG4gIG5nQWZ0ZXJWaWV3SW5pdCgpIHtcbiAgICB0aGlzLnVwZGF0ZUR1cmF0aW9uKCk7XG4gIH1cblxufVxuIl19
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibmctbWFycXVlZS5jb21wb25lbnQuanMiLCJzb3VyY2VSb290Ijoibmc6Ly9uZy1tYXJxdWVlLyIsInNvdXJjZXMiOlsibGliL25nLW1hcnF1ZWUvbmctbWFycXVlZS5jb21wb25lbnQudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7Ozs7QUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFVLHVCQUF1QixFQUFFLEtBQUssRUFBRSxNQUFNLGVBQWUsQ0FBQzs7QUFFbEYsTUFBSyxnQkFBZ0I7SUFDbkIsSUFBSSxRQUFTO0lBQ2IsS0FBSyxTQUFVO0lBQ2YsU0FBUyxhQUFjO0VBQ3hCOztBQUVELE1BQUssWUFBWTtJQUNmLE1BQU0sVUFBVztJQUNqQixJQUFJLFFBQVM7SUFDYixNQUFNLFVBQVc7SUFDakIsSUFBSSxRQUFTO0lBQ2IsS0FBSyxTQUFVO0lBQ2YsS0FBSyxTQUFVO0VBQ2hCO0FBUUQsTUFBTSxPQUFPLGtCQUFrQjtJQU4vQjtRQVdFLHFCQUFnQixHQUFHLGdCQUFnQixDQUFDO1FBQ3BDLGlCQUFZLEdBQUcsWUFBWSxDQUFDO0lBSTlCLENBQUM7Ozs7SUFGQyxRQUFRO0lBQ1IsQ0FBQzs7O1lBZkYsU0FBUyxTQUFDO2dCQUNULFFBQVEsRUFBRSxZQUFZO2dCQUN0QixpckJBQTBDO2dCQUUxQyxlQUFlLEVBQUUsdUJBQXVCLENBQUMsTUFBTTs7YUFDaEQ7OztvQkFHRSxLQUFLO3dCQUNMLEtBQUs7Ozs7SUFETixtQ0FBZ0M7O0lBQ2hDLHVDQUFxQzs7SUFFckMsOENBQW9DOztJQUNwQywwQ0FBNEIiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21wb25lbnQsIE9uSW5pdCwgQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3ksIElucHV0IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5cbmVudW0gTWFycXVlZURpcmVjdGlvbiB7XG4gIGxlZnQgPSAnbGVmdCcsXG4gIHJpZ2h0ID0gJ3JpZ2h0JyxcbiAgYWx0ZXJuYXRlID0gJ2FsdGVybmF0ZSdcbn1cblxuZW51bSBNYXJxdWVlU3BlZWQge1xuICBkcm93c3kgPSAnZHJvd3N5JyxcbiAgc2xvdyA9ICdzbG93JyxcbiAgbm9ybWFsID0gJ25vcm1hbCcsXG4gIGZhc3QgPSAnZmFzdCcsXG4gIHN3aWZ0ID0gJ3N3aWZ0JyxcbiAgaHlwZXIgPSAnaHlwZXInXG59XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ25nLW1hcnF1ZWUnLFxuICB0ZW1wbGF0ZVVybDogJy4vbmctbWFycXVlZS5jb21wb25lbnQuaHRtbCcsXG4gIHN0eWxlVXJsczogWycuL25nLW1hcnF1ZWUuY29tcG9uZW50LmNzcyddLFxuICBjaGFuZ2VEZXRlY3Rpb246IENoYW5nZURldGVjdGlvblN0cmF0ZWd5Lk9uUHVzaCxcbn0pXG5leHBvcnQgY2xhc3MgTmdNYXJxdWVlQ29tcG9uZW50IGltcGxlbWVudHMgT25Jbml0IHtcblxuICBASW5wdXQoKSBzcGVlZDogc3RyaW5nIHwgbnVtYmVyO1xuICBASW5wdXQoKSBkaXJlY3Rpb246IE1hcnF1ZWVEaXJlY3Rpb247XG5cbiAgbWFycXVlZURpcmVjdGlvbiA9IE1hcnF1ZWVEaXJlY3Rpb247XG4gIG1hcnF1ZWVTcGVlZCA9IE1hcnF1ZWVTcGVlZDtcblxuICBuZ09uSW5pdCgpIHtcbiAgfVxufVxuIl19

esm5/lib/ng-marquee.module.js

@@ -8,2 +8,3 @@ /**
 import { NgMarqueeComponent } from './ng-marquee/ng-marquee.component';
+import { CommonModule } from '@angular/common';
 var NgMarqueeModule = /** @class */ (function () {
@@ -14,3 +15,5 @@ function NgMarqueeModule() {
         { type: NgModule, args: [{
-                    imports: [],
+                    imports: [
+                        CommonModule,
+                    ],
                     declarations: [NgMarqueeComponent],
@@ -23,2 +26,2 @@ exports: [NgMarqueeComponent]
 export { NgMarqueeModule };
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibmctbWFycXVlZS5tb2R1bGUuanMiLCJzb3VyY2VSb290Ijoibmc6Ly9uZy1tYXJxdWVlLyIsInNvdXJjZXMiOlsibGliL25nLW1hcnF1ZWUubW9kdWxlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7Ozs7O0FBQUEsT0FBTyxFQUFFLFFBQVEsRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUN6QyxPQUFPLEVBQUUsa0JBQWtCLEVBQUUsTUFBTSxtQ0FBbUMsQ0FBQztBQUV2RTtJQUFBO0lBTStCLENBQUM7O2dCQU4vQixRQUFRLFNBQUM7b0JBQ1IsT0FBTyxFQUFFLEVBQ1I7b0JBQ0QsWUFBWSxFQUFFLENBQUMsa0JBQWtCLENBQUM7b0JBQ2xDLE9BQU8sRUFBRSxDQUFDLGtCQUFrQixDQUFDO2lCQUM5Qjs7SUFDOEIsc0JBQUM7Q0FBQSxBQU5oQyxJQU1nQztTQUFuQixlQUFlIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgTmdNb2R1bGUgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IE5nTWFycXVlZUNvbXBvbmVudCB9IGZyb20gJy4vbmctbWFycXVlZS9uZy1tYXJxdWVlLmNvbXBvbmVudCc7XG5cbkBOZ01vZHVsZSh7XG4gIGltcG9ydHM6IFtcbiAgXSxcbiAgZGVjbGFyYXRpb25zOiBbTmdNYXJxdWVlQ29tcG9uZW50XSxcbiAgZXhwb3J0czogW05nTWFycXVlZUNvbXBvbmVudF1cbn0pXG5leHBvcnQgY2xhc3MgTmdNYXJxdWVlTW9kdWxlIHsgfVxuIl19
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibmctbWFycXVlZS5tb2R1bGUuanMiLCJzb3VyY2VSb290Ijoibmc6Ly9uZy1tYXJxdWVlLyIsInNvdXJjZXMiOlsibGliL25nLW1hcnF1ZWUubW9kdWxlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7Ozs7O0FBQUEsT0FBTyxFQUFFLFFBQVEsRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUN6QyxPQUFPLEVBQUUsa0JBQWtCLEVBQUUsTUFBTSxtQ0FBbUMsQ0FBQztBQUN2RSxPQUFPLEVBQUUsWUFBWSxFQUFFLE1BQU0saUJBQWlCLENBQUM7QUFFL0M7SUFBQTtJQU8rQixDQUFDOztnQkFQL0IsUUFBUSxTQUFDO29CQUNSLE9BQU8sRUFBRTt3QkFDUCxZQUFZO3FCQUNiO29CQUNELFlBQVksRUFBRSxDQUFDLGtCQUFrQixDQUFDO29CQUNsQyxPQUFPLEVBQUUsQ0FBQyxrQkFBa0IsQ0FBQztpQkFDOUI7O0lBQzhCLHNCQUFDO0NBQUEsQUFQaEMsSUFPZ0M7U0FBbkIsZUFBZSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IE5nTW9kdWxlIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBOZ01hcnF1ZWVDb21wb25lbnQgfSBmcm9tICcuL25nLW1hcnF1ZWUvbmctbWFycXVlZS5jb21wb25lbnQnO1xuaW1wb3J0IHsgQ29tbW9uTW9kdWxlIH0gZnJvbSAnQGFuZ3VsYXIvY29tbW9uJztcblxuQE5nTW9kdWxlKHtcbiAgaW1wb3J0czogW1xuICAgIENvbW1vbk1vZHVsZSxcbiAgXSxcbiAgZGVjbGFyYXRpb25zOiBbTmdNYXJxdWVlQ29tcG9uZW50XSxcbiAgZXhwb3J0czogW05nTWFycXVlZUNvbXBvbmVudF1cbn0pXG5leHBvcnQgY2xhc3MgTmdNYXJxdWVlTW9kdWxlIHsgfVxuIl19

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

@@ -6,23 +6,26 @@ /**
  */
-import { Component, ChangeDetectionStrategy, Input, ViewChild, ElementRef } from '@angular/core';
+import { Component, ChangeDetectionStrategy, Input } from '@angular/core';
+/** @enum {string} */
+var MarqueeDirection = {
+    left: "left",
+    right: "right",
+    alternate: "alternate",
+};
+/** @enum {string} */
+var MarqueeSpeed = {
+    drowsy: "drowsy",
+    slow: "slow",
+    normal: "normal",
+    fast: "fast",
+    swift: "swift",
+    hyper: "hyper",
+};
 var NgMarqueeComponent = /** @class */ (function () {
     function NgMarqueeComponent() {
+        this.marqueeDirection = MarqueeDirection;
+        this.marqueeSpeed = MarqueeSpeed;
     }
     /**
-     * @private
      * @return {?}
      */
-    NgMarqueeComponent.prototype.updateDuration = /**
-     * @private
-     * @return {?}
-     */
-    function () {
-        if (!this.duration) {
-            return;
-        }
-        this.animationElem.nativeElement.style.animationDuration = this.duration + "s";
-    };
-    /**
-     * @return {?}
-     */
     NgMarqueeComponent.prototype.ngOnInit = /**
@@ -33,24 +36,13 @@ * @return {?}
     };
-    /**
-     * @return {?}
-     */
-    NgMarqueeComponent.prototype.ngAfterViewInit = /**
-     * @return {?}
-     */
-    function () {
-        this.updateDuration();
-    };
     NgMarqueeComponent.decorators = [
         { type: Component, args: [{
                     selector: 'ng-marquee',
-                    template: "<div class=\"ng-marquee-wrapper\">\n  <div #marqueeContainer>\n      <ng-content></ng-content>\n  </div>\n</div>",
+                    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}\">\n  <span>\n    <ng-content></ng-content>\n  </span>\n</div>",
                     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%{transform:translateX(0)}100%{transform:translateX(-100%)}}@keyframes marqueeAnimation{0%{transform:translateX(0)}100%{transform:translateX(-100%)}}@media (max-width:500px){.ng-marquee-wrapper>div{width:100%;height:100%;margin:0;transform:translateX(100%);-webkit-animation:9s linear 1s infinite marqueeAnimation;animation:9s linear 1s infinite marqueeAnimation;white-space:nowrap}}"]
+                    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-custom>span{-webkit-animation-duration:inherit;animation-duration:inherit}.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}@-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}"]
                 }] }
     ];
-    /** @nocollapse */
-    NgMarqueeComponent.ctorParameters = function () { return []; };
     NgMarqueeComponent.propDecorators = {
-        duration: [{ type: Input }],
-        animationElem: [{ type: ViewChild, args: ['marqueeContainer', { static: true },] }]
+        speed: [{ type: Input }],
+        direction: [{ type: Input }]
     };
@@ -62,6 +54,10 @@ return NgMarqueeComponent;
     /** @type {?} */
-    NgMarqueeComponent.prototype.duration;
+    NgMarqueeComponent.prototype.speed;
     /** @type {?} */
-    NgMarqueeComponent.prototype.animationElem;
+    NgMarqueeComponent.prototype.direction;
+    /** @type {?} */
+    NgMarqueeComponent.prototype.marqueeDirection;
+    /** @type {?} */
+    NgMarqueeComponent.prototype.marqueeSpeed;
 }
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibmctbWFycXVlZS5jb21wb25lbnQuanMiLCJzb3VyY2VSb290Ijoibmc6Ly9uZy1tYXJxdWVlLyIsInNvdXJjZXMiOlsibGliL25nLW1hcnF1ZWUvbmctbWFycXVlZS5jb21wb25lbnQudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7Ozs7QUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFVLHVCQUF1QixFQUFFLEtBQUssRUFBaUIsU0FBUyxFQUFFLFVBQVUsRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUV4SDtJQVdFO0lBQ0ksQ0FBQzs7Ozs7SUFFRywyQ0FBYzs7OztJQUF0QjtRQUNFLElBQUksQ0FBQyxJQUFJLENBQUMsUUFBUSxFQUFFO1lBQ2xCLE9BQU87U0FDUjtRQUVELElBQUksQ0FBQyxhQUFhLENBQUMsYUFBYSxDQUFDLEtBQUssQ0FBQyxpQkFBaUIsR0FBTSxJQUFJLENBQUMsUUFBUSxNQUFHLENBQUM7SUFDakYsQ0FBQzs7OztJQUVELHFDQUFROzs7SUFBUjtJQUNBLENBQUM7Ozs7SUFFRCw0Q0FBZTs7O0lBQWY7UUFDRSxJQUFJLENBQUMsY0FBYyxFQUFFLENBQUM7SUFDeEIsQ0FBQzs7Z0JBM0JGLFNBQVMsU0FBQztvQkFDVCxRQUFRLEVBQUUsWUFBWTtvQkFDdEIsNEhBQTBDO29CQUUxQyxlQUFlLEVBQUUsdUJBQXVCLENBQUMsTUFBTTs7aUJBQ2hEOzs7OzsyQkFHRSxLQUFLO2dDQUNMLFNBQVMsU0FBQyxrQkFBa0IsRUFBRSxFQUFFLE1BQU0sRUFBRSxJQUFJLEVBQUU7O0lBb0JqRCx5QkFBQztDQUFBLEFBN0JELElBNkJDO1NBdkJZLGtCQUFrQjs7O0lBRTdCLHNDQUFtQzs7SUFDbkMsMkNBQTJGIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tcG9uZW50LCBPbkluaXQsIENoYW5nZURldGVjdGlvblN0cmF0ZWd5LCBJbnB1dCwgQWZ0ZXJWaWV3SW5pdCwgVmlld0NoaWxkLCBFbGVtZW50UmVmIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ25nLW1hcnF1ZWUnLFxuICB0ZW1wbGF0ZVVybDogJy4vbmctbWFycXVlZS5jb21wb25lbnQuaHRtbCcsXG4gIHN0eWxlVXJsczogWycuL25nLW1hcnF1ZWUuY29tcG9uZW50LmNzcyddLFxuICBjaGFuZ2VEZXRlY3Rpb246IENoYW5nZURldGVjdGlvblN0cmF0ZWd5Lk9uUHVzaCxcbn0pXG5leHBvcnQgY2xhc3MgTmdNYXJxdWVlQ29tcG9uZW50IGltcGxlbWVudHMgT25Jbml0LCBBZnRlclZpZXdJbml0IHtcblxuICBASW5wdXQoKSBkdXJhdGlvbjogc3RyaW5nIHwgbnVtYmVyO1xuICBAVmlld0NoaWxkKCdtYXJxdWVlQ29udGFpbmVyJywgeyBzdGF0aWM6IHRydWUgfSkgYW5pbWF0aW9uRWxlbTogRWxlbWVudFJlZjxIVE1MRGl2RWxlbWVudD47XG5cbiAgY29uc3RydWN0b3IoXG4gICkgeyB9XG5cbiAgcHJpdmF0ZSB1cGRhdGVEdXJhdGlvbigpIHtcbiAgICBpZiAoIXRoaXMuZHVyYXRpb24pIHtcbiAgICAgIHJldHVybjtcbiAgICB9XG5cbiAgICB0aGlzLmFuaW1hdGlvbkVsZW0ubmF0aXZlRWxlbWVudC5zdHlsZS5hbmltYXRpb25EdXJhdGlvbiA9IGAke3RoaXMuZHVyYXRpb259c2A7XG4gIH1cblxuICBuZ09uSW5pdCgpIHtcbiAgfVxuXG4gIG5nQWZ0ZXJWaWV3SW5pdCgpIHtcbiAgICB0aGlzLnVwZGF0ZUR1cmF0aW9uKCk7XG4gIH1cblxufVxuIl19
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibmctbWFycXVlZS5jb21wb25lbnQuanMiLCJzb3VyY2VSb290Ijoibmc6Ly9uZy1tYXJxdWVlLyIsInNvdXJjZXMiOlsibGliL25nLW1hcnF1ZWUvbmctbWFycXVlZS5jb21wb25lbnQudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7Ozs7QUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFVLHVCQUF1QixFQUFFLEtBQUssRUFBRSxNQUFNLGVBQWUsQ0FBQzs7QUFFbEYsSUFBSyxnQkFBZ0I7SUFDbkIsSUFBSSxRQUFTO0lBQ2IsS0FBSyxTQUFVO0lBQ2YsU0FBUyxhQUFjO0VBQ3hCOztBQUVELElBQUssWUFBWTtJQUNmLE1BQU0sVUFBVztJQUNqQixJQUFJLFFBQVM7SUFDYixNQUFNLFVBQVc7SUFDakIsSUFBSSxRQUFTO0lBQ2IsS0FBSyxTQUFVO0lBQ2YsS0FBSyxTQUFVO0VBQ2hCO0FBRUQ7SUFBQTtRQVdFLHFCQUFnQixHQUFHLGdCQUFnQixDQUFDO1FBQ3BDLGlCQUFZLEdBQUcsWUFBWSxDQUFDO0lBSTlCLENBQUM7Ozs7SUFGQyxxQ0FBUTs7O0lBQVI7SUFDQSxDQUFDOztnQkFmRixTQUFTLFNBQUM7b0JBQ1QsUUFBUSxFQUFFLFlBQVk7b0JBQ3RCLGlyQkFBMEM7b0JBRTFDLGVBQWUsRUFBRSx1QkFBdUIsQ0FBQyxNQUFNOztpQkFDaEQ7Ozt3QkFHRSxLQUFLOzRCQUNMLEtBQUs7O0lBT1IseUJBQUM7Q0FBQSxBQWhCRCxJQWdCQztTQVZZLGtCQUFrQjs7O0lBRTdCLG1DQUFnQzs7SUFDaEMsdUNBQXFDOztJQUVyQyw4Q0FBb0M7O0lBQ3BDLDBDQUE0QiIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbXBvbmVudCwgT25Jbml0LCBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSwgSW5wdXQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcblxuZW51bSBNYXJxdWVlRGlyZWN0aW9uIHtcbiAgbGVmdCA9ICdsZWZ0JyxcbiAgcmlnaHQgPSAncmlnaHQnLFxuICBhbHRlcm5hdGUgPSAnYWx0ZXJuYXRlJ1xufVxuXG5lbnVtIE1hcnF1ZWVTcGVlZCB7XG4gIGRyb3dzeSA9ICdkcm93c3knLFxuICBzbG93ID0gJ3Nsb3cnLFxuICBub3JtYWwgPSAnbm9ybWFsJyxcbiAgZmFzdCA9ICdmYXN0JyxcbiAgc3dpZnQgPSAnc3dpZnQnLFxuICBoeXBlciA9ICdoeXBlcidcbn1cblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnbmctbWFycXVlZScsXG4gIHRlbXBsYXRlVXJsOiAnLi9uZy1tYXJxdWVlLmNvbXBvbmVudC5odG1sJyxcbiAgc3R5bGVVcmxzOiBbJy4vbmctbWFycXVlZS5jb21wb25lbnQuY3NzJ10sXG4gIGNoYW5nZURldGVjdGlvbjogQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3kuT25QdXNoLFxufSlcbmV4cG9ydCBjbGFzcyBOZ01hcnF1ZWVDb21wb25lbnQgaW1wbGVtZW50cyBPbkluaXQge1xuXG4gIEBJbnB1dCgpIHNwZWVkOiBzdHJpbmcgfCBudW1iZXI7XG4gIEBJbnB1dCgpIGRpcmVjdGlvbjogTWFycXVlZURpcmVjdGlvbjtcblxuICBtYXJxdWVlRGlyZWN0aW9uID0gTWFycXVlZURpcmVjdGlvbjtcbiAgbWFycXVlZVNwZWVkID0gTWFycXVlZVNwZWVkO1xuXG4gIG5nT25Jbml0KCkge1xuICB9XG59XG4iXX0=

fesm2015/ng-marquee.js

@@ -1,2 +0,3 @@
-import { Component, ChangeDetectionStrategy, Input, ViewChild, NgModule } from '@angular/core';
+import { Component, ChangeDetectionStrategy, Input, NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
 
@@ -8,13 +9,21 @@ /**
  */
+/** @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",
+};
 class NgMarqueeComponent {
-    constructor() { }
-    /**
-     * @private
-     * @return {?}
-     */
-    updateDuration() {
-        if (!this.duration) {
-            return;
-        }
-        this.animationElem.nativeElement.style.animationDuration = `${this.duration}s`;
+    constructor() {
+        this.marqueeDirection = MarqueeDirection;
+        this.marqueeSpeed = MarqueeSpeed;
     }
@@ -26,8 +35,2 @@ /**
     }
-    /**
-     * @return {?}
-     */
-    ngAfterViewInit() {
-        this.updateDuration();
-    }
 }
@@ -37,18 +40,20 @@ NgMarqueeComponent.decorators = [
                 selector: 'ng-marquee',
-                template: "<div class=\"ng-marquee-wrapper\">\n  <div #marqueeContainer>\n      <ng-content></ng-content>\n  </div>\n</div>",
+                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}\">\n  <span>\n    <ng-content></ng-content>\n  </span>\n</div>",
                 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%{transform:translateX(0)}100%{transform:translateX(-100%)}}@keyframes marqueeAnimation{0%{transform:translateX(0)}100%{transform:translateX(-100%)}}@media (max-width:500px){.ng-marquee-wrapper>div{width:100%;height:100%;margin:0;transform:translateX(100%);-webkit-animation:9s linear 1s infinite marqueeAnimation;animation:9s linear 1s infinite marqueeAnimation;white-space:nowrap}}"]
+                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-custom>span{-webkit-animation-duration:inherit;animation-duration:inherit}.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}@-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}"]
             }] }
 ];
-/** @nocollapse */
-NgMarqueeComponent.ctorParameters = () => [];
 NgMarqueeComponent.propDecorators = {
-    duration: [{ type: Input }],
-    animationElem: [{ type: ViewChild, args: ['marqueeContainer', { static: true },] }]
+    speed: [{ type: Input }],
+    direction: [{ type: Input }]
 };
 if (false) {
     /** @type {?} */
-    NgMarqueeComponent.prototype.duration;
+    NgMarqueeComponent.prototype.speed;
     /** @type {?} */
-    NgMarqueeComponent.prototype.animationElem;
+    NgMarqueeComponent.prototype.direction;
+    /** @type {?} */
+    NgMarqueeComponent.prototype.marqueeDirection;
+    /** @type {?} */
+    NgMarqueeComponent.prototype.marqueeSpeed;
 }
@@ -65,3 +70,5 @@
     { type: NgModule, args: [{
-                imports: [],
+                imports: [
+                    CommonModule,
+                ],
                 declarations: [NgMarqueeComponent],
@@ -68,0 +75,0 @@ exports: [NgMarqueeComponent]

fesm5/ng-marquee.js

@@ -1,2 +0,3 @@
-import { Component, ChangeDetectionStrategy, Input, ViewChild, NgModule } from '@angular/core';
+import { Component, ChangeDetectionStrategy, Input, NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
 
@@ -8,22 +9,25 @@ /**
  */
+/** @enum {string} */
+var MarqueeDirection = {
+    left: "left",
+    right: "right",
+    alternate: "alternate",
+};
+/** @enum {string} */
+var MarqueeSpeed = {
+    drowsy: "drowsy",
+    slow: "slow",
+    normal: "normal",
+    fast: "fast",
+    swift: "swift",
+    hyper: "hyper",
+};
 var NgMarqueeComponent = /** @class */ (function () {
     function NgMarqueeComponent() {
+        this.marqueeDirection = MarqueeDirection;
+        this.marqueeSpeed = MarqueeSpeed;
     }
     /**
-     * @private
      * @return {?}
      */
-    NgMarqueeComponent.prototype.updateDuration = /**
-     * @private
-     * @return {?}
-     */
-    function () {
-        if (!this.duration) {
-            return;
-        }
-        this.animationElem.nativeElement.style.animationDuration = this.duration + "s";
-    };
-    /**
-     * @return {?}
-     */
     NgMarqueeComponent.prototype.ngOnInit = /**
@@ -34,24 +38,13 @@ * @return {?}
     };
-    /**
-     * @return {?}
-     */
-    NgMarqueeComponent.prototype.ngAfterViewInit = /**
-     * @return {?}
-     */
-    function () {
-        this.updateDuration();
-    };
     NgMarqueeComponent.decorators = [
         { type: Component, args: [{
                     selector: 'ng-marquee',
-                    template: "<div class=\"ng-marquee-wrapper\">\n  <div #marqueeContainer>\n      <ng-content></ng-content>\n  </div>\n</div>",
+                    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}\">\n  <span>\n    <ng-content></ng-content>\n  </span>\n</div>",
                     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%{transform:translateX(0)}100%{transform:translateX(-100%)}}@keyframes marqueeAnimation{0%{transform:translateX(0)}100%{transform:translateX(-100%)}}@media (max-width:500px){.ng-marquee-wrapper>div{width:100%;height:100%;margin:0;transform:translateX(100%);-webkit-animation:9s linear 1s infinite marqueeAnimation;animation:9s linear 1s infinite marqueeAnimation;white-space:nowrap}}"]
+                    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-custom>span{-webkit-animation-duration:inherit;animation-duration:inherit}.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}@-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}"]
                 }] }
     ];
-    /** @nocollapse */
-    NgMarqueeComponent.ctorParameters = function () { return []; };
     NgMarqueeComponent.propDecorators = {
-        duration: [{ type: Input }],
-        animationElem: [{ type: ViewChild, args: ['marqueeContainer', { static: true },] }]
+        speed: [{ type: Input }],
+        direction: [{ type: Input }]
     };
@@ -62,5 +55,9 @@ return NgMarqueeComponent;
     /** @type {?} */
-    NgMarqueeComponent.prototype.duration;
+    NgMarqueeComponent.prototype.speed;
     /** @type {?} */
-    NgMarqueeComponent.prototype.animationElem;
+    NgMarqueeComponent.prototype.direction;
+    /** @type {?} */
+    NgMarqueeComponent.prototype.marqueeDirection;
+    /** @type {?} */
+    NgMarqueeComponent.prototype.marqueeSpeed;
 }
@@ -78,3 +75,5 @@
         { type: NgModule, args: [{
-                    imports: [],
+                    imports: [
+                        CommonModule,
+                    ],
                     declarations: [NgMarqueeComponent],
@@ -81,0 +80,0 @@ exports: [NgMarqueeComponent]

lib/ng-marquee/ng-marquee.component.d.ts

@@ -1,9 +0,22 @@
-import { OnInit, AfterViewInit, ElementRef } from '@angular/core';
-export declare class NgMarqueeComponent implements OnInit, AfterViewInit {
-    duration: string | number;
-    animationElem: ElementRef<HTMLDivElement>;
-    constructor();
-    private updateDuration;
+import { OnInit } from '@angular/core';
+declare enum MarqueeDirection {
+    left = "left",
+    right = "right",
+    alternate = "alternate"
+}
+declare enum MarqueeSpeed {
+    drowsy = "drowsy",
+    slow = "slow",
+    normal = "normal",
+    fast = "fast",
+    swift = "swift",
+    hyper = "hyper"
+}
+export declare class NgMarqueeComponent implements OnInit {
+    speed: string | number;
+    direction: MarqueeDirection;
+    marqueeDirection: typeof MarqueeDirection;
+    marqueeSpeed: typeof MarqueeSpeed;
     ngOnInit(): void;
-    ngAfterViewInit(): void;
 }
+export {};

ng-marquee.metadata.json

@@ -1,1 +0,1 @@
-{"__symbolic":"module","version":4,"metadata":{"NgMarqueeComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":2,"character":1},"arguments":[{"selector":"ng-marquee","changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":6,"character":19},"member":"OnPush"},"template":"<div class=\"ng-marquee-wrapper\">\n  <div #marqueeContainer>\n      <ng-content></ng-content>\n  </div>\n</div>","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%{transform:translateX(0)}100%{transform:translateX(-100%)}}@keyframes marqueeAnimation{0%{transform:translateX(0)}100%{transform:translateX(-100%)}}@media (max-width:500px){.ng-marquee-wrapper>div{width:100%;height:100%;margin:0;transform:translateX(100%);-webkit-animation:9s linear 1s infinite marqueeAnimation;animation:9s linear 1s infinite marqueeAnimation;white-space:nowrap}}"]}]}],"members":{"duration":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":10,"character":3}}]}],"animationElem":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":11,"character":3},"arguments":["marqueeContainer",{"static":true}]}]}],"__ctor__":[{"__symbolic":"constructor"}],"updateDuration":[{"__symbolic":"method"}],"ngOnInit":[{"__symbolic":"method"}],"ngAfterViewInit":[{"__symbolic":"method"}]}},"NgMarqueeModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":3,"character":1},"arguments":[{"imports":[],"declarations":[{"__symbolic":"reference","name":"NgMarqueeComponent"}],"exports":[{"__symbolic":"reference","name":"NgMarqueeComponent"}]}]}],"members":{}}},"origins":{"NgMarqueeComponent":"./lib/ng-marquee/ng-marquee.component","NgMarqueeModule":"./lib/ng-marquee.module"},"importAs":"ng-marquee"}
+{"__symbolic":"module","version":4,"metadata":{"NgMarqueeComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":17,"character":1},"arguments":[{"selector":"ng-marquee","changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":21,"character":19},"member":"OnPush"},"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}\">\n  <span>\n    <ng-content></ng-content>\n  </span>\n</div>","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-custom>span{-webkit-animation-duration:inherit;animation-duration:inherit}.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}@-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}"]}]}],"members":{"speed":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":25,"character":3}}]}],"direction":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":26,"character":3}}]}],"ngOnInit":[{"__symbolic":"method"}]}},"NgMarqueeModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":4,"character":1},"arguments":[{"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":6,"character":4}],"declarations":[{"__symbolic":"reference","name":"NgMarqueeComponent"}],"exports":[{"__symbolic":"reference","name":"NgMarqueeComponent"}]}]}],"members":{}}},"origins":{"NgMarqueeComponent":"./lib/ng-marquee/ng-marquee.component","NgMarqueeModule":"./lib/ng-marquee.module"},"importAs":"ng-marquee"}

package.json

 {
   "name": "ng-marquee",
-  "version": "8.0.0",
+  "version": "9.2.0",
   "description": "Angular 8+ CSS Marquee (Alternative To HTML Marquee Tag)",
@@ -5,0 +5,0 @@ "keywords": [

README.md

 # ng-marquee
-Angular 8+ Component For Marquee Text
+Angular 6+ Component For Marquee Text 
 
@@ -8,2 +8,3 @@ [![Donate](https://img.shields.io/badge/Donate-PayPal-green.svg)](https://paypal.me/shivarajnaidu)
 
+
 ## How to:
@@ -51,10 +52,19 @@
 
-### input property
+### input properties
 
-###
-`duration` property available for controlling speed of text movement
-(default value is 25 in seconds)
+### @Input() speed
+  `speed` property available for controlling speed of text movement
 
+#### possible values
+* drowsy
+* slow
+* normal
+* fast
+* swift
+* hyper
+
+### Example
+
 ```html
-<ng-marquee duration="30">
+<ng-marquee speed="drowsy">
     <mark>Hello, World.... Find Me @ <a href="https://www.linkedin.com/in/shivarajnaidu/" target="__blank"> https://www.linkedin.com/in/shivarajnaidu/ (Yuvaraj)</a></mark>
@@ -64,3 +74,30 @@ </ng-marquee>
 
+### @Input() direction
+  `direction` property available for controlling direction of movement
+
+#### possible values
+* left
+* right
+* alternate
+
+### Example
+
+```html
+<ng-marquee direction="right">
+    <mark>Hello, World.... Find Me @ <a href="https://www.linkedin.com/in/shivarajnaidu/" target="__blank"> https://www.linkedin.com/in/shivarajnaidu/ (Yuvaraj)</a></mark>
+</ng-marquee>
+```
+
+## To Build the component
+
+```sh
+ng build ng-marquee
+```
+
 ## Any contributions are appreciated.
-[![paypal](https://www.paypalobjects.com/en_US/i/btn/btn_donateCC_LG.gif)](https://paypal.me/shivarajnaidu)
+[![paypal](https://www.paypalobjects.com/en_US/i/btn/btn_donateCC_LG.gif)](https://paypal.me/shivarajnaidu)
+
+
+
+**Inspired by** [https://github.com/muchweb/html5-marquee]( muchweb /
+html5-marquee ) 

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Long strings

Supply chain risk

Contains long string literals, which may be a sign of obfuscated or packed code.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

81655

increased by93.71%

Lines of code

631

increased by32.29%

Number of lines in readme file

100

increased by58.73%

Worsened metrics

Number of low supply chain risk alerts

6

increased byInfinity%

Number of medium supply chain risk alerts

1

increased byInfinity%

No dependency changes