Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More →
node-marquee
Advanced tools
node-marquee - npm Package Compare versions
Comparing version 1.0.21 to 1.0.23
@@ -11,2 +11,2 @@ /* | ||
| */ | ||
| !function(t){var r={};function i(e){if(r[e])return r[e].exports;var n=r[e]={i:e,l:!1,exports:{}};return t[e].call(n.exports,n,n.exports,i),n.l=!0,n.exports}i.m=t,i.c=r,i.d=function(e,n,t){i.o(e,n)||Object.defineProperty(e,n,{enumerable:!0,get:t})},i.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},i.t=function(n,e){if(1&e&&(n=i(n)),8&e)return n;if(4&e&&"object"==typeof n&&n&&n.__esModule)return n;var t=Object.create(null);if(i.r(t),Object.defineProperty(t,"default",{enumerable:!0,value:n}),2&e&&"string"!=typeof n)for(var r in n)i.d(t,r,function(e){return n[e]}.bind(null,r));return t},i.n=function(e){var n=e&&e.__esModule?function(){return e.default}:function(){return e};return i.d(n,"a",n),n},i.o=function(e,n){return Object.prototype.hasOwnProperty.call(e,n)},i.p="/",i(i.s=0)}([function(e,n,t){"use strict";function g(e){if("undefined"==typeof Symbol||null==e[Symbol.iterator]){if(Array.isArray(e)||(e=function(e,n){if(!e)return;if("string"==typeof e)return u(e,n);var t=Object.prototype.toString.call(e).slice(8,-1);"Object"===t&&e.constructor&&(t=e.constructor.name);if("Map"===t||"Set"===t)return Array.from(t);if("Arguments"===t||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t))return u(e,n)}(e))){var n=0,t=function(){};return{s:t,n:function(){return n>=e.length?{done:!0}:{done:!1,value:e[n++]}},e:function(e){throw e},f:t}}throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}var r,i,o=!0,a=!1;return{s:function(){r=e[Symbol.iterator]()},n:function(){var e=r.next();return o=e.done,e},e:function(e){a=!0,i=e},f:function(){try{o||null==r.return||r.return()}finally{if(a)throw i}}}}function u(e,n){(null==n||n>e.length)&&(n=e.length);for(var t=0,r=new Array(n);t<n;t++)r[t]=e[t];return r}t.r(n);function r(e){var o=0<arguments.length&&void 0!==e?e:{};o=Object.assign({selector:".node-marquee",speed:1,autoplay:!0},o);var n,a=(n=o.selector)instanceof HTMLElement||n instanceof Window?n:document.querySelector(n);if(null==a)return!1;a.classList.add("node-marquee");var u=a.innerText,l=0,c=[],s=0,t=!1,r=5,i=!1;function d(){i&&i.disconnect()}p();var f=p.bind(this);window.addEventListener("resize",f,!1);var y=!1;function p(){d(),l=0,c=[],a.innerHTML="",a.style.position="relative",a.style.width="100%",a.style.overflow="hidden",a.style.whiteSpace="nowrap";var e=v().clientWidth;e<a.clientWidth&&(l=Math.ceil(a.clientWidth/e)),l<r&&(l=r);for(var n=0;n<l-1;n++)v(!0,!0);h(),(i=new MutationObserver(function(e){var n,t=g(e);try{for(t.s();!(n=t.n()).done;){"childList"===n.value.type&&(u=a.innerText,p())}}catch(e){t.e(e)}finally{t.f()}})).observe(a,{childList:!0})}function v(e,n){var t=0<arguments.length&&void 0!==e&&e,r=1<arguments.length&&void 0!==n&&n,i=document.createElement("div");return i.classList.add("node-marquee__el"),i.innerHTML=r?" "+u:u,t&&(i.style.position="absolute",i.style.top="0",i.style.left="0"),i.style.display="inline-block",a.appendChild(i),c.push(i),i}function b(){h(),t&&(y=window.requestAnimationFrame(b.bind(this)))}function h(){s+=o.speed;for(var e=!1,n=0,t=0;t<l;t++){var r=c[t],i=n-s;n+=r.clientWidth,r.style.transform="translate(".concat(i,"px, 0)"),i<-1*r.clientWidth&&(e=r)}e&&(c.push(c.splice(c.indexOf(e),1)[0]),s-=e.clientWidth)}function m(){y||(t=!0,y=window.requestAnimationFrame(b.bind(this)))}function w(){t=!1,y&&(window.cancelAnimationFrame(y),y=!1)}return o.autoplay&&m(),{play:m.bind(this),pause:w.bind(this),destroy:function(){w(),d(),a.innerHTML=u}.bind(this),render:b.bind(this)}}window.nodeMarquee=r}]); | ||
| !function(t){var r={};function i(e){if(r[e])return r[e].exports;var n=r[e]={i:e,l:!1,exports:{}};return t[e].call(n.exports,n,n.exports,i),n.l=!0,n.exports}i.m=t,i.c=r,i.d=function(e,n,t){i.o(e,n)||Object.defineProperty(e,n,{enumerable:!0,get:t})},i.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},i.t=function(n,e){if(1&e&&(n=i(n)),8&e)return n;if(4&e&&"object"==typeof n&&n&&n.__esModule)return n;var t=Object.create(null);if(i.r(t),Object.defineProperty(t,"default",{enumerable:!0,value:n}),2&e&&"string"!=typeof n)for(var r in n)i.d(t,r,function(e){return n[e]}.bind(null,r));return t},i.n=function(e){var n=e&&e.__esModule?function(){return e.default}:function(){return e};return i.d(n,"a",n),n},i.o=function(e,n){return Object.prototype.hasOwnProperty.call(e,n)},i.p="/",i(i.s=0)}([function(e,n,t){"use strict";function L(e){if("undefined"==typeof Symbol||null==e[Symbol.iterator]){if(Array.isArray(e)||(e=function(e,n){if(!e)return;if("string"==typeof e)return u(e,n);var t=Object.prototype.toString.call(e).slice(8,-1);"Object"===t&&e.constructor&&(t=e.constructor.name);if("Map"===t||"Set"===t)return Array.from(t);if("Arguments"===t||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t))return u(e,n)}(e))){var n=0,t=function(){};return{s:t,n:function(){return n>=e.length?{done:!0}:{done:!1,value:e[n++]}},e:function(e){throw e},f:t}}throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}var r,i,o=!0,a=!1;return{s:function(){r=e[Symbol.iterator]()},n:function(){var e=r.next();return o=e.done,e},e:function(e){a=!0,i=e},f:function(){try{o||null==r.return||r.return()}finally{if(a)throw i}}}}function u(e,n){(null==n||n>e.length)&&(n=e.length);for(var t=0,r=new Array(n);t<n;t++)r[t]=e[t];return r}t.r(n);function r(e){var o=0<arguments.length&&void 0!==e?e:{};o=Object.assign({selector:".node-marquee",speed:1,autoplay:!0,pauseOnHover:!1},o);var n,a=(n=o.selector)instanceof HTMLElement||n instanceof Window?n:document.querySelector(n);if(null==a)return!1;a.classList.add("node-marquee");var u=a.innerText,l=0,s=[],c=0,t=!1,r=4,i=!1;function d(){i&&i.disconnect()}m();var f=m.bind(this);window.addEventListener("resize",f,!1);var v=function(){o.pauseOnHover&&O()};a.addEventListener("mouseenter",v,!1);var p=function(){o.pauseOnHover&&g()};a.addEventListener("mouseleave",p,!1);var y=!1;function m(){d(),l=0,s=[],a.innerHTML="",a.style.position="relative",a.style.width="100%",a.style.overflow="hidden",a.style.whiteSpace="nowrap";var e=b().clientWidth;e<a.clientWidth&&(l=Math.ceil(1.5*a.clientWidth/e)),l<r&&(l=r);for(var n=0;n<l-1;n++)b(!0,!0);w(),(i=new MutationObserver(function(e){var n,t=L(e);try{for(t.s();!(n=t.n()).done;){"childList"===n.value.type&&(u=a.innerText,m())}}catch(e){t.e(e)}finally{t.f()}})).observe(a,{childList:!0})}function b(e,n){var t=0<arguments.length&&void 0!==e&&e,r=1<arguments.length&&void 0!==n&&n,i=document.createElement("div");return i.classList.add("node-marquee__el"),i.innerHTML=r?" "+u:u,t&&(i.style.position="absolute",i.style.top="0",i.style.left="0"),i.style.display="inline-block",a.appendChild(i),s.push(i),i}function h(){w(),t&&(y=window.requestAnimationFrame(h.bind(this)))}function w(){c+=o.speed;for(var e=!1,n=0,t=0;t<l;t++){var r=s[t],i=n-c;n+=r.clientWidth,r.style.transform="translate(".concat(i,"px, 0)"),i<-1*r.clientWidth&&(e=r)}e&&(s.push(s.splice(s.indexOf(e),1)[0]),c-=e.clientWidth)}function g(){y||(t=!0,y=window.requestAnimationFrame(h.bind(this)))}function O(){t=!1,y&&(window.cancelAnimationFrame(y),y=!1)}return o.autoplay&&g(),{play:g.bind(this),pause:O.bind(this),destroy:function(){O(),d(),window.removeEventListener("resize",f,!1),a.removeEventListener("mouseenter",v,!1),a.removeEventListener("mouseleave",p,!1),a.innerHTML=u}.bind(this),render:h.bind(this)}}window.nodeMarquee=r}]); |
@@ -23,2 +23,3 @@ "use strict"; | ||
| * @property {boolean} [autoplay=true] If you want the marquee element to start moving after its initializing. | ||
| * @property {boolean} [pauseOnHover=false] Stop the marquee on hover. | ||
| */ | ||
@@ -39,3 +40,3 @@ | ||
| * @param {Prop} prop | ||
| * @returns {Returns} Returns a set of methods. | ||
| * @returns { Returns | false } Returns a set of methods. | ||
| */ | ||
@@ -48,3 +49,4 @@ function nodeMarquee() { | ||
| speed: 1, | ||
| autoplay: true | ||
| autoplay: true, | ||
| pauseOnHover: false | ||
| }; | ||
@@ -68,3 +70,3 @@ prop = Object.assign(DEFAULT_PROP, prop); // check if the element exists | ||
| isPlaying = false; | ||
| var MIN_AMOUNT = 5; // observe changes in DOM | ||
| var MIN_AMOUNT = 4; // observe changes in DOM | ||
@@ -114,4 +116,20 @@ var observer = false; | ||
| var RESIZE_LISTENER_FUNCTION = create.bind(this); | ||
| window.addEventListener("resize", RESIZE_LISTENER_FUNCTION, false); // animation frame | ||
| window.addEventListener("resize", RESIZE_LISTENER_FUNCTION, false); // add mouse enter events | ||
| var MOUSE_ENTER_LISTENER_FUNCTION = function MOUSE_ENTER_LISTENER_FUNCTION() { | ||
| if (prop.pauseOnHover) { | ||
| pause(); | ||
| } | ||
| }; | ||
| OUTER.addEventListener("mouseenter", MOUSE_ENTER_LISTENER_FUNCTION, false); // add mouse leave events | ||
| var MOUSE_LEAVE_LISTENER_FUNCTION = function MOUSE_LEAVE_LISTENER_FUNCTION() { | ||
| if (prop.pauseOnHover) { | ||
| play(); | ||
| } | ||
| }; | ||
| OUTER.addEventListener("mouseleave", MOUSE_LEAVE_LISTENER_FUNCTION, false); // animation frame | ||
| var animationFrame = false; | ||
@@ -142,3 +160,3 @@ | ||
| if (width < OUTER.clientWidth) { | ||
| quantity = Math.ceil(OUTER.clientWidth / width); | ||
| quantity = Math.ceil(OUTER.clientWidth * 1.5 / width); | ||
| } | ||
@@ -240,2 +258,5 @@ | ||
| disconnectMutations(); | ||
| window.removeEventListener("resize", RESIZE_LISTENER_FUNCTION, false); | ||
| OUTER.removeEventListener("mouseenter", MOUSE_ENTER_LISTENER_FUNCTION, false); | ||
| OUTER.removeEventListener("mouseleave", MOUSE_LEAVE_LISTENER_FUNCTION, false); | ||
| OUTER.innerHTML = text; | ||
@@ -242,0 +263,0 @@ } |
@@ -7,2 +7,3 @@ export = nodeMarquee; | ||
| * @property {boolean} [autoplay=true] If you want the marquee element to start moving after its initializing. | ||
| * @property {boolean} [pauseOnHover=false] Stop the marquee on hover. | ||
| */ | ||
@@ -13,2 +14,3 @@ declare type Prop = { | ||
| autoplay?: boolean; | ||
| pauseOnHover?: boolean; | ||
| }; | ||
@@ -35,5 +37,5 @@ | ||
| * @param {Prop} prop | ||
| * @returns {Returns} Returns a set of methods. | ||
| * @returns { Returns | false } Returns a set of methods. | ||
| */ | ||
| declare function nodeMarquee(prop: Prop): Returns; | ||
| declare function nodeMarquee(prop: Prop): Returns | false; | ||
| { | ||
| "name": "node-marquee", | ||
| "version": "1.0.21", | ||
| "version": "1.0.23", | ||
| "description": "Custom Marquee element with JavaScript", | ||
@@ -5,0 +5,0 @@ "main": "dist/index.js", |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
New alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Fixed alerts
License Policy Violation
LicenseThis 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
- increased by0.32%
648406
- Lines of code
- increased by1.45%
1329
No dependency changes