@downdraft/engine 0.0.0 → 0.1.1

package/modules/xr/src/frame-loop.ts

@@ -0,0 +1,197 @@
+// ============================================================================
+// XRFrameLoop — drives the XR render loop through the RendererModuleContext
+//
+// Installs XR-specific overrides on the RendererModuleContext:
+//  - XR rAF source (session.requestAnimationFrame instead of window.rAF)
+//  - XR render target provider (per-eye XRGPULayer textures)
+//  - Viewport camera provider (per-eye stereo cameras)
+//  - Stereo viewport count (2)
+//  - beforeFrame hook (XR input mapping)
+//
+// On stop(), all overrides are cleared and the desktop render loop resumes.
+// ============================================================================
+
+import type {
+    CameraViewportInfo,
+    InputState,
+    RendererModuleContext,
+    RenderSurface,
+    RenderTargetProvider,
+    ViewportRect,
+} from "@downdraft/engine";
+import type { XRCameraRig } from "./camera-rig";
+import type { XRInputMapper } from "./input";
+import type { XRLayerManager } from "./layer";
+import type { XRSessionManager } from "./session";
+
+const DEFAULT_VIEWPORT: ViewportRect = { x: 0, y: 0, w: 1, h: 1 };
+
+class XRRenderTargetProvider implements RenderTargetProvider {
+  private layerManager: XRLayerManager;
+
+  constructor(layerManager: XRLayerManager) {
+    this.layerManager = layerManager;
+  }
+
+  getColorView(viewportIdx: number): GPUTextureView {
+    const eye = viewportIdx === 0 ? "left" : "right";
+    return this.layerManager.getColorTextureView(eye);
+  }
+
+  getDepthView(viewportIdx: number, _w: number, _h: number): GPUTextureView {
+    const eye = viewportIdx === 0 ? "left" : "right";
+    return this.layerManager.getDepthTextureView(eye);
+  }
+
+  getViewportCount(): number {
+    return 2;
+  }
+
+  getViewportRect(idx: number, _screenW: number, _screenH: number): ViewportRect {
+    const eye = idx === 0 ? "left" : "right";
+    const vp = this.layerManager.getViewport(eye);
+    if (vp) {
+      return { x: vp.x, y: vp.y, w: vp.width, h: vp.height };
+    }
+    return DEFAULT_VIEWPORT;
+  }
+
+  beginFrame(): void {
+    // no-op — layer views are updated in XRFrameLoop.onXRFrame before renderFrame
+  }
+
+  endFrame(_encoder: GPUCommandEncoder): void {
+    // no-op — XRGPULayer textures are consumed by the XR compositor automatically
+  }
+}
+
+export interface XRFrameLoopOptions {
+  inputState?: InputState | null;
+  inputMapper?: XRInputMapper | null;
+  canvas: RenderSurface;
+}
+
+export class XRFrameLoop {
+  private ctx: RendererModuleContext;
+  private sessionManager: XRSessionManager;
+  private layerManager: XRLayerManager;
+  private cameraRig: XRCameraRig;
+  private inputState: InputState | null;
+  private inputMapper: XRInputMapper | null;
+  private canvas: RenderSurface;
+
+  private targetProvider: XRRenderTargetProvider;
+  private active = false;
+  private currentFrame: XRFrame | null = null;
+
+  // Unsubscribe fns for context hooks installed during start().
+  private unsubBeforeFrame: (() => void) | null = null;
+
+  constructor(
+    ctx: RendererModuleContext,
+    sessionManager: XRSessionManager,
+    layerManager: XRLayerManager,
+    cameraRig: XRCameraRig,
+    options: XRFrameLoopOptions,
+  ) {
+    this.ctx = ctx;
+    this.sessionManager = sessionManager;
+    this.layerManager = layerManager;
+    this.cameraRig = cameraRig;
+    this.inputState = options.inputState ?? null;
+    this.inputMapper = options.inputMapper ?? null;
+    this.canvas = options.canvas;
+    this.targetProvider = new XRRenderTargetProvider(layerManager);
+  }
+
+  start(): void {
+    if (this.active) return;
+    const session = this.sessionManager.getSession();
+    if (!session) throw new Error("No active XR session");
+
+    this.active = true;
+
+    // Install XR rAF source
+    this.ctx.setRAFSource(
+      (cb: (time: number) => void) => session.requestAnimationFrame((time: number, frame: XRFrame) => {
+        this.onXRFrame(time, frame);
+        cb(time);
+      }),
+      (id: number) => session.cancelAnimationFrame(id),
+    );
+
+    // Install XR render target provider
+    this.ctx.setRenderTargetProvider(this.targetProvider);
+
+    // Set viewport count to 2 for stereo
+    this.ctx.setViewportCount(2);
+
+    // Install per-eye viewport camera provider (takes priority over the
+    // game's onViewport callback)
+    this.ctx.setViewportCameraProvider((viewportIdx, _dt, _elapsedTime) => {
+      const eye = viewportIdx === 0 ? "left" : "right";
+      const [left, right] = this.cameraRig.computeEyeCameras(
+        this.canvas.width,
+        this.canvas.height,
+      );
+      const cam = eye === "left" ? left : right;
+      if (!cam) return null;
+      return cam as CameraViewportInfo;
+    });
+
+    // Install beforeFrame hook for XR input mapping
+    this.unsubBeforeFrame = this.ctx.onFrame("beforeFrame", (_dt, _elapsedTime) => {
+      const refSpace = this.sessionManager.getReferenceSpace();
+      if (refSpace && this.currentFrame && this.inputMapper && this.inputState) {
+        this.inputMapper.update(this.currentFrame, refSpace, this.inputState);
+      }
+    });
+  }
+
+  stop(): void {
+    if (!this.active) return;
+    this.active = false;
+    this.currentFrame = null;
+
+    // Restore desktop rAF
+    this.ctx.setRAFSource(null, null);
+
+    // Remove XR render target provider
+    this.ctx.setRenderTargetProvider(null);
+
+    // Restore viewport count to 1
+    this.ctx.setViewportCount(1);
+
+    // Remove viewport camera provider
+    this.ctx.setViewportCameraProvider(null);
+
+    // Remove beforeFrame hook
+    this.unsubBeforeFrame?.();
+    this.unsubBeforeFrame = null;
+
+    // Clear XR controller state from input
+    if (this.inputState) {
+      this.inputState.xrControllers = [];
+    }
+  }
+
+  private onXRFrame(_time: number, frame: XRFrame): void {
+    this.currentFrame = frame;
+
+    const refSpace = this.sessionManager.getReferenceSpace();
+    if (!refSpace) return;
+
+    const pose = frame.getViewerPose(refSpace);
+    if (!pose) return;
+
+    // Update layer views from the pose
+    this.layerManager.beginFrame(frame, refSpace);
+
+    // Update head pose for game logic
+    this.cameraRig.updateHeadPose(pose, refSpace);
+  }
+
+  isActive(): boolean {
+    return this.active;
+  }
+}

package/modules/xr/src/index.ts

@@ -0,0 +1,16 @@
+/// <reference path="./webxr.d.ts" />
+export { XRCameraRig } from "./camera-rig";
+export { checkXRSupport, formatXRDebugInfo, getXRDebugInfo } from "./debug";
+export type { XRDebugInfo } from "./debug";
+export { XRFrameLoop } from "./frame-loop";
+export type { XRFrameLoopOptions } from "./frame-loop";
+export { XRInputMapper } from "./input";
+export { XRLayerManager } from "./layer";
+export type { XREye, XRViewportRect } from "./layer";
+export { isVRSupported, isXRAvailable, isXRGPUBindingAvailable, XRSessionManager } from "./session";
+export { xrModule } from "./sim-module";
+export { DEFAULT_XR_CONFIG } from "./types";
+export type { XREventMap, XRPoseData, XRReferenceSpaceType, XRSessionConfig, XRSessionState, XRWorldOrigin } from "./types";
+export { XRModule } from "./xr-module";
+export type { XRModuleOptions } from "./xr-module";
+

package/modules/xr/src/input.ts

@@ -0,0 +1,208 @@
+import { type InputState, type XRControllerState } from "@downdraft/engine";
+import type { XRPoseData } from "./types";
+
+const KEY_ESCAPE = 27;
+const KEY_A = 65;
+const KEY_B = 66;
+const KEY_X = 88;
+const KEY_Y = 89;
+
+interface XRInputSourceLike {
+  handedness: "left" | "right" | "none";
+  targetRayMode: "tracked-pointer" | "gaze" | "screen";
+  gamepad: Gamepad | null;
+  profiles: string[];
+}
+
+interface ControllerPoseCache {
+  aimPose: XRPoseData | null;
+  gripPose: XRPoseData | null;
+  handedness: "left" | "right" | "none";
+}
+
+export class XRInputMapper {
+  private controllers: ControllerPoseCache[] = [];
+  private prevButtonStates: boolean[][] = [];
+
+  update(frame: XRFrame, referenceSpace: XRReferenceSpace, inputState: InputState): void {
+    const session = frame.session;
+    const sources = session.inputSources;
+
+    const controllers: XRControllerState[] = [];
+    this.controllers = [];
+
+    let gamepadIdx = 0;
+
+    for (let i = 0; i < sources.length; i++) {
+      const source = sources[i] as unknown as XRInputSourceLike;
+
+      if (source.targetRayMode !== "tracked-pointer") continue;
+
+      const handedness = source.handedness;
+      const gamepad = source.gamepad;
+
+      // Get aim and grip poses
+      const aimPose = this.getPose(frame, source as unknown as XRInputSource, referenceSpace, "target-ray");
+      const gripPose = this.getPose(frame, source as unknown as XRInputSource, referenceSpace, "grip");
+
+      this.controllers.push({
+        aimPose,
+        gripPose,
+        handedness,
+      });
+
+      // Build XRControllerState
+      if (aimPose || gripPose) {
+        const ctrl: XRControllerState = {
+          aimPosition: aimPose?.position ?? [0, 0, 0],
+          aimQuaternion: aimPose?.quaternion ?? [0, 0, 0, 1],
+          gripPosition: gripPose?.position ?? [0, 0, 0],
+          gripQuaternion: gripPose?.quaternion ?? [0, 0, 0, 1],
+          handedness,
+        };
+        controllers.push(ctrl);
+      }
+
+      // Map gamepad buttons to InputState
+      if (gamepad) {
+        this.mapGamepadToInputState(gamepad, gamepadIdx, inputState, i);
+        gamepadIdx++;
+      }
+    }
+
+    inputState.xrControllers = controllers;
+  }
+
+  private mapGamepadToInputState(
+    gamepad: Gamepad,
+    _gamepadIdx: number,
+    inputState: InputState,
+    sourceIdx: number,
+  ): void {
+    const buttons = gamepad.buttons;
+    const axes = gamepad.axes;
+
+    // Ensure prevButtonStates is large enough
+    while (this.prevButtonStates.length <= sourceIdx) {
+      this.prevButtonStates.push([]);
+    }
+    const prevStates = this.prevButtonStates[sourceIdx];
+    while (prevStates.length < buttons.length) {
+      prevStates.push(false);
+    }
+
+    for (let b = 0; b < buttons.length; b++) {
+      const pressed = buttons[b].pressed;
+      const wasPressed = prevStates[b];
+
+      if (pressed && !wasPressed) {
+        // Button just pressed — map to key
+        const keyCode = this.buttonToKeyCode(b);
+        if (keyCode !== null) {
+          inputState.keyDown(keyCode);
+        }
+        // Also map trigger (0) and squeeze (1) to mouse buttons
+        if (b === 0) inputState.mouseDown(0);
+        if (b === 1) inputState.mouseDown(2);
+      } else if (!pressed && wasPressed) {
+        // Button just released
+        const keyCode = this.buttonToKeyCode(b);
+        if (keyCode !== null) {
+          inputState.keyUp(keyCode);
+        }
+        if (b === 0) inputState.mouseUp(0);
+        if (b === 1) inputState.mouseUp(2);
+      }
+
+      prevStates[b] = pressed;
+    }
+
+    // Map axes (thumbstick) to gamepadAxes
+    // Standard XR controller: axes[0] = x, axes[1] = y, axes[2] = x2, axes[3] = y2
+    if (axes.length >= 2) {
+      inputState.gamepadAxes[0] = axes[0];
+      inputState.gamepadAxes[1] = axes[1];
+    }
+    if (axes.length >= 4) {
+      inputState.gamepadAxes[2] = axes[2];
+      inputState.gamepadAxes[3] = axes[3];
+    }
+  }
+
+  private buttonToKeyCode(buttonIndex: number): number | null {
+    // Standard XR gamepad button mapping:
+    // 0 = trigger, 1 = squeeze, 2 = thumbstick press, 3 = A/X, 4 = B/Y
+    switch (buttonIndex) {
+      case 0: return null; // trigger → mapped to mouse button 0
+      case 1: return null; // squeeze → mapped to mouse button 2
+      case 2: return null; // thumbstick press — no standard key
+      case 3: return KEY_A; // A / X
+      case 4: return KEY_B; // B / Y
+      default: return null;
+    }
+  }
+
+  private getPose(
+    frame: XRFrame,
+    source: XRInputSource,
+    referenceSpace: XRReferenceSpace,
+    spaceType: "target-ray" | "grip",
+  ): XRPoseData | null {
+    const space = spaceType === "target-ray" ? source.targetRaySpace : source.gripSpace;
+    if (!space) return null;
+
+    const pose = frame.getPose(space, referenceSpace);
+    if (!pose) return null;
+
+    const matrix = pose.transform.matrix as Float32Array;
+    const position: [number, number, number] = [matrix[12], matrix[13], matrix[14]];
+    const quaternion = this.matrixToQuaternion(matrix);
+
+    return { position, quaternion, matrix: new Float32Array(matrix) };
+  }
+
+  private matrixToQuaternion(m: Float32Array): [number, number, number, number] {
+    const trace = m[0] + m[5] + m[10];
+    let qw: number, qx: number, qy: number, qz: number;
+
+    if (trace > 0) {
+      const s = 0.5 / Math.sqrt(trace + 1);
+      qw = 0.25 / s;
+      qx = (m[6] - m[9]) * s;
+      qy = (m[8] - m[2]) * s;
+      qz = (m[1] - m[4]) * s;
+    } else if (m[0] > m[5] && m[0] > m[10]) {
+      const s = 2 * Math.sqrt(1 + m[0] - m[5] - m[10]);
+      qw = (m[6] - m[9]) / s;
+      qx = 0.25 * s;
+      qy = (m[4] + m[1]) / s;
+      qz = (m[8] + m[2]) / s;
+    } else if (m[5] > m[10]) {
+      const s = 2 * Math.sqrt(1 + m[5] - m[0] - m[10]);
+      qw = (m[8] - m[2]) / s;
+      qx = (m[4] + m[1]) / s;
+      qy = 0.25 * s;
+      qz = (m[9] + m[6]) / s;
+    } else {
+      const s = 2 * Math.sqrt(1 + m[10] - m[0] - m[5]);
+      qw = (m[1] - m[4]) / s;
+      qx = (m[8] + m[2]) / s;
+      qy = (m[9] + m[6]) / s;
+      qz = 0.25 * s;
+    }
+
+    return [qx, qy, qz, qw];
+  }
+
+  getAimPose(controllerIdx: number): XRPoseData | null {
+    return this.controllers[controllerIdx]?.aimPose ?? null;
+  }
+
+  getGripPose(controllerIdx: number): XRPoseData | null {
+    return this.controllers[controllerIdx]?.gripPose ?? null;
+  }
+
+  getControllerCount(): number {
+    return this.controllers.length;
+  }
+}

package/modules/xr/src/layer.ts

@@ -0,0 +1,140 @@
+import { isXRGPUBindingAvailable } from "./session";
+
+export type XREye = "left" | "right";
+
+export interface XRViewportRect {
+  x: number;
+  y: number;
+  width: number;
+  height: number;
+}
+
+interface XRGPULayerView {
+  projectionMatrix: Float32Array;
+  transform: { matrix: Float32Array };
+  subImage: {
+    colorTexture: GPUTexture;
+    depthTexture?: GPUTexture;
+    viewport: XRViewportRect;
+  };
+}
+
+interface XRGPULayerLike {
+  getView(view: XRView): XRGPULayerView | null;
+  destroy(): void;
+}
+
+interface XRGPUBindingLike {
+  createProjectionLayer(init: {
+    space: XRReferenceSpace;
+    format: GPUTextureFormat;
+    depthFormat: GPUTextureFormat;
+  }): XRGPULayerLike;
+  getSubImage(layer: XRGPULayerLike, frame: XRFrame, eye?: XREye): { colorTexture: GPUTexture; depthTexture?: GPUTexture; viewport: XRViewportRect } | null;
+}
+
+export class XRLayerManager {
+  private binding: XRGPUBindingLike | null = null;
+  private layer: XRGPULayerLike | null = null;
+  private device: GPUDevice | null = null;
+  private format: GPUTextureFormat = "bgra8unorm";
+  private depthFormat: GPUTextureFormat = "depth32float";
+
+  private currentViews: Map<XREye, XRGPULayerView | null> = new Map([
+    ["left", null],
+    ["right", null],
+  ]);
+
+  init(device: GPUDevice, session: XRSession): void {
+    this.device = device;
+    if (!isXRGPUBindingAvailable()) {
+      throw new Error("XRGPUBinding not available — enable chrome://flags/#webxr-incubations");
+    }
+    const BindingCtor = (globalThis as { XRGPUBinding?: new (device: GPUDevice, session: XRSession) => XRGPUBindingLike }).XRGPUBinding;
+    if (!BindingCtor) {
+      throw new Error("XRGPUBinding constructor not found");
+    }
+    this.binding = new BindingCtor(device, session);
+  }
+
+  createLayer(session: XRSession, referenceSpace: XRReferenceSpace, format: GPUTextureFormat, depthFormat: GPUTextureFormat): void {
+    if (!this.binding) throw new Error("XRLayerManager not initialized — call init() first");
+    this.format = format;
+    this.depthFormat = depthFormat;
+    this.layer = this.binding.createProjectionLayer({
+      space: referenceSpace,
+      format,
+      depthFormat,
+    });
+    session.updateRenderState({ layers: [this.layer as unknown as XRLayer] } as any);
+  }
+
+  beginFrame(frame: XRFrame, referenceSpace: XRReferenceSpace): void {
+    if (!this.layer || !this.binding) return;
+
+    const pose = frame.getViewerPose(referenceSpace);
+    if (!pose) {
+      this.currentViews.set("left", null);
+      this.currentViews.set("right", null);
+      return;
+    }
+
+    for (let _i = 0, _it = pose.views, _n = _it.length; _i < _n; _i++) { const view = _it[_i];
+      const eye = view.eye as XREye;
+      if (eye !== "left" && eye !== "right") continue;
+      const layerView = this.layer.getView(view);
+      this.currentViews.set(eye, layerView);
+    }
+  }
+
+  getColorTextureView(eye: XREye): GPUTextureView {
+    const view = this.currentViews.get(eye);
+    if (!view || !view.subImage.colorTexture) throw new Error(`No color texture for eye: ${eye}`);
+    return view.subImage.colorTexture.createView();
+  }
+
+  getDepthTextureView(eye: XREye): GPUTextureView {
+    const view = this.currentViews.get(eye);
+    if (!view || !view.subImage.depthTexture) {
+      throw new Error(`No depth texture for eye: ${eye}`);
+    }
+    return view.subImage.depthTexture.createView();
+  }
+
+  getViewport(eye: XREye): XRViewportRect | null {
+    const view = this.currentViews.get(eye);
+    if (!view) return null;
+    return view.subImage.viewport;
+  }
+
+  getProjectionMatrix(eye: XREye): Float32Array | null {
+    const view = this.currentViews.get(eye);
+    if (!view) return null;
+    return view.projectionMatrix;
+  }
+
+  getViewMatrix(eye: XREye): Float32Array | null {
+    const view = this.currentViews.get(eye);
+    if (!view) return null;
+    return view.transform.matrix;
+  }
+
+  hasView(eye: XREye): boolean {
+    return this.currentViews.get(eye) !== null;
+  }
+
+  getLayer(): XRGPULayerLike | null {
+    return this.layer;
+  }
+
+  destroy(): void {
+    if (this.layer) {
+      this.layer.destroy();
+      this.layer = null;
+    }
+    this.binding = null;
+    this.device = null;
+    this.currentViews.set("left", null);
+    this.currentViews.set("right", null);
+  }
+}