docs: Fix camera orientation in "Monocular Light Injection" example

apps/typegpu-docs/src/examples/image-processing/monocular-light-injection/camera-session.ts

@@ -3,7 +3,6 @@ import { d } from 'typegpu';
 export interface DepthCameraFrame {
   readonly source: HTMLVideoElement | VideoFrame;
   readonly uvTransform: d.m2x2f;
-  readonly swapAxes: boolean;
 }
 
 interface DepthCameraSessionCallbacks {
@@ -21,18 +20,17 @@ interface DepthCameraSessionOptions {
 
 const IS_IOS = /iPad|iPhone|iPod/.test(navigator.userAgent);
 
-type FrameTransform = Pick<DepthCameraFrame, 'uvTransform' | 'swapAxes'>;
+type FrameTransform = Pick<DepthCameraFrame, 'uvTransform'>;
 
 const UPRIGHT_TRANSFORM: FrameTransform = {
   uvTransform: d.mat2x2f.identity(),
-  swapAxes: false,
 };
 
 /** Only iOS hands the capture over in the device's own orientation */
 const IOS_TRANSFORMS: Partial<Record<OrientationType, FrameTransform>> = {
-  'portrait-primary': { uvTransform: d.mat2x2f(0, -1, 1, 0), swapAxes: true },
-  'portrait-secondary': { uvTransform: d.mat2x2f(0, 1, -1, 0), swapAxes: true },
-  'landscape-primary': { uvTransform: d.mat2x2f(-1, 0, 0, -1), swapAxes: false },
+  'portrait-primary': { uvTransform: d.mat2x2f(0, -1, 1, 0) },
+  'portrait-secondary': { uvTransform: d.mat2x2f(0, 1, -1, 0) },
+  'landscape-primary': { uvTransform: d.mat2x2f(-1, 0, 0, -1) },
 };
 
 function frameTransform(): FrameTransform {

apps/typegpu-docs/src/examples/image-processing/monocular-light-injection/index.ts

@@ -98,7 +98,7 @@ function startStaticLoop(bitmap: ImageBitmap): void {
       const source = new VideoFrame(bitmap, { timestamp: performance.now() * 1000 });
       try {
         activeRenderer.render(
-          { source, uvTransform: d.mat2x2f.identity(), swapAxes: false },
+          { source, uvTransform: d.mat2x2f.identity() },
           { skipDepth: !depthDirty },
         );
         depthDirty = false;

apps/typegpu-docs/src/examples/image-processing/monocular-light-injection/inference/preprocess.ts

@@ -16,15 +16,12 @@ const CUBIC_TAPS = [-1, 0, 1, 2] as const;
 export interface DepthFrameOptions {
   readonly mirrorX: boolean;
   readonly uvTransform: d.m2x2f;
-  /** Whether the UV transform exchanges the texture's width and height axes */
-  readonly swapAxes: boolean;
 }
 
 const FrameParams = d.struct({
   uvTransform: d.mat2x2f,
   outputSize: d.vec2u,
   mirrorX: d.u32,
-  swapAxes: d.u32,
   total: d.u32,
 });
 
@@ -75,10 +72,7 @@ const depthFramePreprocessKernel = tgpu.computeFn({
   const outputY = std.intdiv(index, params.outputSize.x);
   const sourceOutputX = params.mirrorX === 0 ? outputX : params.outputSize.x - 1 - outputX;
   const outputPixel = d.vec2f(sourceOutputX, outputY);
-  let sourceSize = d.vec2f(std.textureDimensions(preprocessLayout.$.frame));
-  if (params.swapAxes !== 0) {
-    sourceSize = sourceSize.yx;
-  }
+  const sourceSize = d.vec2f(std.textureDimensions(preprocessLayout.$.frame));
   const side = std.min(sourceSize.x, sourceSize.y);
   const cropOrigin = (sourceSize - side) * 0.5;
   const sourcePixel =
@@ -135,7 +129,6 @@ export class DepthFramePreprocessor {
       uvTransform: options.uvTransform,
       outputSize: d.vec2u(outputWidth, outputHeight),
       mirrorX: options.mirrorX ? 1 : 0,
-      swapAxes: options.swapAxes ? 1 : 0,
       total: outputWidth * outputHeight,
     });
 

apps/typegpu-docs/src/examples/image-processing/monocular-light-injection/renderer.ts

@@ -105,7 +105,6 @@ export class DepthRelightingRenderer {
   #plan: DepthInferencePlan | undefined;
   #attachment: RelightAttachment | undefined;
   #uvTransform = d.mat2x2f.identity();
-  #swapAxes = false;
   #firstFrame = true;
   #settings: RelightingState = defaultRelightingSettings;
 
@@ -226,7 +225,6 @@ export class DepthRelightingRenderer {
 
     this.#syncCanvasSize();
     this.#uvTransform = frame.uvTransform;
-    this.#swapAxes = frame.swapAxes;
     this.#writeRelightParams();
     if (updateDepth) {
       this.#depthParams.patch({ reset: this.#firstFrame ? 1 : 0 });
@@ -239,7 +237,6 @@ export class DepthRelightingRenderer {
       plan.encodeFrame(pass, externalFrame, {
         uvTransform: frame.uvTransform,
         mirrorX: this.#settings.mirror,
-        swapAxes: frame.swapAxes,
       });
       this.#rangeEstimator.encode(pass);
       this.#stabilizePipeline.with(pass).with(this.#rangeBindGroup).dispatchWorkgroups(1);
@@ -301,7 +298,6 @@ export class DepthRelightingRenderer {
       specular: this.#settings.specular,
       shadow: this.#settings.shadow,
       occlusion: this.#settings.occlusion,
-      swapAxes: this.#swapAxes ? 1 : 0,
       mirror: this.#settings.mirror ? 1 : 0,
       mode: this.#settings.mode,
     });

apps/typegpu-docs/src/examples/image-processing/monocular-light-injection/shaders.ts

@@ -92,7 +92,6 @@ export const RelightParams = d.struct({
   specular: d.f32,
   shadow: d.f32,
   occlusion: d.f32,
-  swapAxes: d.u32,
   mirror: d.u32,
   mode: d.u32,
 });
@@ -259,10 +258,7 @@ function depthAt(uv: d.v2f): number {
 
 function cameraUvAt(uv: d.v2f): d.v2f {
   'use gpu';
-  let sourceSize = d.vec2f(std.textureDimensions(relightFrameLayout.$.frame));
-  if (relightLayout.$.params.swapAxes !== 0) {
-    sourceSize = d.vec2f(sourceSize.yx);
-  }
+  const sourceSize = d.vec2f(std.textureDimensions(relightFrameLayout.$.frame));
   let framed = d.vec2f(uv);
   if (relightLayout.$.params.mirror !== 0) {
     framed = d.vec2f(1 - uv.x, uv.y);