dom-confetti - npm Package Compare versions

Comparing version 0.1.0 to 0.1.1

index.d.ts

@@ -6,2 +6,5 @@ interface ConfettiConfig {
     height?: number;
+    duration?: number;
+    dragFriction?: number;
+    stagger?: number;
     startVelocity?: number;
@@ -8,0 +11,0 @@ elementCount?: number;

lib/main.js

@@ -72,3 +72,3 @@ "use strict";
 
-function animate(root, fettis, dragFriction, decay, duration, delay) {
+function animate(root, fettis, dragFriction, decay, duration, stagger) {
   var startTime = void 0;
@@ -81,3 +81,3 @@
       var progress = startTime === time ? 0 : (time - startTime) / duration;
-      fettis.slice(0, Math.ceil(elapsed / delay)).forEach(function (fetti) {
+      fettis.slice(0, Math.ceil(elapsed / stagger)).forEach(function (fetti) {
         updateFetti(fetti, progress, dragFriction, decay);
@@ -111,3 +111,3 @@ });
   duration: 3000,
-  delay: 0,
+  stagger: 0,
   dragFriction: 0.1,
@@ -117,6 +117,13 @@ random: Math.random
 
+function backwardPatch(config) {
+  if (!config.stagger && config.delay) {
+    config.stagger = config.delay;
+  }
+  return config;
+}
+
 function confetti(root) {
   var config = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
 
-  var _Object$assign = Object.assign({}, defaults, config),
+  var _Object$assign = Object.assign({}, defaults, backwardPatch(config)),
       elementCount = _Object$assign.elementCount,
@@ -132,3 +139,3 @@ colors = _Object$assign.colors,
       duration = _Object$assign.duration,
-      delay = _Object$assign.delay,
+      stagger = _Object$assign.stagger,
       random = _Object$assign.random;
@@ -144,3 +151,3 @@
 
-  return animate(root, fettis, dragFriction, decay, duration, delay);
+  return animate(root, fettis, dragFriction, decay, duration, stagger);
 }

package.json

 {
   "name": "dom-confetti",
-  "version": "0.1.0",
+  "version": "0.1.1",
   "description": "confetti with dom elements",
@@ -5,0 +5,0 @@ "main": "lib/main.js",

README.md

@@ -36,2 +36,3 @@ # dom-confetti
 - `duration` - Duration in milliseconds, defaults to 3000
+- `stagger` - Delay for each fetti in milliseconds, defaults to 0.
 - `random` - Randomization function, defaults to Math.random
@@ -38,0 +39,0 @@ - `colors` - An array of color codes, defaults to `['#a864fd', '#29cdff', '#78ff44', '#ff718d' '#fdff6a']`

src/main.js

@@ -61,3 +61,3 @@ const defaultColors = ["#a864fd", "#29cdff", "#78ff44", "#ff718d", "#fdff6a"];
 
-function animate(root, fettis, dragFriction, decay, duration, delay) {
+function animate(root, fettis, dragFriction, decay, duration, stagger) {
   let startTime;
@@ -70,3 +70,3 @@
       const progress = startTime === time ? 0 : (time - startTime) / duration;
-      fettis.slice(0, Math.ceil(elapsed / delay)).forEach(fetti => {
+      fettis.slice(0, Math.ceil(elapsed / stagger)).forEach(fetti => {
         updateFetti(fetti, progress, dragFriction, decay);
@@ -100,3 +100,3 @@ });
   duration: 3000,
-  delay: 0,
+  stagger: 0,
   dragFriction: 0.1,
@@ -106,2 +106,9 @@ random: Math.random
 
+function backwardPatch(config) {
+  if (!config.stagger && config.delay) {
+    config.stagger = config.delay;
+  }
+  return config;
+}
+
 export function confetti(root, config = {}) {
@@ -119,5 +126,5 @@ const {
     duration,
-    delay,
+    stagger,
     random
-  } = Object.assign({}, defaults, config);
+  } = Object.assign({}, defaults, backwardPatch(config));
   const elements = createElements(root, elementCount, colors, width, height);
@@ -129,3 +136,3 @@ const fettis = elements.map(element => ({
 
-  return animate(root, fettis, dragFriction, decay, duration, delay);
+  return animate(root, fettis, dragFriction, decay, duration, stagger);
 }

No alert changes

Improved metrics

Total package byte prevSize

11790

increased by4.03%

Lines of code

279

increased by5.68%

Number of lines in readme file

43

increased by2.38%

No dependency changes