asciify-engine 1.0.13 → 1.0.14

package/dist/index.cjs

@@ -832,7 +832,7 @@ async function asciifyVideo(source, canvas, { fontSize = 10, style = "classic",
     cancelAnimationFrame(animId);
   };
 }
-var EMBED_CDN_VERSION = "1.0.12";
+var EMBED_CDN_VERSION = "1.0.14";
 function buildEmbedOpts(options, rows, cols, width, height, fps, animated) {
   const o = {
     r: rows,
@@ -999,6 +999,127 @@ function renderWaveBackground(ctx, width, height, time, mousePos = { x: 0.5, y:
     }
   }
 }
+function renderRainBackground(ctx, width, height, time, options = {}) {
+  const {
+    fontSize = 13,
+    chars = "0123456789ABCDEF@#$&*+=/<>",
+    accentColor = "#d4ff00",
+    color,
+    speed = 1,
+    density = 0.55,
+    tailLength = 14,
+    lightMode = false
+  } = options;
+  const charW = fontSize * 0.62;
+  const lineH = fontSize * 1.4;
+  const cols = Math.ceil(width / charW);
+  const rows = Math.ceil(height / lineH);
+  ctx.clearRect(0, 0, width, height);
+  ctx.font = `${fontSize}px monospace`;
+  ctx.textBaseline = "top";
+  let br = 255, bg = 255, bb = 255;
+  if (lightMode) {
+    br = 0;
+    bg = 0;
+    bb = 0;
+  }
+  if (color) {
+    const p = _parseColor(color);
+    if (p) {
+      br = p.r;
+      bg = p.g;
+      bb = p.b;
+    }
+  }
+  let acR = 212, acG = 255, acB = 0;
+  const ap = _parseColor(accentColor);
+  if (ap) {
+    acR = ap.r;
+    acG = ap.g;
+    acB = ap.b;
+  }
+  const period = rows + tailLength;
+  for (let c = 0; c < cols; c++) {
+    if (_hash2(c * 17, 3) > density) continue;
+    const colSpeed = (0.5 + _hash2(c * 31, 7) * 1.5) * speed;
+    const phase = _hash2(c * 13, 11) * period;
+    const headRow = Math.floor((time * colSpeed * 7 + phase) % period);
+    const x = c * charW;
+    for (let k = 0; k <= tailLength; k++) {
+      const row = headRow - (tailLength - k);
+      if (row < 0 || row >= rows) continue;
+      const y = row * lineH;
+      const charSeed = _hash2(c * 53 + Math.floor(time * 5 + k), row * 7);
+      const ch = chars[Math.floor(charSeed * chars.length)];
+      const t = k / tailLength;
+      if (k === tailLength) {
+        ctx.fillStyle = `rgba(${acR},${acG},${acB},${lightMode ? 0.7 : 0.85})`;
+      } else {
+        const alpha = lightMode ? t * 0.22 : t * 0.15;
+        ctx.fillStyle = `rgba(${br},${bg},${bb},${alpha})`;
+      }
+      ctx.fillText(ch, x, y);
+    }
+  }
+}
+function renderStarsBackground(ctx, width, height, time, mousePos = { x: 0.5, y: 0.5 }, options = {}) {
+  const {
+    fontSize = 14,
+    chars = " . \xB7 * + \xB0 \u2605",
+    accentColor = "#d4ff00",
+    color,
+    speed = 1,
+    count = 180,
+    lightMode = false
+  } = options;
+  ctx.clearRect(0, 0, width, height);
+  ctx.textBaseline = "middle";
+  ctx.textAlign = "center";
+  const cx = width * (0.2 + mousePos.x * 0.6);
+  const cy = height * (0.2 + mousePos.y * 0.6);
+  const maxR = Math.sqrt(width * width + height * height) * 0.65;
+  let br = 255, bg = 255, bb = 255;
+  if (lightMode) {
+    br = 0;
+    bg = 0;
+    bb = 0;
+  }
+  if (color) {
+    const p = _parseColor(color);
+    if (p) {
+      br = p.r;
+      bg = p.g;
+      bb = p.b;
+    }
+  }
+  let acR = 212, acG = 255, acB = 0;
+  const ap = _parseColor(accentColor);
+  if (ap) {
+    acR = ap.r;
+    acG = ap.g;
+    acB = ap.b;
+  }
+  const charArr = chars.replace(/ /g, "").split("");
+  if (charArr.length === 0) return;
+  for (let i = 0; i < count; i++) {
+    const angle = _hash2(i * 17, 3) * Math.PI * 2;
+    const baseSpd = 0.15 + _hash2(i * 31, 7) * 0.85;
+    const phase = _hash2(i * 13, 11);
+    const r = (time * baseSpd * speed * 0.22 + phase) % 1;
+    const x = cx + Math.cos(angle) * r * maxR;
+    const y = cy + Math.sin(angle) * r * maxR;
+    if (x < -20 || x > width + 20 || y < -20 || y > height + 20) continue;
+    const sz = Math.max(6, fontSize * (0.4 + r * 0.9));
+    ctx.font = `${sz}px monospace`;
+    const charIdx = Math.min(charArr.length - 1, Math.floor(r * charArr.length));
+    const ch = charArr[charIdx];
+    const isAccent = r > 0.72;
+    const alpha = lightMode ? r * 0.28 : r * 0.2;
+    ctx.fillStyle = isAccent ? `rgba(${acR},${acG},${acB},${Math.min(lightMode ? 0.45 : 0.32, alpha * 2.2)})` : `rgba(${br},${bg},${bb},${alpha})`;
+    ctx.fillText(ch, x, y);
+  }
+  ctx.textAlign = "left";
+}
 function _parseColor(c) {
   const hex = c.match(/^#([0-9a-f]{3,8})$/i)?.[1];
   if (hex) {
@@ -1011,6 +1132,7 @@ function _parseColor(c) {
 }
 function asciiBackground(target, options = {}) {
   const {
+    type = "wave",
     opacity = 0.2,
     className,
     zIndex = 0,
@@ -1050,16 +1172,31 @@ function asciiBackground(target, options = {}) {
     if (colorScheme === "dark") return false;
     return mq.matches;
   };
-  let parsedColor = null;
-  if (color) parsedColor = _parseColor(color);
-  const buildOpts = () => ({
+  const parsedColor = color ? _parseColor(color) : null;
+  const buildWaveOpts = () => ({
     ...renderOpts,
     lightMode: renderOpts.lightMode !== void 0 ? renderOpts.lightMode : isLight(),
     baseColor: parsedColor ? `rgba(${parsedColor.r},${parsedColor.g},${parsedColor.b},{a})` : renderOpts.baseColor
   });
-  const optsRef = { current: buildOpts() };
+  const buildRainOpts = () => ({
+    ...renderOpts,
+    lightMode: renderOpts.lightMode !== void 0 ? renderOpts.lightMode : isLight(),
+    color: color ?? renderOpts.color
+  });
+  const buildStarsOpts = () => ({
+    ...renderOpts,
+    lightMode: renderOpts.lightMode !== void 0 ? renderOpts.lightMode : isLight(),
+    color: color ?? renderOpts.color
+  });
+  const optsRef = { current: buildWaveOpts() };
+  const rebuildOpts = () => {
+    if (type === "rain") optsRef.current = buildRainOpts();
+    else if (type === "stars") optsRef.current = buildStarsOpts();
+    else optsRef.current = buildWaveOpts();
+  };
+  rebuildOpts();
   const onSchemeChange = () => {
-    optsRef.current = buildOpts();
+    rebuildOpts();
   };
   if (colorScheme === "auto") mq.addEventListener("change", onSchemeChange);
   const resize = () => {
@@ -1083,7 +1220,13 @@ function asciiBackground(target, options = {}) {
     smoothMouse.x += (mouse.x - smoothMouse.x) * 0.07;
     smoothMouse.y += (mouse.y - smoothMouse.y) * 0.07;
     const r = container.getBoundingClientRect();
-    renderWaveBackground(ctx, r.width, r.height, time, smoothMouse, optsRef.current);
+    if (type === "rain") {
+      renderRainBackground(ctx, r.width, r.height, time, optsRef.current);
+    } else if (type === "stars") {
+      renderStarsBackground(ctx, r.width, r.height, time, smoothMouse, optsRef.current);
+    } else {
+      renderWaveBackground(ctx, r.width, r.height, time, smoothMouse, optsRef.current);
+    }
     time += 0.016;
     raf = requestAnimationFrame(tick);
   };
@@ -1563,6 +1706,8 @@ exports.gifToAsciiFrames = gifToAsciiFrames;
 exports.imageToAsciiFrame = imageToAsciiFrame;
 exports.mountWaveBackground = mountWaveBackground;
 exports.renderFrameToCanvas = renderFrameToCanvas;
+exports.renderRainBackground = renderRainBackground;
+exports.renderStarsBackground = renderStarsBackground;
 exports.renderWaveBackground = renderWaveBackground;
 exports.tryCreateWebGLRenderer = tryCreateWebGLRenderer;
 exports.videoToAsciiFrames = videoToAsciiFrames;