litecanvas 0.83.4 → 0.84.0

package/README.md

@@ -2,16 +2,17 @@
 
 # Litecanvas
 
-[![NPM Version](https://flat.badgen.net/npm/v/litecanvas?scale=1&label=NPM)](https://www.npmjs.com/package/litecanvas/)
+[![NPM Version](https://flat.badgen.net/npm/v/litecanvas?scale=1&label=NPM&color=blue&cache=3600)](https://www.npmjs.com/package/litecanvas/)
+[![License](https://flat.badgen.net/npm/license/litecanvas)](LICENSE)
 
 Litecanvas is a lightweight HTML5 canvas 2D engine suitable for small web games, prototypes, game jams, animations, creative coding, learning game programming and game design, etc.
 
-
 [![Itch](https://flat.badgen.net/static/FOLLOW/ON%20ITCH.IO/fa5c5c?scale=1.25)](https://bills.itch.io/litecanvas)
 [![Discord Server](https://flat.badgen.net/static/CHAT/ON%20DISCORD/5865f2?scale=1.25&icon=discord)](https://discord.com/invite/r2c3rGsvH3)
 [![Playground](https://flat.badgen.net/static/CODE/ON%20PLAYGROUND/5f3dc4?scale=1.25)](https://litecanvas.js.org/)
 
-> [!WARNING]  
+<!-- prettier-ignore -->
+> [!WARNING]
 > **This project is still in the "alpha" stage. Break changes may occur frequently. All feedback is welcome and appreciated.**
 
 ### Features
@@ -60,9 +61,9 @@ litecanvas({
 function init() {
     bg = 0 // the color #0 (black)
     color = 3 // the color #3 (white)
-    radius = W / 10 // the canvas width/10
-    posx = CX // center X (or canvas width/2)
-    posy = CY // center Y (or canvas width/2)
+    radius = W / 10 // the canvas Width/10
+    posx = W / 2 // center X (or canvas Width/2)
+    posy = H / 2 // center Y (or canvas Height/2)
 }
 
 // this function detect clicks/touches
@@ -75,7 +76,7 @@ function tapped(x, y) {
 
 // put the game logic in this function
 function update(dt) {
-    // make the circle falls 100 pixels per second
+    // make the circle falls 200 pixels per second
     posy += 200 * dt
 }
 

package/dist/dist.dev.js

@@ -1,10 +1,13 @@
 (() => {
   // src/zzfx.js
-  var zzfxX = /* @__PURE__ */ new AudioContext();
-  var zzfx = (i = 1, d = 0.05, z = 220, e = 0, P = 0, S = 0.1, I = 0, c = 1, T = 0, H = 0, V = 0, J = 0, h = 0, j = 0, K = 0, E = 0, r = 0, B = 1, X = 0, L = 0, D = 0) => {
-    let n = Math, t = 2 * n.PI, a = 44100, F = T *= 500 * t / a / a, O = z *= (1 - d + 2 * d * n.random(d = [])) * t / a, x = 0, _ = 0, f = 0, g = 1, $ = 0, l = 0, o = 0, s = D < 0 ? -1 : 1, u = t * s * D * 2 / a, G = n.cos(u), C = n.sin, Q = C(u) / 4, M = 1 + Q, m = -2 * G / M, y = (1 - Q) / M, R = (1 + s * G) / 2 / M, A = -(s + G) / M, v = R, U = 0, W = 0, Y = 0, Z = 0;
-    for (e = a * e + 9, X *= a, P *= a, S *= a, r *= a, H *= 500 * t / a ** 3, K *= t / a, V *= t / a, J *= a, h = a * h | 0, i *= 0.3 * (globalThis.zzfxV || 1), s = e + X + P + S + r | 0; f < s; d[f++] = o * i) ++l % (100 * E | 0) || (o = I ? 1 < I ? 2 < I ? 3 < I ? C(x * x) : n.max(n.min(n.tan(x), 1), -1) : 1 - (2 * x / t % 2 + 2) % 2 : 1 - 4 * n.abs(n.round(x / t) - x / t) : C(x), o = (h ? 1 - L + L * C(t * f / h) : 1) * (o < 0 ? -1 : 1) * n.abs(o) ** c * (f < e ? f / e : f < e + X ? 1 - (f - e) / X * (1 - B) : f < e + X + P ? B : f < s - r ? (s - f - r) / S * B : 0), o = r ? o / 2 + (r > f ? 0 : (f < s - r ? 1 : (s - f) / r) * d[f - r | 0] / 2 / i) : o, D && (o = Z = v * U + A * (U = W) + R * (W = o) - y * Y - m * (Y = Z))), u = (z += T += H) * n.cos(K * _++), x += u + u * j * C(f ** 5), g && ++g > J && (z += V, O += V, g = 0), !h || ++$ % h || (z = O, T = F, g = g || 1);
-    i = zzfxX.createBuffer(1, s, a), i.getChannelData(0).set(d), z = zzfxX.createBufferSource(), z.buffer = i, z.connect(zzfxX.destination), z.start();
+  var setupZzFX = (global) => {
+    const zzfxX = new AudioContext();
+    global.zzfxV = 1;
+    return (i = 1, d = 0.05, z = 220, e = 0, P = 0, S = 0.1, I = 0, c = 1, T = 0, H = 0, V = 0, J = 0, h = 0, j = 0, K = 0, E = 0, r = 0, B = 1, X = 0, L = 0, D = 0) => {
+      let n = Math, t = 2 * n.PI, a = 44100, F = T *= 500 * t / a / a, O = z *= (1 - d + 2 * d * n.random(d = [])) * t / a, x = 0, _ = 0, f = 0, g = 1, $ = 0, l = 0, o = 0, s = D < 0 ? -1 : 1, u = t * s * D * 2 / a, G = n.cos(u), C = n.sin, Q = C(u) / 4, M = 1 + Q, m = -2 * G / M, y = (1 - Q) / M, R = (1 + s * G) / 2 / M, A = -(s + G) / M, v = R, U = 0, W = 0, Y = 0, Z = 0;
+      for (e = a * e + 9, X *= a, P *= a, S *= a, r *= a, H *= 500 * t / a ** 3, K *= t / a, V *= t / a, J *= a, h = a * h | 0, i *= 0.3 * global.zzfxV, s = e + X + P + S + r | 0; f < s; d[f++] = o * i) ++l % (100 * E | 0) || (o = I ? 1 < I ? 2 < I ? 3 < I ? C(x * x) : n.max(n.min(n.tan(x), 1), -1) : 1 - (2 * x / t % 2 + 2) % 2 : 1 - 4 * n.abs(n.round(x / t) - x / t) : C(x), o = (h ? 1 - L + L * C(t * f / h) : 1) * (o < 0 ? -1 : 1) * n.abs(o) ** c * (f < e ? f / e : f < e + X ? 1 - (f - e) / X * (1 - B) : f < e + X + P ? B : f < s - r ? (s - f - r) / S * B : 0), o = r ? o / 2 + (r > f ? 0 : (f < s - r ? 1 : (s - f) / r) * d[f - r | 0] / 2 / i) : o, D && (o = Z = v * U + A * (U = W) + R * (W = o) - y * Y - m * (Y = Z))), u = (z += T += H) * n.cos(K * _++), x += u + u * j * C(f ** 5), g && ++g > J && (z += V, O += V, g = 0), !h || ++$ % h || (z = O, T = F, g = g || 1);
+      i = zzfxX.createBuffer(1, s, a), i.getChannelData(0).set(d), z = zzfxX.createBufferSource(), z.buffer = i, z.connect(zzfxX.destination), z.start();
+    };
   };
 
   // src/palette.js
@@ -33,7 +36,7 @@
     const root = globalThis, math = Math, TWO_PI = math.PI * 2, raf = requestAnimationFrame, _browserEventListeners = [], on = (elem, evt, callback) => {
       elem.addEventListener(evt, callback, false);
       _browserEventListeners.push(() => elem.removeEventListener(evt, callback, false));
-    }, isNumber = Number.isFinite, defaults = {
+    }, zzfx = setupZzFX(root), isNumber = Number.isFinite, defaults = {
       width: null,
       height: null,
       autoscale: true,
@@ -58,8 +61,6 @@
       tapped: null
     };
     const instance = {
-      /** @type {HTMLCanvasElement} */
-      CANVAS: null,
       /** @type {number} */
       W: 0,
       /** @type {number} */
@@ -67,10 +68,6 @@
       /** @type {number} */
       T: 0,
       /** @type {number} */
-      CX: 0,
-      /** @type {number} */
-      CY: 0,
-      /** @type {number} */
       MX: -1,
       /** @type {number} */
       MY: -1,
@@ -156,13 +153,13 @@
        * @param {number} max
        * @returns {number}
        */
-      clamp: (value, min2, max2) => {
+      clamp: (value, min, max) => {
         DEV: assert(isNumber(value), "clamp: 1st param must be a number");
-        DEV: assert(isNumber(min2), "clamp: 2nd param must be a number");
-        DEV: assert(isNumber(max2), "clamp: 3rd param must be a number");
-        DEV: assert(max2 > min2, "clamp: the 2nd param must be less than the 3rd param");
-        if (value < min2) return min2;
-        if (value > max2) return max2;
+        DEV: assert(isNumber(min), "clamp: 2nd param must be a number");
+        DEV: assert(isNumber(max), "clamp: 3rd param must be a number");
+        DEV: assert(max > min, "clamp: the 2nd param must be less than the 3rd param");
+        if (value < min) return min;
+        if (value > max) return max;
         return value;
       },
       /**
@@ -173,12 +170,12 @@
        * @param {number} max
        * @returns {number}
        */
-      wrap: (value, min2, max2) => {
+      wrap: (value, min, max) => {
         DEV: assert(isNumber(value), "wrap: 1st param must be a number");
-        DEV: assert(isNumber(min2), "wrap: 2nd param must be a number");
-        DEV: assert(isNumber(max2), "wrap: 3rd param must be a number");
-        DEV: assert(max2 > min2, "wrap: the 2nd param must be less than the 3rd param");
-        return value - (max2 - min2) * math.floor((value - min2) / (max2 - min2));
+        DEV: assert(isNumber(min), "wrap: 2nd param must be a number");
+        DEV: assert(isNumber(max), "wrap: 3rd param must be a number");
+        DEV: assert(max > min, "wrap: the 2nd param must be less than the 3rd param");
+        return value - (max - min) * math.floor((value - min) / (max - min));
       },
       /**
        * Re-maps a number from one range to another.
@@ -197,7 +194,7 @@
         DEV: assert(isNumber(stop1), "map: 3rd param must be a number");
         DEV: assert(isNumber(start2), "map: 4th param must be a number");
         DEV: assert(isNumber(stop2), "map: 5th param must be a number");
-        DEV: assert(max !== min, "map: the 3rd param must be different than the 2nd param");
+        DEV: assert(stop1 !== start1, "map: the 2nd param must be different than the 3rd param");
         const result = (value - start1) / (stop1 - start1) * (stop2 - start2) + start2;
         return withinBounds ? instance.clamp(result, start2, stop2) : result;
       },
@@ -244,15 +241,15 @@
        * @param {number} [max=1.0]
        * @returns {number} the random number
        */
-      rand: (min2 = 0, max2 = 1) => {
-        DEV: assert(isNumber(min2), "rand: 1st param must be a number");
-        DEV: assert(isNumber(max2), "rand: 2nd param must be a number");
-        DEV: assert(max2 > min2, "rand: the 1st param must be less than the 2nd param");
+      rand: (min = 0, max = 1) => {
+        DEV: assert(isNumber(min), "rand: 1st param must be a number");
+        DEV: assert(isNumber(max), "rand: 2nd param must be a number");
+        DEV: assert(max > min, "rand: the 1st param must be less than the 2nd param");
         const a = 1664525;
         const c = 1013904223;
         const m = 4294967296;
         _rngSeed = (a * _rngSeed + c) % m;
-        return _rngSeed / m * (max2 - min2) + min2;
+        return _rngSeed / m * (max - min) + min;
       },
       /**
        * Generates a pseudorandom integer between min (inclusive) and max (inclusive)
@@ -261,11 +258,11 @@
        * @param {number} [max=1]
        * @returns {number} the random number
        */
-      randi: (min2 = 0, max2 = 1) => {
-        DEV: assert(isNumber(min2), "randi: 1st param must be a number");
-        DEV: assert(isNumber(max2), "randi: 2nd param must be a number");
-        DEV: assert(max2 > min2, "randi: the 1st param must be less than the 2nd param");
-        return math.floor(instance.rand(min2, max2 + 1));
+      randi: (min = 0, max = 1) => {
+        DEV: assert(isNumber(min), "randi: 1st param must be a number");
+        DEV: assert(isNumber(max), "randi: 2nd param must be a number");
+        DEV: assert(max > min, "randi: the 1st param must be less than the 2nd param");
+        return math.floor(instance.rand(min, max + 1));
       },
       /**
        * Initializes the random number generator with an explicit seed value.
@@ -774,6 +771,14 @@
         root.zzfxV = value;
       },
       /** PLUGINS API */
+      /**
+       * Returns the canvas
+       *
+       * @returns {HTMLCanvasElement}
+       */
+      canvas() {
+        return _canvas;
+      },
       /**
        * Prepares a plugin to be loaded
        *
@@ -1165,7 +1170,7 @@
     function drawFrame(now) {
       let updated = 0;
       if (settings.animate) {
-        _accumulated += math.min(0.2, (now - _lastFrameTime) / 1e3);
+        _accumulated += math.min(0.1, (now - _lastFrameTime) / 1e3);
         _lastFrameTime = now;
         while (_accumulated >= _deltaTime) {
           updated++;

package/dist/dist.js

@@ -1,10 +1,13 @@
 (() => {
   // src/zzfx.js
-  var zzfxX = /* @__PURE__ */ new AudioContext();
-  var zzfx = (i = 1, d = 0.05, z = 220, e = 0, P = 0, S = 0.1, I = 0, c = 1, T = 0, H = 0, V = 0, J = 0, h = 0, j = 0, K = 0, E = 0, r = 0, B = 1, X = 0, L = 0, D = 0) => {
-    let n = Math, t = 2 * n.PI, a = 44100, F = T *= 500 * t / a / a, O = z *= (1 - d + 2 * d * n.random(d = [])) * t / a, x = 0, _ = 0, f = 0, g = 1, $ = 0, l = 0, o = 0, s = D < 0 ? -1 : 1, u = t * s * D * 2 / a, G = n.cos(u), C = n.sin, Q = C(u) / 4, M = 1 + Q, m = -2 * G / M, y = (1 - Q) / M, R = (1 + s * G) / 2 / M, A = -(s + G) / M, v = R, U = 0, W = 0, Y = 0, Z = 0;
-    for (e = a * e + 9, X *= a, P *= a, S *= a, r *= a, H *= 500 * t / a ** 3, K *= t / a, V *= t / a, J *= a, h = a * h | 0, i *= 0.3 * (globalThis.zzfxV || 1), s = e + X + P + S + r | 0; f < s; d[f++] = o * i) ++l % (100 * E | 0) || (o = I ? 1 < I ? 2 < I ? 3 < I ? C(x * x) : n.max(n.min(n.tan(x), 1), -1) : 1 - (2 * x / t % 2 + 2) % 2 : 1 - 4 * n.abs(n.round(x / t) - x / t) : C(x), o = (h ? 1 - L + L * C(t * f / h) : 1) * (o < 0 ? -1 : 1) * n.abs(o) ** c * (f < e ? f / e : f < e + X ? 1 - (f - e) / X * (1 - B) : f < e + X + P ? B : f < s - r ? (s - f - r) / S * B : 0), o = r ? o / 2 + (r > f ? 0 : (f < s - r ? 1 : (s - f) / r) * d[f - r | 0] / 2 / i) : o, D && (o = Z = v * U + A * (U = W) + R * (W = o) - y * Y - m * (Y = Z))), u = (z += T += H) * n.cos(K * _++), x += u + u * j * C(f ** 5), g && ++g > J && (z += V, O += V, g = 0), !h || ++$ % h || (z = O, T = F, g = g || 1);
-    i = zzfxX.createBuffer(1, s, a), i.getChannelData(0).set(d), z = zzfxX.createBufferSource(), z.buffer = i, z.connect(zzfxX.destination), z.start();
+  var setupZzFX = (global) => {
+    const zzfxX = new AudioContext();
+    global.zzfxV = 1;
+    return (i = 1, d = 0.05, z = 220, e = 0, P = 0, S = 0.1, I = 0, c = 1, T = 0, H = 0, V = 0, J = 0, h = 0, j = 0, K = 0, E = 0, r = 0, B = 1, X = 0, L = 0, D = 0) => {
+      let n = Math, t = 2 * n.PI, a = 44100, F = T *= 500 * t / a / a, O = z *= (1 - d + 2 * d * n.random(d = [])) * t / a, x = 0, _ = 0, f = 0, g = 1, $ = 0, l = 0, o = 0, s = D < 0 ? -1 : 1, u = t * s * D * 2 / a, G = n.cos(u), C = n.sin, Q = C(u) / 4, M = 1 + Q, m = -2 * G / M, y = (1 - Q) / M, R = (1 + s * G) / 2 / M, A = -(s + G) / M, v = R, U = 0, W = 0, Y = 0, Z = 0;
+      for (e = a * e + 9, X *= a, P *= a, S *= a, r *= a, H *= 500 * t / a ** 3, K *= t / a, V *= t / a, J *= a, h = a * h | 0, i *= 0.3 * global.zzfxV, s = e + X + P + S + r | 0; f < s; d[f++] = o * i) ++l % (100 * E | 0) || (o = I ? 1 < I ? 2 < I ? 3 < I ? C(x * x) : n.max(n.min(n.tan(x), 1), -1) : 1 - (2 * x / t % 2 + 2) % 2 : 1 - 4 * n.abs(n.round(x / t) - x / t) : C(x), o = (h ? 1 - L + L * C(t * f / h) : 1) * (o < 0 ? -1 : 1) * n.abs(o) ** c * (f < e ? f / e : f < e + X ? 1 - (f - e) / X * (1 - B) : f < e + X + P ? B : f < s - r ? (s - f - r) / S * B : 0), o = r ? o / 2 + (r > f ? 0 : (f < s - r ? 1 : (s - f) / r) * d[f - r | 0] / 2 / i) : o, D && (o = Z = v * U + A * (U = W) + R * (W = o) - y * Y - m * (Y = Z))), u = (z += T += H) * n.cos(K * _++), x += u + u * j * C(f ** 5), g && ++g > J && (z += V, O += V, g = 0), !h || ++$ % h || (z = O, T = F, g = g || 1);
+      i = zzfxX.createBuffer(1, s, a), i.getChannelData(0).set(d), z = zzfxX.createBufferSource(), z.buffer = i, z.connect(zzfxX.destination), z.start();
+    };
   };
 
   // src/palette.js
@@ -28,7 +31,7 @@
     const root = globalThis, math = Math, TWO_PI = math.PI * 2, raf = requestAnimationFrame, _browserEventListeners = [], on = (elem, evt, callback) => {
       elem.addEventListener(evt, callback, false);
       _browserEventListeners.push(() => elem.removeEventListener(evt, callback, false));
-    }, isNumber = Number.isFinite, defaults = {
+    }, zzfx = setupZzFX(root), isNumber = Number.isFinite, defaults = {
       width: null,
       height: null,
       autoscale: true,
@@ -53,8 +56,6 @@
       tapped: null
     };
     const instance = {
-      /** @type {HTMLCanvasElement} */
-      CANVAS: null,
       /** @type {number} */
       W: 0,
       /** @type {number} */
@@ -62,10 +63,6 @@
       /** @type {number} */
       T: 0,
       /** @type {number} */
-      CX: 0,
-      /** @type {number} */
-      CY: 0,
-      /** @type {number} */
       MX: -1,
       /** @type {number} */
       MY: -1,
@@ -141,9 +138,9 @@
        * @param {number} max
        * @returns {number}
        */
-      clamp: (value, min2, max2) => {
-        if (value < min2) return min2;
-        if (value > max2) return max2;
+      clamp: (value, min, max) => {
+        if (value < min) return min;
+        if (value > max) return max;
         return value;
       },
       /**
@@ -154,8 +151,8 @@
        * @param {number} max
        * @returns {number}
        */
-      wrap: (value, min2, max2) => {
-        return value - (max2 - min2) * math.floor((value - min2) / (max2 - min2));
+      wrap: (value, min, max) => {
+        return value - (max - min) * math.floor((value - min) / (max - min));
       },
       /**
        * Re-maps a number from one range to another.
@@ -205,12 +202,12 @@
        * @param {number} [max=1.0]
        * @returns {number} the random number
        */
-      rand: (min2 = 0, max2 = 1) => {
+      rand: (min = 0, max = 1) => {
         const a = 1664525;
         const c = 1013904223;
         const m = 4294967296;
         _rngSeed = (a * _rngSeed + c) % m;
-        return _rngSeed / m * (max2 - min2) + min2;
+        return _rngSeed / m * (max - min) + min;
       },
       /**
        * Generates a pseudorandom integer between min (inclusive) and max (inclusive)
@@ -219,8 +216,8 @@
        * @param {number} [max=1]
        * @returns {number} the random number
        */
-      randi: (min2 = 0, max2 = 1) => {
-        return math.floor(instance.rand(min2, max2 + 1));
+      randi: (min = 0, max = 1) => {
+        return math.floor(instance.rand(min, max + 1));
       },
       /**
        * Initializes the random number generator with an explicit seed value.
@@ -586,6 +583,14 @@
         root.zzfxV = value;
       },
       /** PLUGINS API */
+      /**
+       * Returns the canvas
+       *
+       * @returns {HTMLCanvasElement}
+       */
+      canvas() {
+        return _canvas;
+      },
       /**
        * Prepares a plugin to be loaded
        *
@@ -947,7 +952,7 @@
     function drawFrame(now) {
       let updated = 0;
       if (settings.animate) {
-        _accumulated += math.min(0.2, (now - _lastFrameTime) / 1e3);
+        _accumulated += math.min(0.1, (now - _lastFrameTime) / 1e3);
         _lastFrameTime = now;
         while (_accumulated >= _deltaTime) {
           updated++;

package/dist/dist.min.js

@@ -1 +1 @@
-(()=>{var e=new AudioContext,t=(t=1,a=.05,l=220,n=0,i=0,o=.1,r=0,s=1,f=0,c=0,d=0,p=0,u=0,h=0,g=0,m=0,w=0,b=1,v=0,x=0,y=0)=>{let C=Math,k=2*C.PI,E=f*=500*k/44100/44100,T=l*=(1-a+2*a*C.random(a=[]))*k/44100,z=0,A=0,S=0,I=1,P=0,X=0,Y=0,L=y<0?-1:1,M=k*L*y*2/44100,N=C.cos(M),H=C.sin,W=H(M)/4,D=1+W,F=-2*N/D,V=(1-W)/D,q=(1+L*N)/2/D,B=-(L+N)/D,O=0,R=0,G=0,$=0;for(n=44100*n+9,v*=44100,i*=44100,o*=44100,w*=44100,c*=500*k/85766121e6,g*=k/44100,d*=k/44100,p*=44100,u=44100*u|0,t*=.3*(globalThis.zzfxV||1),L=n+v+i+o+w|0;S<L;a[S++]=Y*t)++X%(100*m|0)||(Y=r?1<r?2<r?3<r?H(z*z):C.max(C.min(C.tan(z),1),-1):1-(2*z/k%2+2)%2:1-4*C.abs(C.round(z/k)-z/k):H(z),Y=(u?1-x+x*H(k*S/u):1)*(Y<0?-1:1)*C.abs(Y)**s*(S<n?S/n:S<n+v?1-(S-n)/v*(1-b):S<n+v+i?b:S<L-w?(L-S-w)/o*b:0),Y=w?Y/2+(w>S?0:(S<L-w?1:(L-S)/w)*a[S-w|0]/2/t):Y,y&&(Y=$=q*O+B*(O=R)+q*(R=Y)-V*G-F*(G=$))),z+=(M=(l+=f+=c)*C.cos(g*A++))+M*h*H(S**5),I&&++I>p&&(l+=d,T+=d,I=0),!u||++P%u||(l=T,f=E,I=I||1);(t=e.createBuffer(1,L,44100)).getChannelData(0).set(a),(l=e.createBufferSource()).buffer=t,l.connect(e.destination),l.start()},a=["#111","#6a7799","#aec2c2","#FFF1E8","#e83b3b","#fabc20","#155fd9","#3cbcfc","#327345","#63c64d","#6c2c1f","#ac7c00"];globalThis.litecanvas=function(e={}){let l=globalThis,n=Math,i=2*n.PI,o=requestAnimationFrame,r=[],s=(e,t,a)=>{e.addEventListener(t,a,!1),r.push(()=>e.removeEventListener(t,a,!1))};e=Object.assign({width:null,height:null,autoscale:!0,pixelart:!1,antialias:!1,canvas:null,global:!0,loop:null,tapEvents:!0,keyboardEvents:!0,animate:!0},e);let f=!1,c=[],d,p=1,u,h=.5,g=1,m,w=1/60,b=0,v,x="sans-serif",y=20,C=Date.now(),k=a,E=[.5,0,1750,,,.3,1,,,,600,.1],T={init:null,update:null,draw:null,resized:null,tap:null,untap:null,tapping:null,tapped:null},z={CANVAS:null,W:0,H:0,T:0,CX:0,CY:0,MX:-1,MY:-1,TWO_PI:i,HALF_PI:i/4,lerp:(e,t,a)=>a*(t-e)+e,deg2rad:e=>n.PI/180*e,rad2deg:e=>180/n.PI*e,round:(e,t=0)=>{if(!t)return n.round(e);let a=10**t;return n.round(e*a)/a},clamp:(e,t,a)=>e<t?t:e>a?a:e,wrap:(e,t,a)=>e-(a-t)*n.floor((e-t)/(a-t)),map(e,t,a,l,n,i){let o=(e-t)/(a-t)*(n-l)+l;return i?z.clamp(o,l,n):o},norm:(e,t,a)=>z.map(e,t,a,0,1),wave:(e,t,a,l=Math.sin)=>e+(l(a)+1)/2*(t-e),rand:(e=0,t=1)=>(C=(1664525*C+0x3c6ef35f)%0x100000000)/0x100000000*(t-e)+e,randi:(e=0,t=1)=>n.floor(z.rand(e,t+1)),rseed(e){C=~~e},cls(e){null==e?u.clearRect(0,0,u.canvas.width,u.canvas.height):z.rectfill(0,0,u.canvas.width,u.canvas.height,e)},rect(e,t,a,l,n,i){u.beginPath(),u[i?"roundRect":"rect"](~~e-h,~~t-h,~~a+2*h,~~l+2*h,i),z.stroke(n)},rectfill(e,t,a,l,n,i){u.beginPath(),u[i?"roundRect":"rect"](~~e,~~t,~~a,~~l,i),z.fill(n)},circ(e,t,a,l){u.beginPath(),u.arc(~~e,~~t,~~a,0,i),z.stroke(l)},circfill(e,t,a,l){u.beginPath(),u.arc(~~e,~~t,~~a,0,i),z.fill(l)},line(e,t,a,l,n){u.beginPath();let i=.5*(0!==h&&~~e==~~a),o=.5*(0!==h&&~~t==~~l);u.moveTo(~~e+i,~~t+o),u.lineTo(~~a+i,~~l+o),z.stroke(n)},linewidth(e){u.lineWidth=~~e,h=.5*(0!=~~e%2)},linedash(e,t=0){u.setLineDash(e),u.lineDashOffset=t},text(e,t,a,l=3,n="normal"){u.font=`${n} ${y}px ${x}`,u.fillStyle=k[~~l%k.length],u.fillText(a,~~e,~~t)},textfont(e){x=e},textsize(e){y=e},textalign(e,t){e&&(u.textAlign=e),t&&(u.textBaseline=t)},image(e,t,a){u.drawImage(a,~~e,~~t)},paint(e,t,a,l={}){let n=l.canvas||new OffscreenCanvas(1,1),i=l.scale||1,o=u;if(n.width=e*i,n.height=t*i,(u=n.getContext("2d")).scale(i,i),a.push){let e=0,t=0;for(let l of(u.imageSmoothingEnabled=!1,a)){for(let a of l)" "!==a&&"."!==a&&z.rectfill(e,t,1,1,parseInt(a,16)),e++;t++,e=0}}else a(u);return u=o,n.transferToImageBitmap()},ctx:e=>(e&&(u=e),u),push:()=>u.save(),pop:()=>u.restore(),translate:(e,t)=>u.translate(~~e,~~t),scale:(e,t)=>u.scale(e,t||e),rotate:e=>u.rotate(e),alpha(e){u.globalAlpha=z.clamp(e,0,1)},path:e=>new Path2D(e),fill(e,t){u.fillStyle=k[~~e%k.length],t?u.fill(t):u.fill()},stroke(e,t){u.strokeStyle=k[~~e%k.length],t?u.stroke(t):u.stroke()},clip(e){u.clip(e)},sfx:(e,a=0,n=1)=>!(l.zzfxV<=0)&&(!navigator.userActivation||!!navigator.userActivation.hasBeenActive)&&(e=e||E,(0!==a||1!==n)&&((e=e.slice())[0]=n*(e[0]||1),e[10]=~~e[10]+a),t.apply(0,e),e),volume(e){l.zzfxV=e},use(e,t={}){f?X(e,t):c.push([e,t])},listen:(e,t)=>(T[e=e.toLowerCase()]=T[e]||new Set,T[e].add(t),()=>T[e].delete(t)),emit(e,t,a,l,n){f&&(P("before:"+(e=e.toLowerCase()),t,a,l,n),P(e,t,a,l,n),P("after:"+e,t,a,l,n))},pal(e=a){k=e},def(t,a){z[t]=a,e.global&&(l[t]=a)},timescale(e){g=e},framerate(e){w=1/~~e},stat(t){let a={index:t,value:[e,f,v,p,T,k,E,g,l.zzfxV||1,C,y,x][t]};return z.emit("stat",a),a.value},quit(){for(let e of(cancelAnimationFrame(v),v=0,z.emit("quit"),r))e();if(T={},e.global){for(let e in z)delete l[e];delete l.ENGINE}}};for(let e of"PI,sin,cos,atan2,hypot,tan,abs,ceil,floor,trunc,min,max,pow,sqrt,sign,exp".split(","))z[e]=n[e];function A(){let t=e.loop?e.loop:l;for(let e in T)t[e]&&z.listen(e,t[e]);for(let[e,t]of c)X(e,t);if(e.autoscale&&s(l,"resize",I),e.tapEvents){let e=(e,t)=>[(e-d.offsetLeft)/p,(t-d.offsetTop)/p],t=new Map,a=(e,a,l)=>{let n={x:a,y:l,startX:a,startY:l,ts:performance.now()};return t.set(e,n),n},n=(e,l,n)=>{let i=t.get(e)||a(e);i.x=l,i.y=n},i=e=>e&&performance.now()-e.ts<=300,o=e=>e.preventDefault(),r=!1;s(d,"mousedown",t=>{if(0===t.button){o(t);let[l,n]=e(t.pageX,t.pageY);z.emit("tap",l,n,0),a(0,l,n),r=!0}}),s(d,"mouseup",a=>{if(0===a.button){o(a);let l=t.get(0),[n,s]=e(a.pageX,a.pageY);i(l)&&z.emit("tapped",l.startX,l.startY,0),z.emit("untap",n,s,0),t.delete(0),r=!1}}),s(d,"mousemove",t=>{o(t);let[a,l]=e(t.pageX,t.pageY);z.def("MX",a),z.def("MY",l),r&&(z.emit("tapping",a,l,0),n(0,a,l))}),s(d,"touchstart",t=>{for(let l of(o(t),t.changedTouches)){let[t,n]=e(l.pageX,l.pageY);z.emit("tap",t,n,l.identifier+1),a(l.identifier+1,t,n)}}),s(d,"touchmove",t=>{for(let a of(o(t),t.changedTouches)){let[t,l]=e(a.pageX,a.pageY);z.emit("tapping",t,l,a.identifier+1),n(a.identifier+1,t,l)}});let f=e=>{o(e);let a=[];if(e.targetTouches.length>0)for(let t of e.targetTouches)a.push(t.identifier+1);for(let[e,l]of t)a.includes(e)||(i(l)&&z.emit("tapped",l.startX,l.startY,e),z.emit("untap",l.x,l.y,e),t.delete(e))};s(d,"touchend",f),s(d,"touchcancel",f),s(l,"blur",()=>{for(let[e,a]of(r=!1,t))z.emit("untap",a.x,a.y,e),t.delete(e)})}if(e.keyboardEvents){let e=new Set,t=new Set,a=(e,t="")=>(t=t.toLowerCase())?e.has("space"===t?" ":t):e.size>0;s(l,"keydown",a=>{let l=a.key.toLowerCase();e.has(l)||(e.add(l),t.add(l))}),s(l,"keyup",t=>{e.delete(t.key.toLowerCase())}),s(l,"blur",()=>e.clear()),z.listen("after:update",()=>t.clear()),z.def("iskeydown",t=>a(e,t)),z.def("iskeypressed",e=>a(t,e))}f=!0,z.emit("init",z),m=performance.now(),v=o(S)}function S(t){let a=0;if(e.animate){for(b+=n.min(.2,(t-m)/1e3),m=t;b>=w;)a++,z.emit("update",w*g,a),z.def("T",z.T+w*g),b-=w;v&&(v=o(S))}else a=1;a&&(z.textalign("start","top"),z.emit("draw"))}function I(){let t=e.width||l.innerWidth,a=e.height||e.width||l.innerHeight;z.def("W",d.width=t),z.def("H",d.height=a),z.def("CX",z.W/2),z.def("CY",z.H/2),e.autoscale&&(d.style.display||(d.style.display="block",d.style.margin="auto"),p=n.min(l.innerWidth/z.W,l.innerHeight/z.H),p=(e.pixelart?~~p:p)||1,d.style.width=z.W*p+"px",d.style.height=z.H*p+"px"),(!e.antialias||e.pixelart)&&(u.imageSmoothingEnabled=!1,d.style.imageRendering="pixelated"),z.emit("resized",p),z.cls(0),e.animate||o(S)}function P(e,t,a,l,n){if(T[e])for(let i of T[e])i(t,a,l,n)}function X(e,t){let a=e(z,t);for(let e in a)z.def(e,a[e])}if(e.global){if(l.ENGINE)throw Error("two global litecanvas detected");Object.assign(l,z),l.ENGINE=z}return e.canvas&&(d=document.querySelector(e.canvas)),d=d||document.createElement("canvas"),z.def("CANVAS",d),u=d.getContext("2d"),s(d,"click",()=>l.focus()),d.style="",I(),d.parentNode||document.body.appendChild(d),"loading"===document.readyState?s(l,"DOMContentLoaded",()=>o(A)):o(A),z}})();
+(()=>{var e=["#111","#6a7799","#aec2c2","#FFF1E8","#e83b3b","#fabc20","#155fd9","#3cbcfc","#327345","#63c64d","#6c2c1f","#ac7c00"];globalThis.litecanvas=function(t={}){let a=globalThis,l=Math,n=2*l.PI,i=requestAnimationFrame,o=[],r=(e,t,a)=>{e.addEventListener(t,a,!1),o.push(()=>e.removeEventListener(t,a,!1))},s=(e=>{let t=new AudioContext;return e.zzfxV=1,(a=1,l=.05,n=220,i=0,o=0,r=.1,s=0,f=1,c=0,d=0,p=0,u=0,h=0,g=0,m=0,w=0,v=0,x=1,b=0,y=0,k=0)=>{let E=Math,z=2*E.PI,C=c*=500*z/44100/44100,T=n*=(1-l+2*l*E.random(l=[]))*z/44100,I=0,P=0,S=0,A=1,L=0,X=0,Y=0,M=k<0?-1:1,H=z*M*k*2/44100,N=E.cos(H),W=E.sin,D=W(H)/4,F=1+D,V=-2*N/F,q=(1-D)/F,B=(1+M*N)/2/F,O=-(M+N)/F,R=0,G=0,$=0,j=0;for(i=44100*i+9,b*=44100,o*=44100,r*=44100,v*=44100,d*=500*z/85766121e6,m*=z/44100,p*=z/44100,u*=44100,h=44100*h|0,a*=.3*e.zzfxV,M=i+b+o+r+v|0;S<M;l[S++]=Y*a)++X%(100*w|0)||(Y=s?1<s?2<s?3<s?W(I*I):E.max(E.min(E.tan(I),1),-1):1-(2*I/z%2+2)%2:1-4*E.abs(E.round(I/z)-I/z):W(I),Y=(h?1-y+y*W(z*S/h):1)*(Y<0?-1:1)*E.abs(Y)**f*(S<i?S/i:S<i+b?1-(S-i)/b*(1-x):S<i+b+o?x:S<M-v?(M-S-v)/r*x:0),Y=v?Y/2+(v>S?0:(S<M-v?1:(M-S)/v)*l[S-v|0]/2/a):Y,k&&(Y=j=B*R+O*(R=G)+B*(G=Y)-q*$-V*($=j))),I+=(H=(n+=c+=d)*E.cos(m*P++))+H*g*W(S**5),A&&++A>u&&(n+=p,T+=p,A=0),!h||++L%h||(n=T,c=C,A=A||1);(a=t.createBuffer(1,M,44100)).getChannelData(0).set(l),(n=t.createBufferSource()).buffer=a,n.connect(t.destination),n.start()}})(a);t=Object.assign({width:null,height:null,autoscale:!0,pixelart:!1,antialias:!1,canvas:null,global:!0,loop:null,tapEvents:!0,keyboardEvents:!0,animate:!0},t);let f=!1,c=[],d,p=1,u,h=.5,g=1,m,w=1/60,v=0,x,b="sans-serif",y=20,k=Date.now(),E=e,z=[.5,0,1750,,,.3,1,,,,600,.1],C={init:null,update:null,draw:null,resized:null,tap:null,untap:null,tapping:null,tapped:null},T={W:0,H:0,T:0,MX:-1,MY:-1,TWO_PI:n,HALF_PI:n/4,lerp:(e,t,a)=>a*(t-e)+e,deg2rad:e=>l.PI/180*e,rad2deg:e=>180/l.PI*e,round:(e,t=0)=>{if(!t)return l.round(e);let a=10**t;return l.round(e*a)/a},clamp:(e,t,a)=>e<t?t:e>a?a:e,wrap:(e,t,a)=>e-(a-t)*l.floor((e-t)/(a-t)),map(e,t,a,l,n,i){let o=(e-t)/(a-t)*(n-l)+l;return i?T.clamp(o,l,n):o},norm:(e,t,a)=>T.map(e,t,a,0,1),wave:(e,t,a,l=Math.sin)=>e+(l(a)+1)/2*(t-e),rand:(e=0,t=1)=>(k=(1664525*k+0x3c6ef35f)%0x100000000)/0x100000000*(t-e)+e,randi:(e=0,t=1)=>l.floor(T.rand(e,t+1)),rseed(e){k=~~e},cls(e){null==e?u.clearRect(0,0,u.canvas.width,u.canvas.height):T.rectfill(0,0,u.canvas.width,u.canvas.height,e)},rect(e,t,a,l,n,i){u.beginPath(),u[i?"roundRect":"rect"](~~e-h,~~t-h,~~a+2*h,~~l+2*h,i),T.stroke(n)},rectfill(e,t,a,l,n,i){u.beginPath(),u[i?"roundRect":"rect"](~~e,~~t,~~a,~~l,i),T.fill(n)},circ(e,t,a,l){u.beginPath(),u.arc(~~e,~~t,~~a,0,n),T.stroke(l)},circfill(e,t,a,l){u.beginPath(),u.arc(~~e,~~t,~~a,0,n),T.fill(l)},line(e,t,a,l,n){u.beginPath();let i=.5*(0!==h&&~~e==~~a),o=.5*(0!==h&&~~t==~~l);u.moveTo(~~e+i,~~t+o),u.lineTo(~~a+i,~~l+o),T.stroke(n)},linewidth(e){u.lineWidth=~~e,h=.5*(0!=~~e%2)},linedash(e,t=0){u.setLineDash(e),u.lineDashOffset=t},text(e,t,a,l=3,n="normal"){u.font=`${n} ${y}px ${b}`,u.fillStyle=E[~~l%E.length],u.fillText(a,~~e,~~t)},textfont(e){b=e},textsize(e){y=e},textalign(e,t){e&&(u.textAlign=e),t&&(u.textBaseline=t)},image(e,t,a){u.drawImage(a,~~e,~~t)},paint(e,t,a,l={}){let n=l.canvas||new OffscreenCanvas(1,1),i=l.scale||1,o=u;if(n.width=e*i,n.height=t*i,(u=n.getContext("2d")).scale(i,i),a.push){let e=0,t=0;for(let l of(u.imageSmoothingEnabled=!1,a)){for(let a of l)" "!==a&&"."!==a&&T.rectfill(e,t,1,1,parseInt(a,16)),e++;t++,e=0}}else a(u);return u=o,n.transferToImageBitmap()},ctx:e=>(e&&(u=e),u),push:()=>u.save(),pop:()=>u.restore(),translate:(e,t)=>u.translate(~~e,~~t),scale:(e,t)=>u.scale(e,t||e),rotate:e=>u.rotate(e),alpha(e){u.globalAlpha=T.clamp(e,0,1)},path:e=>new Path2D(e),fill(e,t){u.fillStyle=E[~~e%E.length],t?u.fill(t):u.fill()},stroke(e,t){u.strokeStyle=E[~~e%E.length],t?u.stroke(t):u.stroke()},clip(e){u.clip(e)},sfx:(e,t=0,l=1)=>!(a.zzfxV<=0)&&(!navigator.userActivation||!!navigator.userActivation.hasBeenActive)&&(e=e||z,(0!==t||1!==l)&&((e=e.slice())[0]=l*(e[0]||1),e[10]=~~e[10]+t),s.apply(0,e),e),volume(e){a.zzfxV=e},canvas:()=>d,use(e,t={}){f?L(e,t):c.push([e,t])},listen:(e,t)=>(C[e=e.toLowerCase()]=C[e]||new Set,C[e].add(t),()=>C[e].delete(t)),emit(e,t,a,l,n){f&&(A("before:"+(e=e.toLowerCase()),t,a,l,n),A(e,t,a,l,n),A("after:"+e,t,a,l,n))},pal(t=e){E=t},def(e,l){T[e]=l,t.global&&(a[e]=l)},timescale(e){g=e},framerate(e){w=1/~~e},stat(e){let l={index:e,value:[t,f,x,p,C,E,z,g,a.zzfxV||1,k,y,b][e]};return T.emit("stat",l),l.value},quit(){for(let e of(cancelAnimationFrame(x),x=0,T.emit("quit"),o))e();if(C={},t.global){for(let e in T)delete a[e];delete a.ENGINE}}};for(let e of"PI,sin,cos,atan2,hypot,tan,abs,ceil,floor,trunc,min,max,pow,sqrt,sign,exp".split(","))T[e]=l[e];function I(){let e=t.loop?t.loop:a;for(let t in C)e[t]&&T.listen(t,e[t]);for(let[e,t]of c)L(e,t);if(t.autoscale&&r(a,"resize",S),t.tapEvents){let e=(e,t)=>[(e-d.offsetLeft)/p,(t-d.offsetTop)/p],t=new Map,l=(e,a,l)=>{let n={x:a,y:l,startX:a,startY:l,ts:performance.now()};return t.set(e,n),n},n=(e,a,n)=>{let i=t.get(e)||l(e);i.x=a,i.y=n},i=e=>e&&performance.now()-e.ts<=300,o=e=>e.preventDefault(),s=!1;r(d,"mousedown",t=>{if(0===t.button){o(t);let[a,n]=e(t.pageX,t.pageY);T.emit("tap",a,n,0),l(0,a,n),s=!0}}),r(d,"mouseup",a=>{if(0===a.button){o(a);let l=t.get(0),[n,r]=e(a.pageX,a.pageY);i(l)&&T.emit("tapped",l.startX,l.startY,0),T.emit("untap",n,r,0),t.delete(0),s=!1}}),r(d,"mousemove",t=>{o(t);let[a,l]=e(t.pageX,t.pageY);T.def("MX",a),T.def("MY",l),s&&(T.emit("tapping",a,l,0),n(0,a,l))}),r(d,"touchstart",t=>{for(let a of(o(t),t.changedTouches)){let[t,n]=e(a.pageX,a.pageY);T.emit("tap",t,n,a.identifier+1),l(a.identifier+1,t,n)}}),r(d,"touchmove",t=>{for(let a of(o(t),t.changedTouches)){let[t,l]=e(a.pageX,a.pageY);T.emit("tapping",t,l,a.identifier+1),n(a.identifier+1,t,l)}});let f=e=>{o(e);let a=[];if(e.targetTouches.length>0)for(let t of e.targetTouches)a.push(t.identifier+1);for(let[e,l]of t)a.includes(e)||(i(l)&&T.emit("tapped",l.startX,l.startY,e),T.emit("untap",l.x,l.y,e),t.delete(e))};r(d,"touchend",f),r(d,"touchcancel",f),r(a,"blur",()=>{for(let[e,a]of(s=!1,t))T.emit("untap",a.x,a.y,e),t.delete(e)})}if(t.keyboardEvents){let e=new Set,t=new Set,l=(e,t="")=>(t=t.toLowerCase())?e.has("space"===t?" ":t):e.size>0;r(a,"keydown",a=>{let l=a.key.toLowerCase();e.has(l)||(e.add(l),t.add(l))}),r(a,"keyup",t=>{e.delete(t.key.toLowerCase())}),r(a,"blur",()=>e.clear()),T.listen("after:update",()=>t.clear()),T.def("iskeydown",t=>l(e,t)),T.def("iskeypressed",e=>l(t,e))}f=!0,T.emit("init",T),m=performance.now(),x=i(P)}function P(e){let a=0;if(t.animate){for(v+=l.min(.1,(e-m)/1e3),m=e;v>=w;)a++,T.emit("update",w*g,a),T.def("T",T.T+w*g),v-=w;x&&(x=i(P))}else a=1;a&&(T.textalign("start","top"),T.emit("draw"))}function S(){let e=t.width||a.innerWidth,n=t.height||t.width||a.innerHeight;T.def("W",d.width=e),T.def("H",d.height=n),T.def("CX",T.W/2),T.def("CY",T.H/2),t.autoscale&&(d.style.display||(d.style.display="block",d.style.margin="auto"),p=l.min(a.innerWidth/T.W,a.innerHeight/T.H),p=(t.pixelart?~~p:p)||1,d.style.width=T.W*p+"px",d.style.height=T.H*p+"px"),(!t.antialias||t.pixelart)&&(u.imageSmoothingEnabled=!1,d.style.imageRendering="pixelated"),T.emit("resized",p),T.cls(0),t.animate||i(P)}function A(e,t,a,l,n){if(C[e])for(let i of C[e])i(t,a,l,n)}function L(e,t){let a=e(T,t);for(let e in a)T.def(e,a[e])}if(t.global){if(a.ENGINE)throw Error("two global litecanvas detected");Object.assign(a,T),a.ENGINE=T}return t.canvas&&(d=document.querySelector(t.canvas)),d=d||document.createElement("canvas"),T.def("CANVAS",d),u=d.getContext("2d"),r(d,"click",()=>a.focus()),d.style="",S(),d.parentNode||document.body.appendChild(d),"loading"===document.readyState?r(a,"DOMContentLoaded",()=>i(I)):i(I),T}})();

package/package.json

@@ -1,17 +1,19 @@
 {
     "name": "litecanvas",
-    "version": "0.83.4",
+    "version": "0.84.0",
     "description": "Lightweight HTML5 canvas 2D game engine suitable for small projects and creative coding. Inspired by PICO-8 and P5/Processing.",
     "license": "MIT",
     "author": "Luiz Bills <luizbills@pm.me>",
     "contributors": [],
     "devDependencies": {
-        "@swc/core": "^1.12.3",
+        "@swc/core": "^1.12.5",
         "ava": "^6.4.0",
         "esbuild": "^0.25.5",
         "gzip-size": "^7.0.0",
         "prettier": "^3.5.3",
-        "tap-min": "^3.0.0"
+        "tap-min": "^3.0.0",
+        "@types/jsdom": "^21.1.7",
+        "jsdom": "^26.1.0"
     },
     "homepage": "https://litecanvas.github.io/about.html",
     "repository": {
@@ -26,7 +28,7 @@
     "types": "types/index.d.ts",
     "scripts": {
         "test": "ava --tap | tap-min",
-        "dev:test": "ava --watch",
+        "test:watch": "ava --watch",
         "dev": "esbuild src/web.js --bundle --watch --outfile=dist/dist.dev.js --servedir=.",
         "build": "node script/build.js",
         "gzip-size": "gzip -c dist/dist.min.js | wc -c | xargs printf \"  Gzip size: %s bytes\n\"",

package/src/index.js

@@ -1,5 +1,5 @@
 // @ts-check
-import { zzfx } from './zzfx.js'
+import { setupZzFX } from './zzfx.js'
 import { defaultPalette } from './palette.js'
 import { assert } from './dev.js'
 
@@ -22,6 +22,7 @@ export default function litecanvas(settings = {}) {
             elem.addEventListener(evt, callback, false)
             _browserEventListeners.push(() => elem.removeEventListener(evt, callback, false))
         },
+        zzfx = setupZzFX(root),
         isNumber = Number.isFinite,
         /** @type {LitecanvasOptions} */
         defaults = {
@@ -91,9 +92,6 @@ export default function litecanvas(settings = {}) {
 
     /** @type {Omit<LitecanvasInstance,'PI'|'sin'|'cos'|'atan2'|'hypot'|'tan'|'abs'|'ceil'|'floor'|'trunc'|'min'|'max'|'pow'|'sqrt'|'sign'|'exp'|'iskeydown'|'iskeypressed'>} */
     const instance = {
-        /** @type {HTMLCanvasElement} */
-        CANVAS: null,
-
         /** @type {number} */
         W: 0,
 
@@ -103,12 +101,6 @@ export default function litecanvas(settings = {}) {
         /** @type {number} */
         T: 0,
 
-        /** @type {number} */
-        CX: 0,
-
-        /** @type {number} */
-        CY: 0,
-
         /** @type {number} */
         MX: -1,
 
@@ -251,7 +243,7 @@ export default function litecanvas(settings = {}) {
             DEV: assert(isNumber(stop1), 'map: 3rd param must be a number')
             DEV: assert(isNumber(start2), 'map: 4th param must be a number')
             DEV: assert(isNumber(stop2), 'map: 5th param must be a number')
-            DEV: assert(max !== min, 'map: the 3rd param must be different than the 2nd param')
+            DEV: assert(stop1 !== start1, 'map: the 2nd param must be different than the 3rd param')
 
             // prettier-ignore
             const result = ((value - start1) / (stop1 - start1)) * (stop2 - start2) + start2
@@ -921,6 +913,14 @@ export default function litecanvas(settings = {}) {
         },
 
         /** PLUGINS API */
+        /**
+         * Returns the canvas
+         *
+         * @returns {HTMLCanvasElement}
+         */
+        canvas() {
+            return _canvas
+        },
         /**
          * Prepares a plugin to be loaded
          *
@@ -1405,7 +1405,7 @@ export default function litecanvas(settings = {}) {
 
         if (settings.animate) {
             // prevents too long frames
-            _accumulated += math.min(0.2, (now - _lastFrameTime) / 1000)
+            _accumulated += math.min(0.1, (now - _lastFrameTime) / 1000)
             _lastFrameTime = now
 
             while (_accumulated >= _deltaTime) {

package/src/zzfx.js

@@ -1,5 +1,13 @@
 // ZzFXMicro - Zuper Zmall Zound Zynth - v1.3.0 by Frank Force | https://github.com/KilledByAPixel/ZzFX
-const zzfxX = /** @__PURE__ */ new AudioContext()
-
 // prettier-ignore
-export const zzfx=(i=1,d=.05,z=220,e=0,P=0,S=.1,I=0,c=1,T=0,H=0,V=0,J=0,h=0,j=0,K=0,E=0,r=0,B=1,X=0,L=0,D=0)=>{let n=Math,t=2*n.PI,a=44100,F=T*=500*t/a/a,O=z*=(1-d+2*d*n.random(d=[]))*t/a,x=0,_=0,f=0,g=1,$=0,l=0,o=0,s=D<0?-1:1,u=t*s*D*2/a,G=n.cos(u),C=n.sin,Q=C(u)/4,M=1+Q,m=-2*G/M,y=(1-Q)/M,R=(1+s*G)/2/M,A=-(s+G)/M,v=R,U=0,W=0,Y=0,Z=0;for(e=a*e+9,X*=a,P*=a,S*=a,r*=a,H*=500*t/a**3,K*=t/a,V*=t/a,J*=a,h=a*h|0,i*=.3*(globalThis.zzfxV||1),s=e+X+P+S+r|0;f<s;d[f++]=o*i)++l%(100*E|0)||(o=I?1<I?2<I?3<I?C(x*x):n.max(n.min(n.tan(x),1),-1):1-(2*x/t%2+2)%2:1-4*n.abs(n.round(x/t)-x/t):C(x),o=(h?1-L+L*C(t*f/h):1)*(o<0?-1:1)*n.abs(o)**c*(f<e?f/e:f<e+X?1-(f-e)/X*(1-B):f<e+X+P?B:f<s-r?(s-f-r)/S*B:0),o=r?o/2+(r>f?0:(f<s-r?1:(s-f)/r)*d[f-r|0]/2/i):o,D&&(o=Z=v*U+A*(U=W)+R*(W=o)-y*Y-m*(Y=Z))),u=(z+=T+=H)*n.cos(K*_++),x+=u+u*j*C(f**5),g&&++g>J&&(z+=V,O+=V,g=0),!h||++$%h||(z=O,T=F,g=g||1);i=zzfxX.createBuffer(1,s,a),i.getChannelData(0).set(d),z=zzfxX.createBufferSource(),z.buffer=i,z.connect(zzfxX.destination),z.start()};
+/**
+ * @param {typeof globalThis} global
+ * @returns {Function} the `zzfx()` function
+ */
+export const setupZzFX = (global) => {
+    const zzfxX = new AudioContext()
+
+    global.zzfxV = 1
+
+    return (i=1,d=.05,z=220,e=0,P=0,S=.1,I=0,c=1,T=0,H=0,V=0,J=0,h=0,j=0,K=0,E=0,r=0,B=1,X=0,L=0,D=0)=>{let n=Math,t=2*n.PI,a=44100,F=T*=500*t/a/a,O=z*=(1-d+2*d*n.random(d=[]))*t/a,x=0,_=0,f=0,g=1,$=0,l=0,o=0,s=D<0?-1:1,u=t*s*D*2/a,G=n.cos(u),C=n.sin,Q=C(u)/4,M=1+Q,m=-2*G/M,y=(1-Q)/M,R=(1+s*G)/2/M,A=-(s+G)/M,v=R,U=0,W=0,Y=0,Z=0;for(e=a*e+9,X*=a,P*=a,S*=a,r*=a,H*=500*t/a**3,K*=t/a,V*=t/a,J*=a,h=a*h|0,i*=.3*global.zzfxV,s=e+X+P+S+r|0;f<s;d[f++]=o*i)++l%(100*E|0)||(o=I?1<I?2<I?3<I?C(x*x):n.max(n.min(n.tan(x),1),-1):1-(2*x/t%2+2)%2:1-4*n.abs(n.round(x/t)-x/t):C(x),o=(h?1-L+L*C(t*f/h):1)*(o<0?-1:1)*n.abs(o)**c*(f<e?f/e:f<e+X?1-(f-e)/X*(1-B):f<e+X+P?B:f<s-r?(s-f-r)/S*B:0),o=r?o/2+(r>f?0:(f<s-r?1:(s-f)/r)*d[f-r|0]/2/i):o,D&&(o=Z=v*U+A*(U=W)+R*(W=o)-y*Y-m*(Y=Z))),u=(z+=T+=H)*n.cos(K*_++),x+=u+u*j*C(f**5),g&&++g>J&&(z+=V,O+=V,g=0),!h||++$%h||(z=O,T=F,g=g||1);i=zzfxX.createBuffer(1,s,a),i.getChannelData(0).set(d),z=zzfxX.createBufferSource(),z.buffer=i,z.connect(zzfxX.destination),z.start()};
+}

package/types/index.d.ts

@@ -8,18 +8,12 @@ export default function litecanvas(settings?: LitecanvasOptions): LitecanvasInst
 declare global {
     function litecanvas(settings?: LitecanvasOptions): LitecanvasInstance
 
-    /** The game canvas HTML element */
-    var CANVAS: HTMLCanvasElement
     /** The game screen width */
     var W: number
     /** The game screen height */
     var H: number
     /** the amount of time (in seconds) since the game started */
     var T: number
-    /** the center X of the game screen */
-    var CX: number
-    /** the center Y of the game screen */
-    var CY: number
     /** The current mouse's horizontal (X) position or -1 (if the mouse was not used or detected) */
     var MX: number
     /** The current mouse's vertical (Y) position or -1 (if the mouse was not used or detected) */
@@ -504,6 +498,10 @@ declare global {
     function iskeypressed(key: string): boolean
 
     /** PLUGINS API */
+    /**
+     * Returns the canvas
+     */
+    function canvas(): HTMLCanvasElement
     /**
      * Prepares a plugin to be loaded
      *

package/types/types.d.ts

@@ -1,16 +1,10 @@
 type LitecanvasInstance = {
-    /** The game canvas HTML element */
-    CANVAS: HTMLCanvasElement
     /** The game screen width */
     W: number
     /** The game screen height */
     H: number
     /** the amount of time (in seconds) since the game started */
     T: number
-    /** the center X of the game screen */
-    CX: number
-    /** the center Y of the game screen */
-    CY: number
     /** The current mouse's horizontal (X) position or -1 (if the mouse was not used or detected) */
     MX: number
     /** The current mouse's vertical (Y) position or -1 (if the mouse was not used or detected) */
@@ -491,6 +485,10 @@ type LitecanvasInstance = {
     iskeypressed(key: string): boolean
 
     /** PLUGINS API */
+    /**
+     * Returns the canvas
+     */
+    canvas(): HTMLCanvasElement
     /**
      * Prepares a plugin to be loaded
      *