@eyepop.ai/eyepop-render-2d 3.17.3 → 3.19.0

package/dist/eyepop.render2d.index.mjs

@@ -4150,6 +4150,121 @@ var RenderClasses = class {
   }
 };
 
+// render-depth.ts
+var TURBO_ANCHORS = [
+  [48, 18, 59],
+  [62, 86, 196],
+  [33, 145, 237],
+  [26, 192, 181],
+  [94, 223, 105],
+  [181, 229, 54],
+  [243, 192, 52],
+  [246, 117, 26],
+  [122, 4, 3]
+];
+var SKY_COLOR = [48, 18, 59];
+var isLittleEndianPlatform = new Uint8Array(new Uint16Array([1]).buffer)[0] === 1;
+function decodeDepthValues(base64, width, height) {
+  if (!Number.isSafeInteger(width) || width <= 0 || !Number.isSafeInteger(height) || height <= 0 || !Number.isSafeInteger(width * height * 4)) {
+    throw new Error(`invalid depth dimensions: ${width}x${height}`);
+  }
+  const count = width * height;
+  const buffer = Buffer.from(base64, "base64");
+  if (buffer.byteLength !== count * 4) {
+    throw new Error(`depth values hold ${buffer.byteLength} bytes, expected ${count * 4} float32 bytes`);
+  }
+  if (isLittleEndianPlatform) {
+    const aligned = new Uint8Array(buffer);
+    return new Float32Array(aligned.buffer, 0, count);
+  }
+  const view = new DataView(buffer.buffer, buffer.byteOffset, buffer.byteLength);
+  const values = new Float32Array(count);
+  for (let i = 0; i < count; i++) {
+    values[i] = view.getFloat32(i * 4, true);
+  }
+  return values;
+}
+function turboColor(position) {
+  const scaled = Math.min(Math.max(position, 0), 1) * (TURBO_ANCHORS.length - 1);
+  const lower = Math.floor(scaled);
+  const upper = Math.min(lower + 1, TURBO_ANCHORS.length - 1);
+  const fraction = scaled - lower;
+  return [
+    TURBO_ANCHORS[lower][0] * (1 - fraction) + TURBO_ANCHORS[upper][0] * fraction,
+    TURBO_ANCHORS[lower][1] * (1 - fraction) + TURBO_ANCHORS[upper][1] * fraction,
+    TURBO_ANCHORS[lower][2] * (1 - fraction) + TURBO_ANCHORS[upper][2] * fraction
+  ];
+}
+var RenderDepth = class {
+  constructor(options = {}) {
+    this.target = "$";
+    const { target = "$", opacity = 0.5, renderSky = false } = options;
+    this.target = target;
+    this.opacity = Math.min(Math.max(opacity, 0), 1);
+    this.renderSky = renderSky;
+  }
+  start(context, style) {
+    this.context = context;
+    this.style = style;
+  }
+  draw(element, xOffset, yOffset, xScale, yScale, streamTime, color) {
+    const context = this.context;
+    if (!context || !this.style) {
+      throw new Error("render() called before start()");
+    }
+    if (!element.depth) {
+      return;
+    }
+    const depthWidth = element.depth.width;
+    const depthHeight = element.depth.height;
+    const values = decodeDepthValues(element.depth.values, depthWidth, depthHeight);
+    const destWidth = Math.round(element.source_width * xScale);
+    const destHeight = Math.round(element.source_height * yScale);
+    if (destWidth <= 0 || destHeight <= 0) {
+      return;
+    }
+    let finiteMin = Number.POSITIVE_INFINITY;
+    let finiteMax = Number.NEGATIVE_INFINITY;
+    for (let i = 0; i < values.length; i++) {
+      const value = values[i];
+      if (Number.isFinite(value)) {
+        if (value < finiteMin) finiteMin = value;
+        if (value > finiteMax) finiteMax = value;
+      }
+    }
+    const span = finiteMax > finiteMin ? finiteMax - finiteMin : 1;
+    const dest = context.getImageData(xOffset, yOffset, destWidth, destHeight);
+    const pixels = dest.data;
+    for (let y = 0; y < destHeight; y++) {
+      const mapY = Math.min(Math.floor(y * depthHeight / destHeight), depthHeight - 1);
+      const mapRow = mapY * depthWidth;
+      for (let x = 0; x < destWidth; x++) {
+        const mapX = Math.min(Math.floor(x * depthWidth / destWidth), depthWidth - 1);
+        const value = values[mapRow + mapX];
+        let heat;
+        if (Number.isFinite(value)) {
+          const normalized = Number.isFinite(finiteMin) ? (value - finiteMin) / span : 0;
+          heat = turboColor(1 - normalized);
+        } else if (this.renderSky) {
+          heat = SKY_COLOR;
+        } else {
+          continue;
+        }
+        const index = (y * destWidth + x) * 4;
+        const destinationAlpha = pixels[index + 3] / 255 * (1 - this.opacity);
+        const outAlpha = this.opacity + destinationAlpha;
+        if (outAlpha > 0) {
+          pixels[index] = Math.round((heat[0] * this.opacity + pixels[index] * destinationAlpha) / outAlpha);
+          pixels[index + 1] = Math.round((heat[1] * this.opacity + pixels[index + 1] * destinationAlpha) / outAlpha);
+          pixels[index + 2] = Math.round((heat[2] * this.opacity + pixels[index + 2] * destinationAlpha) / outAlpha);
+        }
+        pixels[index + 3] = Math.round(outAlpha * 255);
+      }
+    }
+    context.putImageData(dest, xOffset, yOffset);
+  }
+};
+
 // index.ts
 var Render2d;
 ((Render2d2) => {
@@ -4177,6 +4292,10 @@ var Render2d;
     return new RenderContour(options);
   }
   Render2d2.renderContour = renderContour;
+  function renderDepth(options = {}) {
+    return new RenderDepth(options);
+  }
+  Render2d2.renderDepth = renderDepth;
   function renderFace(options = {}) {
     return new RenderFace(options);
   }
@@ -4211,6 +4330,7 @@ export {
   RenderBox,
   RenderClasses,
   RenderContour,
+  RenderDepth,
   RenderFace,
   RenderHand,
   RenderKeyPoints,