rayzee 5.10.2 → 5.11.0

package/README.md

@@ -230,7 +230,10 @@ const engine = new PathTracerApp(canvas, options?)
 | `canvas` | `HTMLCanvasElement` | Rendering target |
 | `options.autoResize` | `boolean` | Auto-resize on window resize (default: `true`) |
 | `options.showStats` | `boolean` | Show the performance stats panel (default: `true`) |
-| `options.statsContainer` | `HTMLElement` | DOM element to append the stats panel to (defaults to `document.body`) |
+| `options.container` | `HTMLElement` | Single DOM parent the engine mounts auxiliary elements into — HUD overlay (tile borders, helpers), denoiser canvas, and stats panel. Defaults to `canvas.parentNode`. |
+| `options.statsContainer` | `HTMLElement` | Override mount target for the stats panel only. Defaults to `options.container`. |
+
+The engine creates and mounts everything it needs (denoiser canvas, tile/HUD overlay, stats) into a single parent on `init()`
 
 #### Lifecycle
 

package/dist/rayzee.es.js

@@ -6618,8 +6618,8 @@ var Xs = 16, Zs = class {
 	generateHash(e) {
 		let t = "";
 		for (let n of e) if (n?.image) {
-			let e = n.image.width || 0, r = n.image.height || 0, i = n.image.src || n.uuid || "";
-			t += `${e}x${r}_${i.slice(-8)}_`;
+			let e = n.image.width || 0, r = n.image.height || 0, i = n.image.src || n.uuid || "", a = n.flipY === !1 ? "n" : "f";
+			t += `${e}x${r}_${i.slice(-8)}_${a}_`;
 		}
 		return t + e.length;
 	}
@@ -6735,28 +6735,32 @@ var Xs = 16, Zs = class {
 	}
 	async prepareTexturesForWorkerDirect(e) {
 		let t = [];
-		for (let n of e) if (n?.image) try {
-			if (typeof createImageBitmap < "u" && n.image instanceof HTMLImageElement) {
-				let e = await createImageBitmap(n.image);
-				t.push({
-					bitmap: e,
-					width: n.image.width,
-					height: n.image.height,
-					isDirect: !0
-				});
-			} else {
-				let e = this.canvasPool.getCanvasWithContext(n.image.width, n.image.height);
-				e.context.drawImage(n.image, 0, 0);
-				let r = e.context.getImageData(0, 0, n.image.width, n.image.height);
-				t.push({
-					data: r.data.buffer,
-					width: n.image.width,
-					height: n.image.height,
-					isImageData: !0
-				}), this.canvasPool.releaseCanvasWithContext(e);
+		for (let n of e) {
+			if (!n?.image) continue;
+			let e = n.flipY !== !1;
+			try {
+				if (typeof createImageBitmap < "u" && n.image instanceof HTMLImageElement) {
+					let r = await createImageBitmap(n.image, { imageOrientation: e ? "flipY" : "none" });
+					t.push({
+						bitmap: r,
+						width: n.image.width,
+						height: n.image.height,
+						isDirect: !0
+					});
+				} else {
+					let r = n.image.width, i = n.image.height, a = await createImageBitmap(n.image, { imageOrientation: e ? "flipY" : "none" }), o = this.canvasPool.getCanvasWithContext(r, i);
+					o.context.drawImage(a, 0, 0), a.close();
+					let s = o.context.getImageData(0, 0, r, i);
+					t.push({
+						data: s.data.buffer,
+						width: r,
+						height: i,
+						isImageData: !0
+					}), this.canvasPool.releaseCanvasWithContext(o);
+				}
+			} catch (e) {
+				console.warn("Failed to prepare texture for worker:", e);
 			}
-		} catch (e) {
-			console.warn("Failed to prepare texture for worker:", e);
 		}
 		return t;
 	}
@@ -6775,12 +6779,13 @@ var Xs = 16, Zs = class {
 		for (let e = 0; e < n.length; e += t) {
 			let a = Math.min(e + t, n.length), s = [];
 			for (let t = e; t < a; t++) {
-				let e = n[t], a = createImageBitmap(e.image, {
+				let e = n[t], a = e.flipY !== !1, o = createImageBitmap(e.image, {
 					resizeWidth: r,
 					resizeHeight: i,
-					resizeQuality: "high"
+					resizeQuality: "high",
+					imageOrientation: a ? "flipY" : "none"
 				});
-				s.push(a.then((e) => ({
+				s.push(o.then((e) => ({
 					bitmap: e,
 					index: t
 				})));
@@ -6802,10 +6807,15 @@ var Xs = 16, Zs = class {
 		let { maxWidth: n, maxHeight: r } = this.calculateOptimalDimensions(t), i = t.length, a = this.bufferPool.getBuffer(n * r * i * 4, Uint8Array), o = this.canvasPool.getCanvasWithContext(n, r);
 		o.context.imageSmoothingEnabled = !0, o.context.imageSmoothingQuality = "high";
 		for (let e = 0; e < t.length; e++) {
-			let i = t[e];
-			o.context.clearRect(0, 0, n, r), o.context.drawImage(i.image, 0, 0, n, r);
-			let s = o.context.getImageData(0, 0, n, r), c = n * r * 4 * e;
-			a.set(s.data, c), e % $n.STREAM_BATCH_SIZE === 0 && await new Promise((e) => setTimeout(e, 0));
+			let i = t[e], s = await createImageBitmap(i.image, {
+				resizeWidth: n,
+				resizeHeight: r,
+				resizeQuality: "high",
+				imageOrientation: i.flipY === !1 ? "none" : "flipY"
+			});
+			o.context.clearRect(0, 0, n, r), o.context.drawImage(s, 0, 0), s.close();
+			let c = o.context.getImageData(0, 0, n, r), l = n * r * 4 * e;
+			a.set(c.data, l), e % $n.STREAM_BATCH_SIZE === 0 && await new Promise((e) => setTimeout(e, 0));
 		}
 		return this.canvasPool.releaseCanvasWithContext(o), this.createDataArrayTextureFromBuffer(a, n, r, i);
 	}
@@ -6815,10 +6825,15 @@ var Xs = 16, Zs = class {
 		let { maxWidth: n, maxHeight: r } = this.calculateOptimalDimensions(t), i = t.length, a = this.bufferPool.getBuffer(n * r * i * 4, Uint8Array), o = this.canvasPool.getCanvasWithContext(n, r);
 		o.context.imageSmoothingEnabled = !0, o.context.imageSmoothingQuality = "high";
 		for (let e = 0; e < t.length; e++) {
-			let i = t[e];
-			o.context.clearRect(0, 0, n, r), o.context.drawImage(i.image, 0, 0, n, r);
-			let s = o.context.getImageData(0, 0, n, r), c = n * r * 4 * e;
-			a.set(s.data, c);
+			let i = t[e], s = await createImageBitmap(i.image, {
+				resizeWidth: n,
+				resizeHeight: r,
+				resizeQuality: "high",
+				imageOrientation: i.flipY === !1 ? "none" : "flipY"
+			});
+			o.context.clearRect(0, 0, n, r), o.context.drawImage(s, 0, 0), s.close();
+			let c = o.context.getImageData(0, 0, n, r), l = n * r * 4 * e;
+			a.set(c.data, l);
 		}
 		return this.canvasPool.releaseCanvasWithContext(o), this.createDataArrayTextureFromBuffer(a, n, r, i);
 	}
@@ -7076,6 +7091,7 @@ var Xs = 16, Zs = class {
 				let e = n.mipmaps[0], i = t.length;
 				t.push(null), r.push({
 					index: i,
+					flipY: n.flipY,
 					promise: ac(e.data, e.width, e.height)
 				});
 				continue;
@@ -7088,6 +7104,7 @@ var Xs = 16, Zs = class {
 				let e = t.length;
 				t.push(null), r.push({
 					index: e,
+					flipY: n.flipY,
 					promise: ac(n.image.data, n.image.width, n.image.height)
 				});
 				continue;
@@ -7097,11 +7114,14 @@ var Xs = 16, Zs = class {
 		if (r.length > 0) {
 			let e = await Promise.allSettled(r.map((e) => e.promise));
 			for (let i = 0; i < r.length; i++) {
-				let { index: a } = r[i], o = e[i];
-				if (o.status === "fulfilled") {
-					let e = o.value;
-					n.push(e), t[a] = { image: e };
-				} else console.warn("[TextureCreator] Failed to create ImageBitmap:", o.reason);
+				let { index: a, flipY: o } = r[i], s = e[i];
+				if (s.status === "fulfilled") {
+					let e = s.value;
+					n.push(e), t[a] = {
+						image: e,
+						flipY: o
+					};
+				} else console.warn("[TextureCreator] Failed to create ImageBitmap:", s.reason);
 			}
 		}
 		for (let e = 0; e < t.length; e++) if (t[e] === null) {
@@ -7111,7 +7131,10 @@ var Xs = 16, Zs = class {
 				255,
 				255
 			]), i = await createImageBitmap(new ImageData(r, 1, 1));
-			n.push(i), t[e] = { image: i };
+			n.push(i), t[e] = {
+				image: i,
+				flipY: !1
+			};
 		}
 		return {
 			normalized: t,
@@ -12900,6 +12923,9 @@ var _l = new Float32Array(3), vl = {
 	getHUDCanvas() {
 		return this._hudCanvas;
 	}
+	mount(e) {
+		!e || this._hudCanvas.parentElement === e || e.appendChild(this._hudCanvas);
+	}
 	setupDefaultHelpers({ helperScene: e, meshScene: t, pipeline: n, denoisingManager: r, app: i, renderWidth: a, renderHeight: o }) {
 		this.setHelperScene(e);
 		let s = new Tl();
@@ -13194,7 +13220,7 @@ var _l = new Float32Array(3), vl = {
 		} catch (e) {
 			console.warn("PathTracerApp: prior canvas owner dispose failed", e);
 		}
-		Al.set(e, this), this.canvas = e, this._autoResize = t.autoResize !== !1, this._showStats = t.showStats !== !1, this._statsContainer = t.statsContainer || null, this.settings = new Yc(X), this.renderer = null, this.scene = null, this.meshScene = null, this._sceneHelpers = null, this.assetLoader = null, this._sdf = null, this._animRefitInFlight = !1, this.pipeline = null, this.stages = {}, this.cameraManager = null, this.lightManager = null, this.denoisingManager = null, this.overlayManager = null, this.interactionManager = null, this.transformManager = null, this.animationManager = new Ol(), this.environmentManager = null, this.isInitialized = !1, this.pauseRendering = !1, this.pathTracerEnabled = !0, this.animationManagerId = null, this.needsReset = !1, this._loadingInProgress = !1, this._needsDisplayRefresh = !1, this._paused = !1, this.completion = new Uc(), this._resizeDebounceTimer = null, this._trackedListeners = [], this._disposed = !1;
+		Al.set(e, this), this.canvas = e, this._autoResize = t.autoResize !== !1, this._showStats = t.showStats !== !1, this._container = t.container || null, this._statsContainer = t.statsContainer || null, this.settings = new Yc(X), this.renderer = null, this.scene = null, this.meshScene = null, this._sceneHelpers = null, this.assetLoader = null, this._sdf = null, this._animRefitInFlight = !1, this.pipeline = null, this.stages = {}, this.cameraManager = null, this.lightManager = null, this.denoisingManager = null, this.overlayManager = null, this.interactionManager = null, this.transformManager = null, this.animationManager = new Ol(), this.environmentManager = null, this.isInitialized = !1, this.pauseRendering = !1, this.pathTracerEnabled = !0, this.animationManagerId = null, this.needsReset = !1, this._loadingInProgress = !1, this._needsDisplayRefresh = !1, this._paused = !1, this.completion = new Uc(), this._resizeDebounceTimer = null, this._trackedListeners = [], this._disposed = !1;
 	}
 	_addTrackedListener(e, t, n) {
 		e && (e.addEventListener(t, n), this._trackedListeners.push({
@@ -13613,7 +13639,7 @@ var _l = new Float32Array(3), vl = {
 		}
 	}
 	_initStats() {
-		let e = this._statsContainer || this.canvas.parentElement || document.body;
+		let e = this._statsContainer || this._container || this.canvas.parentElement || document.body;
 		this._stats = en(this.renderer, e);
 	}
 	_setupAutoExposureListener() {
@@ -13637,7 +13663,7 @@ var _l = new Float32Array(3), vl = {
 			app: this,
 			renderWidth: this.denoisingManager?._lastRenderWidth || this.canvas.clientWidth || 1,
 			renderHeight: this.denoisingManager?._lastRenderHeight || this.canvas.clientHeight || 1
-		});
+		}), this._container = this._container || this.canvas.parentNode || null, this.overlayManager.mount(this._container);
 	}
 	_syncControlsAfterLoad() {
 		this.cameraManager.controls.saveState(), this.cameraManager.controls.update();