@sarthak03dot/romantic-animations 1.2.0 → 1.2.1

package/src/animations/butterfly.js

@@ -1,92 +1,92 @@
-import { mergeOptions } from '../core/engine.js';
-
-const DEFAULTS = {
-  density: 0.05,        // Spawn probability per frame
-  colors: ['#c77dff', '#ff85a1', '#ffc2d1', '#48cae4', '#e7c6ff', '#fbb1bd'],
-  minSize: 10,
-  maxSize: 22,
-  minSpeed: 0.8,
-  maxSpeed: 2.2,
-  glow: true,
-};
-
-export function butterflies(canvas, userOptions = {}) {
-  const opts = mergeOptions(DEFAULTS, userOptions);
-  const ctx = canvas.getContext('2d');
-  const items = [];
-  let running = true;
-  let time = 0;
-
-  function spawn() {
-    const size = opts.minSize + Math.random() * (opts.maxSize - opts.minSize);
-    return {
-      x: -size * 2,
-      y: canvas.height * 0.1 + Math.random() * (canvas.height * 0.8),
-      size,
-      speed: opts.minSpeed + Math.random() * (opts.maxSpeed - opts.minSpeed),
-      color: opts.colors[Math.floor(Math.random() * opts.colors.length)],
-      alpha: 0,
-      flapSpeed: 0.1 + Math.random() * 0.15,
-      flapOffset: Math.random() * Math.PI * 2,
-      wobbleSpeed: 0.01 + Math.random() * 0.02,
-      wobbleOffset: Math.random() * Math.PI * 2,
-    };
-  }
-
-  function animate() {
-    if (!running) return;
-    time++;
-    ctx.clearRect(0, 0, canvas.width, canvas.height);
-
-    if (Math.random() < opts.density) items.push(spawn());
-
-    for (let i = items.length - 1; i >= 0; i--) {
-      const b = items[i];
-      b.x += b.speed;
-      b.y += Math.sin(time * b.wobbleSpeed + b.wobbleOffset) * 1.5;
-      
-      // Fade in smoothly
-      if (b.alpha < 1 && b.x < canvas.width / 2) b.alpha += 0.02;
-      
-      // Flapping wing calculation
-      const wingSpread = Math.abs(Math.sin(time * b.flapSpeed + b.flapOffset));
-
-      ctx.save();
-      ctx.globalAlpha = Math.min(1, b.alpha);
-      ctx.translate(b.x, b.y);
-      // Slight tilt upwards
-      ctx.rotate(-0.1 - (wingSpread * 0.1));
-      
-      if (opts.glow) {
-        ctx.shadowColor = b.color;
-        ctx.shadowBlur = b.size * 1.5;
-      }
-      ctx.fillStyle = b.color;
-      
-      // Draw wings
-      ctx.beginPath();
-      // Left/back wing (narrower based on wingSpread)
-      ctx.ellipse(-b.size * 0.2, 0, b.size * 0.4 * wingSpread, b.size * 0.5, 0.3, 0, Math.PI * 2);
-      ctx.fill();
-      
-      ctx.beginPath();
-      // Right/front wing
-      ctx.ellipse(b.size * 0.3 * wingSpread, -b.size * 0.1, b.size * 0.5 * wingSpread, b.size * 0.6, -0.2, 0, Math.PI * 2);
-      ctx.fill();
-      ctx.restore();
-
-      if (b.x > canvas.width + b.size * 2) {
-        items.splice(i, 1);
-      }
-    }
-
-    requestAnimationFrame(animate);
-  }
-
-  animate();
-
-  return function stop() {
-    running = false;
-    ctx.clearRect(0, 0, canvas.width, canvas.height);
-  };
-}
+import { mergeOptions } from '../core/engine.js';
+
+const DEFAULTS = {
+  density: 0.05,        // Spawn probability per frame
+  colors: ['#c77dff', '#ff85a1', '#ffc2d1', '#48cae4', '#e7c6ff', '#fbb1bd'],
+  minSize: 10,
+  maxSize: 22,
+  minSpeed: 0.8,
+  maxSpeed: 2.2,
+  glow: true,
+};
+
+export function butterflies(canvas, userOptions = {}) {
+  const opts = mergeOptions(DEFAULTS, userOptions);
+  const ctx = canvas.getContext('2d');
+  const items = [];
+  let running = true;
+  let time = 0;
+
+  function spawn() {
+    const size = opts.minSize + Math.random() * (opts.maxSize - opts.minSize);
+    return {
+      x: -size * 2,
+      y: canvas.height * 0.1 + Math.random() * (canvas.height * 0.8),
+      size,
+      speed: opts.minSpeed + Math.random() * (opts.maxSpeed - opts.minSpeed),
+      color: opts.colors[Math.floor(Math.random() * opts.colors.length)],
+      alpha: 0,
+      flapSpeed: 0.1 + Math.random() * 0.15,
+      flapOffset: Math.random() * Math.PI * 2,
+      wobbleSpeed: 0.01 + Math.random() * 0.02,
+      wobbleOffset: Math.random() * Math.PI * 2,
+    };
+  }
+
+  function animate() {
+    if (!running) return;
+    time++;
+    ctx.clearRect(0, 0, canvas.width, canvas.height);
+
+    if (Math.random() < opts.density) items.push(spawn());
+
+    for (let i = items.length - 1; i >= 0; i--) {
+      const b = items[i];
+      b.x += b.speed;
+      b.y += Math.sin(time * b.wobbleSpeed + b.wobbleOffset) * 1.5;
+      
+      // Fade in smoothly
+      if (b.alpha < 1 && b.x < canvas.width / 2) b.alpha += 0.02;
+      
+      // Flapping wing calculation
+      const wingSpread = Math.abs(Math.sin(time * b.flapSpeed + b.flapOffset));
+
+      ctx.save();
+      ctx.globalAlpha = Math.min(1, b.alpha);
+      ctx.translate(b.x, b.y);
+      // Slight tilt upwards
+      ctx.rotate(-0.1 - (wingSpread * 0.1));
+      
+      if (opts.glow) {
+        ctx.shadowColor = b.color;
+        ctx.shadowBlur = b.size * 1.5;
+      }
+      ctx.fillStyle = b.color;
+      
+      // Draw wings
+      ctx.beginPath();
+      // Left/back wing (narrower based on wingSpread)
+      ctx.ellipse(-b.size * 0.2, 0, b.size * 0.4 * wingSpread, b.size * 0.5, 0.3, 0, Math.PI * 2);
+      ctx.fill();
+      
+      ctx.beginPath();
+      // Right/front wing
+      ctx.ellipse(b.size * 0.3 * wingSpread, -b.size * 0.1, b.size * 0.5 * wingSpread, b.size * 0.6, -0.2, 0, Math.PI * 2);
+      ctx.fill();
+      ctx.restore();
+
+      if (b.x > canvas.width + b.size * 2) {
+        items.splice(i, 1);
+      }
+    }
+
+    requestAnimationFrame(animate);
+  }
+
+  animate();
+
+  return function stop() {
+    running = false;
+    ctx.clearRect(0, 0, canvas.width, canvas.height);
+  };
+}

package/src/animations/confetti.js

@@ -1,92 +1,92 @@
-import { mergeOptions } from '../core/engine.js';
-
-const DEFAULTS = {
-  density: 0.18,
-  colors: ['#ff6b8a','#ff4d6d','#ffd6ff','#e7c6ff','#c77dff','#48cae4','#ffe66d','#06d6a0'],
-  minSize: 6,
-  maxSize: 14,
-  minSpeed: 1.5,
-  maxSpeed: 4,
-  gravity: 0.06,
-  drag: 0.99,
-  shapes: ['rect', 'circle', 'ribbon'],
-};
-
-export function confetti(canvas, userOptions = {}) {
-  const opts = mergeOptions(DEFAULTS, userOptions);
-  const ctx = canvas.getContext('2d');
-  const pieces = [];
-  let running = true;
-
-  function createPiece() {
-    const size = opts.minSize + Math.random() * (opts.maxSize - opts.minSize);
-    const speed = opts.minSpeed + Math.random() * (opts.maxSpeed - opts.minSpeed);
-    return {
-      x: Math.random() * canvas.width,
-      y: -size * 2,
-      w: size,
-      h: size * (0.4 + Math.random() * 0.8),
-      vx: (Math.random() - 0.5) * 3,
-      vy: speed,
-      angle: Math.random() * Math.PI * 2,
-      spin: (Math.random() - 0.5) * 0.15,
-      color: opts.colors[Math.floor(Math.random() * opts.colors.length)],
-      alpha: 0.8 + Math.random() * 0.2,
-      shape: opts.shapes[Math.floor(Math.random() * opts.shapes.length)],
-    };
-  }
-
-  function drawPiece(p) {
-    ctx.save();
-    ctx.globalAlpha = p.alpha;
-    ctx.fillStyle = p.color;
-    ctx.strokeStyle = p.color;
-    ctx.translate(p.x, p.y);
-    ctx.rotate(p.angle);
-
-    if (p.shape === 'circle') {
-      ctx.beginPath();
-      ctx.ellipse(0, 0, p.w / 2, p.h / 2, 0, 0, Math.PI * 2);
-      ctx.fill();
-    } else if (p.shape === 'ribbon') {
-      ctx.beginPath();
-      ctx.moveTo(-p.w / 2, 0);
-      ctx.quadraticCurveTo(0, -p.h, p.w / 2, 0);
-      ctx.quadraticCurveTo(0, p.h, -p.w / 2, 0);
-      ctx.fill();
-    } else {
-      ctx.fillRect(-p.w / 2, -p.h / 2, p.w, p.h);
-    }
-    ctx.restore();
-  }
-
-  function animate() {
-    if (!running) return;
-    ctx.clearRect(0, 0, canvas.width, canvas.height);
-
-    if (Math.random() < opts.density) pieces.push(createPiece());
-
-    for (let i = pieces.length - 1; i >= 0; i--) {
-      const p = pieces[i];
-      p.vy += opts.gravity;
-      p.vx *= opts.drag;
-      p.vy *= opts.drag;
-      p.x += p.vx;
-      p.y += p.vy;
-      p.angle += p.spin;
-
-      drawPiece(p);
-
-      if (p.y > canvas.height + 20) pieces.splice(i, 1);
-    }
-
-    requestAnimationFrame(animate);
-  }
-
-  animate();
-
-  return function stop() {
-    running = false;
-    ctx.clearRect(0, 0, canvas.width, canvas.height);
-  };
-}
+import { mergeOptions } from '../core/engine.js';
+
+const DEFAULTS = {
+  density: 0.18,
+  colors: ['#ff6b8a','#ff4d6d','#ffd6ff','#e7c6ff','#c77dff','#48cae4','#ffe66d','#06d6a0'],
+  minSize: 6,
+  maxSize: 14,
+  minSpeed: 1.5,
+  maxSpeed: 4,
+  gravity: 0.06,
+  drag: 0.99,
+  shapes: ['rect', 'circle', 'ribbon'],
+};
+
+export function confetti(canvas, userOptions = {}) {
+  const opts = mergeOptions(DEFAULTS, userOptions);
+  const ctx = canvas.getContext('2d');
+  const pieces = [];
+  let running = true;
+
+  function createPiece() {
+    const size = opts.minSize + Math.random() * (opts.maxSize - opts.minSize);
+    const speed = opts.minSpeed + Math.random() * (opts.maxSpeed - opts.minSpeed);
+    return {
+      x: Math.random() * canvas.width,
+      y: -size * 2,
+      w: size,
+      h: size * (0.4 + Math.random() * 0.8),
+      vx: (Math.random() - 0.5) * 3,
+      vy: speed,
+      angle: Math.random() * Math.PI * 2,
+      spin: (Math.random() - 0.5) * 0.15,
+      color: opts.colors[Math.floor(Math.random() * opts.colors.length)],
+      alpha: 0.8 + Math.random() * 0.2,
+      shape: opts.shapes[Math.floor(Math.random() * opts.shapes.length)],
+    };
+  }
+
+  function drawPiece(p) {
+    ctx.save();
+    ctx.globalAlpha = p.alpha;
+    ctx.fillStyle = p.color;
+    ctx.strokeStyle = p.color;
+    ctx.translate(p.x, p.y);
+    ctx.rotate(p.angle);
+
+    if (p.shape === 'circle') {
+      ctx.beginPath();
+      ctx.ellipse(0, 0, p.w / 2, p.h / 2, 0, 0, Math.PI * 2);
+      ctx.fill();
+    } else if (p.shape === 'ribbon') {
+      ctx.beginPath();
+      ctx.moveTo(-p.w / 2, 0);
+      ctx.quadraticCurveTo(0, -p.h, p.w / 2, 0);
+      ctx.quadraticCurveTo(0, p.h, -p.w / 2, 0);
+      ctx.fill();
+    } else {
+      ctx.fillRect(-p.w / 2, -p.h / 2, p.w, p.h);
+    }
+    ctx.restore();
+  }
+
+  function animate() {
+    if (!running) return;
+    ctx.clearRect(0, 0, canvas.width, canvas.height);
+
+    if (Math.random() < opts.density) pieces.push(createPiece());
+
+    for (let i = pieces.length - 1; i >= 0; i--) {
+      const p = pieces[i];
+      p.vy += opts.gravity;
+      p.vx *= opts.drag;
+      p.vy *= opts.drag;
+      p.x += p.vx;
+      p.y += p.vy;
+      p.angle += p.spin;
+
+      drawPiece(p);
+
+      if (p.y > canvas.height + 20) pieces.splice(i, 1);
+    }
+
+    requestAnimationFrame(animate);
+  }
+
+  animate();
+
+  return function stop() {
+    running = false;
+    ctx.clearRect(0, 0, canvas.width, canvas.height);
+  };
+}

package/src/animations/fireworks.js

@@ -1,112 +1,112 @@
-import { mergeOptions } from '../core/engine.js';
-
-const DEFAULTS = {
-  interval: 1200,       // ms between auto-launches
-  trailLength: 28,
-  particleCount: 80,
-  colors: ['#ff6b8a','#ff4d6d','#ffd6ff','#e7c6ff','#ffe66d','#06d6a0','#48cae4','#ffffff'],
-  gravity: 0.09,
-  decay: 0.014,
-  glow: true,
-};
-
-export function fireworks(canvas, userOptions = {}) {
-  const opts = mergeOptions(DEFAULTS, userOptions);
-  const ctx = canvas.getContext('2d');
-  let running = true;
-
-  const rockets = [];    // { x, y, vx, vy, trail[], color }
-  const particles = [];  // burst particles
-
-  function launchRocket() {
-    const x = canvas.width * (0.2 + Math.random() * 0.6);
-    const targetY = canvas.height * (0.1 + Math.random() * 0.4);
-    const dy = targetY - canvas.height;
-    const speed = 8 + Math.random() * 5;
-    const color = opts.colors[Math.floor(Math.random() * opts.colors.length)];
-    rockets.push({ x, y: canvas.height, vy: -Math.abs(speed), targetY, trail: [], color });
-  }
-
-  function burst(x, y, color) {
-    for (let i = 0; i < opts.particleCount; i++) {
-      const angle = Math.random() * Math.PI * 2;
-      const speed = 1 + Math.random() * 5;
-      particles.push({
-        x, y,
-        vx: Math.cos(angle) * speed,
-        vy: Math.sin(angle) * speed,
-        alpha: 1,
-        decay: opts.decay * (0.7 + Math.random() * 0.6),
-        size: 2 + Math.random() * 3,
-        color,
-      });
-    }
-  }
-
-  // Auto-launch interval
-  const iv = setInterval(() => { if (running) launchRocket(); }, opts.interval);
-  launchRocket(); // fire one immediately
-
-  function animate() {
-    if (!running) return;
-
-    // Clear canvas instead of using a solid fill to keep background transparent
-    ctx.clearRect(0, 0, canvas.width, canvas.height);
-
-    // Draw rockets
-    for (let i = rockets.length - 1; i >= 0; i--) {
-      const r = rockets[i];
-      r.y += r.vy;
-      r.trail.push({ x: r.x, y: r.y });
-      if (r.trail.length > opts.trailLength) r.trail.shift();
-
-      // Draw trail
-      for (let t = 0; t < r.trail.length; t++) {
-        const alpha = (t / r.trail.length) * 0.8;
-        ctx.save();
-        ctx.globalAlpha = alpha;
-        if (opts.glow) { ctx.shadowColor = r.color; ctx.shadowBlur = 6; }
-        ctx.fillStyle = r.color;
-        ctx.beginPath();
-        ctx.arc(r.trail[t].x, r.trail[t].y, 2.5 * (t / r.trail.length), 0, Math.PI * 2);
-        ctx.fill();
-        ctx.restore();
-      }
-
-      if (r.y <= r.targetY) {
-        burst(r.x, r.y, r.color);
-        rockets.splice(i, 1);
-      }
-    }
-
-    // Draw burst particles
-    for (let i = particles.length - 1; i >= 0; i--) {
-      const p = particles[i];
-      p.x += p.vx;
-      p.y += p.vy;
-      p.vy += opts.gravity;
-      p.alpha -= p.decay;
-
-      ctx.save();
-      ctx.globalAlpha = Math.max(0, p.alpha);
-      if (opts.glow) { ctx.shadowColor = p.color; ctx.shadowBlur = p.size * 2; }
-      ctx.fillStyle = p.color;
-      ctx.beginPath();
-      ctx.arc(p.x, p.y, p.size, 0, Math.PI * 2);
-      ctx.fill();
-      ctx.restore();
-
-      if (p.alpha <= 0) particles.splice(i, 1);
-    }
-
-    requestAnimationFrame(animate);
-  }
-
-  animate();
-
-  return function stop() {
-    running = false;
-    clearInterval(iv);
-    ctx.clearRect(0, 0, canvas.width, canvas.height);
-  };
-}
+import { mergeOptions } from '../core/engine.js';
+
+const DEFAULTS = {
+  interval: 1200,       // ms between auto-launches
+  trailLength: 28,
+  particleCount: 80,
+  colors: ['#ff6b8a','#ff4d6d','#ffd6ff','#e7c6ff','#ffe66d','#06d6a0','#48cae4','#ffffff'],
+  gravity: 0.09,
+  decay: 0.014,
+  glow: true,
+};
+
+export function fireworks(canvas, userOptions = {}) {
+  const opts = mergeOptions(DEFAULTS, userOptions);
+  const ctx = canvas.getContext('2d');
+  let running = true;
+
+  const rockets = [];    // { x, y, vx, vy, trail[], color }
+  const particles = [];  // burst particles
+
+  function launchRocket() {
+    const x = canvas.width * (0.2 + Math.random() * 0.6);
+    const targetY = canvas.height * (0.1 + Math.random() * 0.4);
+    const dy = targetY - canvas.height;
+    const speed = 8 + Math.random() * 5;
+    const color = opts.colors[Math.floor(Math.random() * opts.colors.length)];
+    rockets.push({ x, y: canvas.height, vy: -Math.abs(speed), targetY, trail: [], color });
+  }
+
+  function burst(x, y, color) {
+    for (let i = 0; i < opts.particleCount; i++) {
+      const angle = Math.random() * Math.PI * 2;
+      const speed = 1 + Math.random() * 5;
+      particles.push({
+        x, y,
+        vx: Math.cos(angle) * speed,
+        vy: Math.sin(angle) * speed,
+        alpha: 1,
+        decay: opts.decay * (0.7 + Math.random() * 0.6),
+        size: 2 + Math.random() * 3,
+        color,
+      });
+    }
+  }
+
+  // Auto-launch interval
+  const iv = setInterval(() => { if (running) launchRocket(); }, opts.interval);
+  launchRocket(); // fire one immediately
+
+  function animate() {
+    if (!running) return;
+
+    // Clear canvas instead of using a solid fill to keep background transparent
+    ctx.clearRect(0, 0, canvas.width, canvas.height);
+
+    // Draw rockets
+    for (let i = rockets.length - 1; i >= 0; i--) {
+      const r = rockets[i];
+      r.y += r.vy;
+      r.trail.push({ x: r.x, y: r.y });
+      if (r.trail.length > opts.trailLength) r.trail.shift();
+
+      // Draw trail
+      for (let t = 0; t < r.trail.length; t++) {
+        const alpha = (t / r.trail.length) * 0.8;
+        ctx.save();
+        ctx.globalAlpha = alpha;
+        if (opts.glow) { ctx.shadowColor = r.color; ctx.shadowBlur = 6; }
+        ctx.fillStyle = r.color;
+        ctx.beginPath();
+        ctx.arc(r.trail[t].x, r.trail[t].y, 2.5 * (t / r.trail.length), 0, Math.PI * 2);
+        ctx.fill();
+        ctx.restore();
+      }
+
+      if (r.y <= r.targetY) {
+        burst(r.x, r.y, r.color);
+        rockets.splice(i, 1);
+      }
+    }
+
+    // Draw burst particles
+    for (let i = particles.length - 1; i >= 0; i--) {
+      const p = particles[i];
+      p.x += p.vx;
+      p.y += p.vy;
+      p.vy += opts.gravity;
+      p.alpha -= p.decay;
+
+      ctx.save();
+      ctx.globalAlpha = Math.max(0, p.alpha);
+      if (opts.glow) { ctx.shadowColor = p.color; ctx.shadowBlur = p.size * 2; }
+      ctx.fillStyle = p.color;
+      ctx.beginPath();
+      ctx.arc(p.x, p.y, p.size, 0, Math.PI * 2);
+      ctx.fill();
+      ctx.restore();
+
+      if (p.alpha <= 0) particles.splice(i, 1);
+    }
+
+    requestAnimationFrame(animate);
+  }
+
+  animate();
+
+  return function stop() {
+    running = false;
+    clearInterval(iv);
+    ctx.clearRect(0, 0, canvas.width, canvas.height);
+  };
+}