@bloopjs/toodle 0.1.4 → 0.1.6

package/dist/backends/IBackendShader.d.ts

@@ -25,6 +25,8 @@ export type QuadShaderCreationOpts = {
 export interface IBackendShader {
     /** Debug label for the shader */
     readonly label: string;
+    /** The final compiled shader code (for debugging) */
+    readonly code: string;
     /**
      * Prepare for a new frame.
      * Called once per frame before any processBatch calls.

package/dist/backends/IBackendShader.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"IBackendShader.d.ts","sourceRoot":"","sources":["../../src/backends/IBackendShader.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,4BAA4B,CAAC;AAChE,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AACpD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAC;AAElD;;GAEG;AACH,MAAM,MAAM,sBAAsB,GAAG;IACnC,iCAAiC;IACjC,KAAK,EAAE,MAAM,CAAC;IACd,oEAAoE;IACpE,aAAa,EAAE,MAAM,CAAC;IACtB,iEAAiE;IACjE,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,uCAAuC;IACvC,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,uDAAuD;IACvD,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB,CAAC;AAEF;;;;;GAKG;AACH,MAAM,WAAW,cAAc;IAC7B,iCAAiC;IACjC,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;IAEvB;;;;;OAKG;IACH,UAAU,CAAC,OAAO,EAAE,aAAa,GAAG,IAAI,CAAC;IAEzC;;;;;OAKG;IACH,YAAY,CAAC,KAAK,EAAE,SAAS,EAAE,GAAG,MAAM,CAAC;IAEzC;;;OAGG;IACH,QAAQ,IAAI,IAAI,CAAC;CAClB"}
+{"version":3,"file":"IBackendShader.d.ts","sourceRoot":"","sources":["../../src/backends/IBackendShader.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,4BAA4B,CAAC;AAChE,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AACpD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAC;AAElD;;GAEG;AACH,MAAM,MAAM,sBAAsB,GAAG;IACnC,iCAAiC;IACjC,KAAK,EAAE,MAAM,CAAC;IACd,oEAAoE;IACpE,aAAa,EAAE,MAAM,CAAC;IACtB,iEAAiE;IACjE,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,uCAAuC;IACvC,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,uDAAuD;IACvD,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB,CAAC;AAEF;;;;;GAKG;AACH,MAAM,WAAW,cAAc;IAC7B,iCAAiC;IACjC,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;IAEvB,qDAAqD;IACrD,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAC;IAEtB;;;;;OAKG;IACH,UAAU,CAAC,OAAO,EAAE,aAAa,GAAG,IAAI,CAAC;IAEzC;;;;;OAKG;IACH,YAAY,CAAC,KAAK,EAAE,SAAS,EAAE,GAAG,MAAM,CAAC;IAEzC;;;OAGG;IACH,QAAQ,IAAI,IAAI,CAAC;CAClB"}

package/dist/backends/webgl2/WebGLQuadShader.d.ts

@@ -8,6 +8,7 @@ import type { WebGLBackend } from "./WebGLBackend";
 export declare class WebGLQuadShader implements IBackendShader {
     #private;
     readonly label: string;
+    readonly code: string;
     constructor(label: string, backend: WebGLBackend, instanceCount: number, userFragmentShader?: string, atlasId?: string);
     startFrame(uniform: EngineUniform): void;
     processBatch(nodes: SceneNode[]): number;

package/dist/backends/webgl2/WebGLQuadShader.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"WebGLQuadShader.d.ts","sourceRoot":"","sources":["../../../src/backends/webgl2/WebGLQuadShader.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;AACnE,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,uBAAuB,CAAC;AAEvD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AAGxD,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAOnD;;GAEG;AACH,qBAAa,eAAgB,YAAW,cAAc;;IACpD,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;gBAiBrB,KAAK,EAAE,MAAM,EACb,OAAO,EAAE,YAAY,EACrB,aAAa,EAAE,MAAM,EACrB,kBAAkB,CAAC,EAAE,MAAM,EAC3B,OAAO,CAAC,EAAE,MAAM;IA8GlB,UAAU,CAAC,OAAO,EAAE,aAAa,GAAG,IAAI;IAkDxC,YAAY,CAAC,KAAK,EAAE,SAAS,EAAE,GAAG,MAAM;IAgDxC,QAAQ,IAAI,IAAI;IAyBhB,OAAO,IAAI,IAAI;CAMhB"}
+{"version":3,"file":"WebGLQuadShader.d.ts","sourceRoot":"","sources":["../../../src/backends/webgl2/WebGLQuadShader.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;AACnE,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,uBAAuB,CAAC;AAEvD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AAGxD,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAOnD;;GAEG;AACH,qBAAa,eAAgB,YAAW,cAAc;;IACpD,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;IACvB,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAC;gBAiBpB,KAAK,EAAE,MAAM,EACb,OAAO,EAAE,YAAY,EACrB,aAAa,EAAE,MAAM,EACrB,kBAAkB,CAAC,EAAE,MAAM,EAC3B,OAAO,CAAC,EAAE,MAAM;IA+GlB,UAAU,CAAC,OAAO,EAAE,aAAa,GAAG,IAAI;IAkDxC,YAAY,CAAC,KAAK,EAAE,SAAS,EAAE,GAAG,MAAM;IAgDxC,QAAQ,IAAI,IAAI;IAyBhB,OAAO,IAAI,IAAI;CAMhB"}

package/dist/backends/webgl2/WebGLTextShader.d.ts

@@ -13,6 +13,7 @@ import type { WebGLFontPipeline } from "./WebGLFontPipeline";
 export declare class WebGLTextShader implements ITextShader {
     #private;
     readonly label = "text";
+    readonly code: string;
     readonly font: MsdfFont;
     readonly maxCharCount: number;
     constructor(backend: WebGLBackend, pipeline: WebGLFontPipeline);

package/dist/backends/webgl2/WebGLTextShader.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"WebGLTextShader.d.ts","sourceRoot":"","sources":["../../../src/backends/webgl2/WebGLTextShader.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;AACnE,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,uBAAuB,CAAC;AAEvD,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,qBAAqB,CAAC;AAOpD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAElD,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AACnD,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AAE7D;;;;;GAKG;AACH,qBAAa,eAAgB,YAAW,WAAW;;IACjD,QAAQ,CAAC,KAAK,UAAU;IACxB,QAAQ,CAAC,IAAI,EAAE,QAAQ,CAAC;IACxB,QAAQ,CAAC,YAAY,EAAE,MAAM,CAAC;gBAqBlB,OAAO,EAAE,YAAY,EAAE,QAAQ,EAAE,iBAAiB;IAmD9D,UAAU,CAAC,OAAO,EAAE,aAAa,GAAG,IAAI;IAIxC,YAAY,CAAC,KAAK,EAAE,SAAS,EAAE,GAAG,MAAM;IA+IxC,QAAQ,IAAI,IAAI;IAyBhB,OAAO,IAAI,IAAI;CAMhB"}
+{"version":3,"file":"WebGLTextShader.d.ts","sourceRoot":"","sources":["../../../src/backends/webgl2/WebGLTextShader.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;AACnE,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,uBAAuB,CAAC;AAEvD,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,qBAAqB,CAAC;AAOpD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAElD,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AACnD,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AAE7D;;;;;GAKG;AACH,qBAAa,eAAgB,YAAW,WAAW;;IACjD,QAAQ,CAAC,KAAK,UAAU;IACxB,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAkB;IACvC,QAAQ,CAAC,IAAI,EAAE,QAAQ,CAAC;IACxB,QAAQ,CAAC,YAAY,EAAE,MAAM,CAAC;gBAqBlB,OAAO,EAAE,YAAY,EAAE,QAAQ,EAAE,iBAAiB;IAmD9D,UAAU,CAAC,OAAO,EAAE,aAAa,GAAG,IAAI;IAIxC,YAAY,CAAC,KAAK,EAAE,SAAS,EAAE,GAAG,MAAM;IA+IxC,QAAQ,IAAI,IAAI;IAyBhB,OAAO,IAAI,IAAI;CAMhB"}

package/dist/backends/webgpu/WebGPUTextShader.d.ts

@@ -7,6 +7,7 @@ import type { WebGPUBackend } from "./WebGPUBackend";
 export declare class WebGPUTextShader implements ITextShader {
     #private;
     readonly label = "text";
+    readonly code: string;
     constructor(backend: WebGPUBackend, pipeline: FontPipeline, font: MsdfFont, _colorFormat: GPUTextureFormat, instanceCount: number);
     startFrame(uniform: EngineUniform): void;
     processBatch(nodes: SceneNode[]): number;

package/dist/backends/webgpu/WebGPUTextShader.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"WebGPUTextShader.d.ts","sourceRoot":"","sources":["../../../src/backends/webgpu/WebGPUTextShader.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;AACnE,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,uBAAuB,CAAC;AAEvD,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,qBAAqB,CAAC;AAMpD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAClD,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AACnD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAUrD,qBAAa,gBAAiB,YAAW,WAAW;;IAClD,QAAQ,CAAC,KAAK,UAAU;gBAgBtB,OAAO,EAAE,aAAa,EACtB,QAAQ,EAAE,YAAY,EACtB,IAAI,EAAE,QAAQ,EACd,YAAY,EAAE,gBAAgB,EAC9B,aAAa,EAAE,MAAM;IAqEvB,UAAU,CAAC,OAAO,EAAE,aAAa,GAAG,IAAI;IAWxC,YAAY,CAAC,KAAK,EAAE,SAAS,EAAE,GAAG,MAAM;IAkGxC,QAAQ,IAAI,IAAI;IAIhB,IAAI,IAAI,aAEP;IAED,IAAI,YAAY,WAEf;CACF"}
+{"version":3,"file":"WebGPUTextShader.d.ts","sourceRoot":"","sources":["../../../src/backends/webgpu/WebGPUTextShader.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;AACnE,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,uBAAuB,CAAC;AAEvD,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,qBAAqB,CAAC;AAMpD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAClD,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AACnD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAUrD,qBAAa,gBAAiB,YAAW,WAAW;;IAClD,QAAQ,CAAC,KAAK,UAAU;IACxB,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAc;gBAgBjC,OAAO,EAAE,aAAa,EACtB,QAAQ,EAAE,YAAY,EACtB,IAAI,EAAE,QAAQ,EACd,YAAY,EAAE,gBAAgB,EAC9B,aAAa,EAAE,MAAM;IAqEvB,UAAU,CAAC,OAAO,EAAE,aAAa,GAAG,IAAI;IAWxC,YAAY,CAAC,KAAK,EAAE,SAAS,EAAE,GAAG,MAAM;IAkGxC,QAAQ,IAAI,IAAI;IAIhB,IAAI,IAAI,aAEP;IAED,IAAI,YAAY,WAEf;CACF"}

package/dist/mod.js

@@ -3602,6 +3602,7 @@ var INSTANCE_BYTES = INSTANCE_FLOATS * Float32Array.BYTES_PER_ELEMENT;
 
 class WebGLQuadShader {
   label;
+  code;
   #backend;
   #atlas;
   #program;
@@ -3620,6 +3621,7 @@ class WebGLQuadShader {
     }
     this.#atlas = atlas;
     this.label = label;
+    this.code = userFragmentShader ?? fragmentShader;
     this.#backend = backend;
     this.#instanceCount = instanceCount;
     const gl = backend.gl;
@@ -18154,6 +18156,7 @@ void main() {
 // src/backends/webgl2/WebGLTextShader.ts
 class WebGLTextShader {
   label = "text";
+  code = fragmentShader2;
   font;
   maxCharCount;
   #backend;
@@ -18656,6 +18659,7 @@ var textDescriptorInstanceSize = struct.size;
 
 class WebGPUTextShader {
   label = "text";
+  code = text_wgsl_default;
   #backend;
   #pipeline;
   #bindGroups = [];
@@ -19926,6 +19930,105 @@ async function textureToBitmap(device, texture, width, height) {
   readBuffer.unmap();
   return bitmap;
 }
+async function packBitmapsToAtlasCPU(images, textureSize) {
+  const cpuTextureAtlases = [];
+  const packed = [];
+  const spaces = [
+    { x: 0, y: 0, width: textureSize, height: textureSize }
+  ];
+  let atlasRegionMap = new Map;
+  for (const [id, { bitmap }] of images) {
+    let bestSpace = -1;
+    let bestScore = Number.POSITIVE_INFINITY;
+    for (let i3 = 0;i3 < spaces.length; i3++) {
+      const space2 = spaces[i3];
+      if (bitmap.width <= space2.width && bitmap.height <= space2.height) {
+        const score = Math.abs(space2.width * space2.height - bitmap.width * bitmap.height);
+        if (score < bestScore) {
+          bestScore = score;
+          bestSpace = i3;
+        }
+      }
+    }
+    if (bestSpace === -1) {
+      const tex2 = createAtlasBitmapFromPacked(packed, textureSize);
+      cpuTextureAtlases.push({
+        texture: tex2,
+        textureRegions: atlasRegionMap,
+        width: tex2.width,
+        height: tex2.height
+      });
+      atlasRegionMap = new Map;
+      packed.length = 0;
+      spaces.length = 0;
+      spaces.push({
+        x: 0,
+        y: 0,
+        width: textureSize,
+        height: textureSize
+      });
+      bestSpace = 0;
+    }
+    const space = spaces[bestSpace];
+    packed.push({
+      texture: bitmap,
+      x: space.x,
+      y: space.y,
+      width: bitmap.width,
+      height: bitmap.height
+    });
+    spaces.splice(bestSpace, 1);
+    if (space.width - bitmap.width > 0) {
+      spaces.push({
+        x: space.x + bitmap.width,
+        y: space.y,
+        width: space.width - bitmap.width,
+        height: bitmap.height
+      });
+    }
+    if (space.height - bitmap.height > 0) {
+      spaces.push({
+        x: space.x,
+        y: space.y + bitmap.height,
+        width: space.width,
+        height: space.height - bitmap.height
+      });
+    }
+    const uvScale = {
+      width: bitmap.width / textureSize,
+      height: bitmap.height / textureSize
+    };
+    atlasRegionMap.set(id, {
+      uvOffset: {
+        x: space.x / textureSize,
+        y: space.y / textureSize
+      },
+      uvScale,
+      uvScaleCropped: uvScale,
+      cropOffset: { x: 0, y: 0 },
+      originalSize: { width: bitmap.width, height: bitmap.height }
+    });
+  }
+  const tex = createAtlasBitmapFromPacked(packed, textureSize);
+  cpuTextureAtlases.push({
+    texture: tex,
+    textureRegions: atlasRegionMap,
+    width: tex.width,
+    height: tex.height
+  });
+  return cpuTextureAtlases;
+}
+function createAtlasBitmapFromPacked(packed, atlasSize) {
+  const canvas = new OffscreenCanvas(atlasSize, atlasSize);
+  const ctx = canvas.getContext("2d");
+  if (!ctx) {
+    throw new Error("Failed to get 2d context from OffscreenCanvas");
+  }
+  for (const texture of packed) {
+    ctx.drawImage(texture.texture, texture.x, texture.y);
+  }
+  return canvas.transferToImageBitmap();
+}
 
 // src/textures/AssetManager.ts
 class AssetManager {
@@ -20115,24 +20218,31 @@ class AssetManager {
     return texture;
   }
   async#registerBundleFromTextures(bundleId, opts) {
-    if (this.#backend.type !== "webgpu") {
-      throw new Error("Dynamic texture bundle registration is only supported with WebGPU backend. Use prebaked atlases instead.");
-    }
-    const device = this.#backend.device;
-    const images = new Map;
-    let _networkLoadTime = 0;
-    await Promise.all(Object.entries(opts.textures).map(async ([id, url]) => {
-      const now = performance.now();
-      const bitmap = await getBitmapFromUrl(url);
-      _networkLoadTime += performance.now() - now;
-      let textureWrapper = this.#wrapBitmapToTexture(bitmap, id);
-      if (opts.cropTransparentPixels && this.#cropComputeShader) {
-        textureWrapper = await this.#cropComputeShader.processTexture(textureWrapper);
+    if (this.#backend.type === "webgpu") {
+      const device = this.#backend.device;
+      const images = new Map;
+      await Promise.all(Object.entries(opts.textures).map(async ([id, url]) => {
+        const bitmap = await getBitmapFromUrl(url);
+        let textureWrapper = this.#wrapBitmapToTexture(bitmap, id);
+        if (opts.cropTransparentPixels && this.#cropComputeShader) {
+          textureWrapper = await this.#cropComputeShader.processTexture(textureWrapper);
+        }
+        images.set(id, textureWrapper);
+      }));
+      const atlases = await packBitmapsToAtlas(images, this.#backend.limits.textureSize, device);
+      this.bundles.registerDynamicBundle(bundleId, atlases);
+    } else {
+      if (opts.cropTransparentPixels) {
+        console.warn("cropTransparentPixels is not supported on WebGL2 backend and will be ignored.");
       }
-      images.set(id, textureWrapper);
-    }));
-    const atlases = await packBitmapsToAtlas(images, this.#backend.limits.textureSize, device);
-    this.bundles.registerDynamicBundle(bundleId, atlases);
+      const images = new Map;
+      await Promise.all(Object.entries(opts.textures).map(async ([id, url]) => {
+        const bitmap = await getBitmapFromUrl(url);
+        images.set(id, { bitmap, id });
+      }));
+      const atlases = await packBitmapsToAtlasCPU(images, this.#backend.limits.textureSize);
+      this.bundles.registerDynamicBundle(bundleId, atlases);
+    }
   }
   async#registerBundleFromAtlases(bundleId, opts) {
     await this.bundles.registerAtlasBundle(bundleId, opts);
@@ -20798,5 +20908,5 @@ export {
   AssetManager
 };
 
-//# debugId=4A88BA8B6CA05C3D64756E2164756E21
+//# debugId=8FA83A386B693B6064756E2164756E21
 //# sourceMappingURL=mod.js.map