@driftengine/core 4.4.2 → 4.5.0

package/src/render/pointShadowMap.ts

@@ -36,6 +36,19 @@ export { FACE_COUNT, POINT_SHADOW_NEAR };
 
 const scratchViewProj = mat4.create();
 
+/**
+ * What a bake asks of the renderer about glass, after each face's opaque depth.
+ *
+ * **Asked before it is drawn** because the answer decides whether the face binds a glass target at
+ * all: a face that offers no glass and holds none from a previous owner does no glass work.
+ */
+export interface PointGlassDraw {
+  /** Whether the face just drawn offered any glass. */
+  offered(): boolean;
+  /** Draw that glass: its depth, or what it lets through lit from the bake origin. */
+  draw(pass: 'depth' | 'tint', x: number, y: number, z: number): void;
+}
+
 export class PointShadowMap {
   readonly size: number;
   /**
@@ -163,6 +176,8 @@ export class PointShadowMap {
     near = POINT_SHADOW_NEAR,
     sourceRadius = DEFAULT_SOURCE_RADIUS,
     maxFaces = FACE_COUNT,
+    /** The face's glass, when glass shadows are on: `PointGlassDraw`. */
+    glass: PointGlassDraw | null = null,
   ): number {
     /*
      * What to render now, **and what to render it for**. A bake in flight owns the parameters
@@ -220,6 +235,7 @@ export class PointShadowMap {
        * next face's pass does care about.
        */
       array.resolveFace(gl, this.layer, face, plan.range, plan.near);
+      if (glass !== null) this.bakeGlassFace(gl, array, glass, face, plan);
     }
 
     gl.enable(gl.CULL_FACE);
@@ -237,5 +253,30 @@ export class PointShadowMap {
    * needing disposal is exactly the shape of a leak nobody notices. The array is disposed by the
    * renderer that built it.
    */
+  /**
+   * The face's glass, twice: where the nearest pane is, then what the panes let through.
+   *
+   * A face that offers no glass still clears a region a previous owner's glass is in — the depth to
+   * the far plane and the tint to white, from scratches cleared and not drawn into — because a pool
+   * slot changes hands with its layer.
+   */
+  private bakeGlassFace(
+    gl: WebGL2RenderingContext,
+    array: PointShadowTarget,
+    glass: PointGlassDraw,
+    face: number,
+    plan: FaceRange,
+  ): void {
+    if (!array.hasGlass) return;
+    const offered = glass.offered();
+    if (!offered && !array.heldGlass(this.layer, face)) return;
+    array.beginGlassFace(gl);
+    if (offered) glass.draw('depth', plan.x, plan.y, plan.z);
+    array.resolveGlassFace(gl, this.layer, face, plan.range, plan.near);
+    array.beginTintFace(gl);
+    if (offered) glass.draw('tint', plan.x, plan.y, plan.z);
+    array.resolveTintFace(gl, this.layer, face, offered);
+  }
+
   dispose(_gl: WebGL2RenderingContext): void {}
 }

package/src/render/recon/changeFrames.ts

@@ -0,0 +1,24 @@
+/**
+ * Which frame a change to a dynamic mesh or an instanced batch belongs to.
+ *
+ * **A consumer may change geometry in its simulation step, before `beginFrame`.** That change is
+ * what the *next* frame draws, so it is that frame's — counting it against the frame last begun
+ * would say the geometry changed a frame early and then did not change at all, which is a motion
+ * vector on the wrong frame and none on the right one.
+ *
+ * Only the **first** change in a frame keeps the state before it: a second rewrite in the same
+ * frame must not replace "where it was last frame" with "where it was a moment ago".
+ */
+
+export function frameOfChange(serial: number, inFrame: boolean): number {
+  return inFrame ? serial : serial + 1;
+}
+
+export function keepsPrevious(lastChange: number, frame: number): boolean {
+  return lastChange !== frame;
+}
+
+/** Slots `0 … n-1` pair with last frame's; a slot past last frame's count is new and has no past. */
+export function pairedInstances(previousCount: number, count: number): number {
+  return Math.min(previousCount, count);
+}

package/src/render/recon/lateRouting.ts

@@ -0,0 +1,29 @@
+/**
+ * Two decisions about one draw in a reconstructing frame, and why they are the same set.
+ *
+ * A blended draw goes **late** — after the reconstruction, at output resolution, unjittered — and a
+ * mover's motion is **tracked**, only for draws that land in the picture being reconstructed. A
+ * planar mirror and a probe bake are other pictures drawn through the same verbs, and the overlay
+ * after `endFrame` is past the picture altogether; routing any of them late, or counting a mirrored
+ * draw as a mover's second draw of the frame, would be wrong in the way that reads as a ghost.
+ *
+ * Plain booleans rather than a state object, so the per-draw call allocates nothing.
+ */
+export function routesLate(
+  reconstructing: boolean,
+  mirror: boolean,
+  probe: boolean,
+  presented: boolean,
+): boolean {
+  return reconstructing && !mirror && !probe && !presented;
+}
+
+/** The same set as `routesLate`, named for the other reader. */
+export function tracksMotion(
+  reconstructing: boolean,
+  mirror: boolean,
+  probe: boolean,
+  presented: boolean,
+): boolean {
+  return routesLate(reconstructing, mirror, probe, presented);
+}

package/src/render/recon/mover.ts

@@ -0,0 +1,118 @@
+/**
+ * Which object a draw is, so a reconstruction can find where that object was last frame.
+ *
+ * **The engine cannot infer this and does not try.** `drawMesh` is immediate: a mesh drawn three
+ * times is three objects, and nothing in the call says which of last frame's three each one is. A
+ * consumer that makes one `Mover` per moving object and passes it with every draw of that object
+ * says exactly that, and the renderer keeps the rest — last frame's model and, for a skinned
+ * draw, last frame's palette.
+ *
+ * **Plain data, advanced by the renderer.** No renderer is needed to make one, so a consumer holds
+ * it beside the object it belongs to. Only a reconstructing WebGPU renderer reads or writes it; it
+ * costs nothing anywhere else. The fields past `kind` are the renderer's and a caller leaves them
+ * alone.
+ *
+ * **What would make this wrong** is a consumer whose objects are rebuilt every frame with no state
+ * of their own to hold a mover in; the identity then has to live in whatever *does* persist.
+ */
+
+export const MOVER_KIND = 'drift.mover' as const;
+
+export interface Mover {
+  readonly kind: typeof MOVER_KIND;
+  /** The renderer that last drew it, from `claimRendererId`; -1 before its first draw. */
+  renderer: number;
+  /** That renderer's frame serial at the last draw. */
+  frame: number;
+  readonly model: Float32Array;
+  readonly previousModel: Float32Array;
+  /**
+   * This frame's palette, exactly `paletteLength` floats long once a skinned draw has set it.
+   * Swapped with the previous one each frame and reallocated only when the rig changes.
+   */
+  palette: Float32Array;
+  previousPalette: Float32Array;
+  paletteLength: number;
+  previousPaletteLength: number;
+}
+
+/** Nothing to reproject from: first draw, a missed frame, another renderer, or a changed rig. */
+export const MOVER_NONE = 0;
+/** Drawn on the frame before by this renderer: `previousModel` and `previousPalette` are real. */
+export const MOVER_MOTION = 1;
+/** Drawn already this frame. The second draw is a different object and the caller's error. */
+export const MOVER_TWICE = 2;
+export type MoverVerdict = typeof MOVER_NONE | typeof MOVER_MOTION | typeof MOVER_TWICE;
+
+let nextRendererId = 1;
+
+/** A number no other renderer in this page holds, so a mover can tell renderers apart. */
+export function claimRendererId(): number {
+  const id = nextRendererId;
+  nextRendererId += 1;
+  return id;
+}
+
+export function createMover(): Mover {
+  return {
+    kind: MOVER_KIND,
+    renderer: -1,
+    frame: -2,
+    model: new Float32Array(16),
+    previousModel: new Float32Array(16),
+    palette: new Float32Array(0),
+    previousPalette: new Float32Array(0),
+    paletteLength: 0,
+    previousPaletteLength: 0,
+  };
+}
+
+export function isMover(value: unknown): value is Mover {
+  return (
+    typeof value === 'object' && value !== null && (value as { kind?: unknown }).kind === MOVER_KIND
+  );
+}
+
+/**
+ * Advance a mover to this draw, and say whether last frame's state is usable.
+ *
+ * **A second draw in one frame changes nothing**, so the first draw's motion stands; the caller
+ * warns. Otherwise what the mover held becomes its previous and this draw becomes its current —
+ * the palettes by swapping two arrays, so a steady rig allocates nothing after its first frame.
+ *
+ * **A changed joint count is no motion**: skinning a vertex with a palette of a different rig is
+ * not an old pose of this one.
+ */
+export function advanceMover(
+  mover: Mover,
+  renderer: number,
+  frame: number,
+  model: ArrayLike<number>,
+  palette: Float32Array | null,
+): MoverVerdict {
+  if (mover.renderer === renderer && mover.frame === frame) return MOVER_TWICE;
+  const drawnLast = mover.renderer === renderer && mover.frame === frame - 1;
+
+  mover.previousModel.set(mover.model);
+  const spare = mover.previousPalette;
+  mover.previousPalette = mover.palette;
+  mover.palette = spare;
+  mover.previousPaletteLength = mover.paletteLength;
+
+  mover.model.set(model);
+  if (palette === null) {
+    mover.paletteLength = 0;
+  } else {
+    /* Exactly the rig's length, because the array is uploaded as it stands; reallocated only when
+       the rig changes, which a steady character never does. */
+    if (mover.palette.length !== palette.length) mover.palette = new Float32Array(palette.length);
+    mover.palette.set(palette);
+    mover.paletteLength = palette.length;
+  }
+  mover.renderer = renderer;
+  mover.frame = frame;
+
+  if (!drawnLast) return MOVER_NONE;
+  if (mover.paletteLength !== mover.previousPaletteLength) return MOVER_NONE;
+  return MOVER_MOTION;
+}

package/src/render/renderQuality.ts

@@ -37,6 +37,9 @@ export type ShadowFilterTaps = 4 | 8 | 12;
 export type DirectionalShadowDepthLayers = 1 | 2;
 export type WaterReflectionFilterTaps = 1 | 5 | 9;
 
+/** How light through glass is coloured: see `RenderQuality.glassShadows`. */
+export type GlassShadows = 'full' | 'half' | 'off';
+
 export interface RenderQuality {
   /**
    * The transfer curve applied at the end of every shaded pass.
@@ -149,6 +152,25 @@ export interface RenderQuality {
   readonly lightVolumeSamples: number;
   /** Independently composited static sun depths; two preserves common overlaps. */
   readonly directionalShadowDepthLayers: DirectionalShadowDepthLayers;
+  /**
+   * Whether light through glass takes the glass's colour, and at what size.
+   *
+   * **`'full'`, the default**: every shadow a glass caster reaches gains a layer holding the depth of
+   * the nearest pane and a tint layer holding what the panes let through, at the size of the depth
+   * map beside it — 8 bytes a texel, so 32 MB for a 2048 sun map and 8 MB for a 1024 lamp layer.
+   * **`'half'`** halves the tint layers only (the glass depth must match its array): 20 MB and 5 MB,
+   * and a coloured patch softer than an opaque shadow's edge. **`'off'`** is glass before this
+   * existed: a pane casts nothing at all.
+   *
+   * Nothing is allocated until a glass caster first reaches a shadow, so a scene with no glass pays
+   * no memory and no pass whatever this says. **The lit shader is the exception**: `'full'` and
+   * `'half'` compile the glass lookup into it, and a lookup that finds no glass and returns at its
+   * first line still costs the lit pass its registers — measured on the courtyard at night, 0.27 ms
+   * at 720p on WebGPU, 0.42 ms on WebGL2 and 1.2 ms at 4K. `'off'` compiles none of it, so a world
+   * that never casts through glass is that much faster for saying so. What would make `'full'` wrong
+   * is a phone budget with a lot of glass; that is what `'half'` is for. See `glassShadow.ts`.
+   */
+  readonly glassShadows: GlassShadows;
   /** Horizontal world-space reach over which a directional shadow dissolves. */
   readonly directionalShadowMaxDistance: number;
   /** Maximum horizontal projection per vertical metre before low-angle shadows vanish. */
@@ -556,6 +578,20 @@ export interface RenderQuality {
    * the render is a quarter of the output and no reconstruction holds an edge through that. A
    * negative number is off, not a clamp to the bottom: it cannot mean "a little".
    *
+   * **What it needs from you.** A `createMover()` per moving object, passed with that object's
+   * draws where `drawMesh` takes last frame's matrix — the renderer keeps last frame's model and,
+   * for a skinned draw, last frame's pose. Instanced batches and meshes rewritten with
+   * `updateMesh` need nothing: the batch and the mesh are their own identity. And `cameraCut()` at
+   * every cut, because nothing detects one: without it a cut blends the previous shot into the
+   * next. Blended draws — translucent meshes, particles, plumes, film, bolts, lines, world text —
+   * are drawn after the upscale at the output size and need nothing either; light volumes stay in
+   * the reconstructed picture, being a march that keeps its history.
+   *
+   * **What it cannot give back** is the resolution it draws at: an edge that never moves is softer
+   * than a native frame's at any ratio, because two thirds of the pixels at 1.5 are a guess made
+   * sharp. Measured on `demo/dev/ghost.html` against a native frame at four samples, still edges
+   * err by about 8 levels where a native frame at one sample errs by 3.
+   *
    * `?recon=` is how it gets A/B'd in one reload.
    */
   readonly reconstruction: number;
@@ -838,6 +874,7 @@ export const DEFAULT_RENDER_QUALITY: Readonly<RenderQuality> = Object.freeze({
   shadowFilterTaps: MAX_SHADOW_FILTER_TAPS,
   lightVolumeSamples: 32,
   directionalShadowDepthLayers: 2,
+  glassShadows: 'full',
   directionalShadowMaxDistance: 6,
   directionalShadowMaxSlope: 3,
   pointShadowRebakeDistance: 0.001,
@@ -998,6 +1035,7 @@ export function resolveRenderQuality(options: RenderQualityOptions = {}): Readon
     lightVolumeSamples: options.lightVolumeSamples ?? DEFAULT_RENDER_QUALITY.lightVolumeSamples,
     directionalShadowDepthLayers:
       options.directionalShadowDepthLayers ?? DEFAULT_RENDER_QUALITY.directionalShadowDepthLayers,
+    glassShadows: options.glassShadows ?? DEFAULT_RENDER_QUALITY.glassShadows,
     directionalShadowMaxDistance:
       options.directionalShadowMaxDistance ?? DEFAULT_RENDER_QUALITY.directionalShadowMaxDistance,
     directionalShadowMaxSlope:
@@ -1128,6 +1166,15 @@ export function resolveRenderQuality(options: RenderQualityOptions = {}): Readon
       `RenderQuality.directionalShadowDepthLayers must be 1 or 2, got ${quality.directionalShadowDepthLayers}`,
     );
   }
+  if (
+    quality.glassShadows !== 'full' &&
+    quality.glassShadows !== 'half' &&
+    quality.glassShadows !== 'off'
+  ) {
+    throw new Error(
+      `RenderQuality.glassShadows must be 'full', 'half' or 'off', got ${String(quality.glassShadows)}`,
+    );
+  }
   if (quality.plumeNoiseOctaves > 3) {
     throw new Error(
       `RenderQuality.plumeNoiseOctaves must be <= 3, got ${quality.plumeNoiseOctaves}`,

package/src/render/rendererHarness.ts

@@ -129,6 +129,18 @@ export function recordingGl(
     COLOR_BUFFER_BIT: 0x00004000,
     /* Named so a test can tell a mesh that declared itself deforming from one that did not. */
     ARRAY_BUFFER: 0x8892,
+    /* Named so a blend a pass sets can be read back as numbers: glass multiplies what it lets
+       through, and a test that cannot tell DST_COLOR from a recorder cannot tell it multiplies. */
+    ZERO: 0,
+    DST_ALPHA: 0x0304,
+    DST_COLOR: 0x0306,
+    FUNC_ADD: 0x8006,
+    COLOR: 0x1800,
+    DEPTH: 0x1801,
+    /* Named so a copy can be read as from-and-to: a blit's two framebuffers are the whole claim. */
+    READ_FRAMEBUFFER: 0x8ca8,
+    DRAW_FRAMEBUFFER: 0x8ca9,
+    BLEND: 0x0be2,
     STATIC_DRAW: 0x88e4,
     DYNAMIC_DRAW: 0x88e8,
   };

package/src/render/sceneTarget.ts

@@ -82,6 +82,8 @@ export class SceneTarget {
   private colorCopyFramebuffer: WebGLFramebuffer | null = null;
   /** Whether this frame has filled it. One snapshot serves every refracting draw in a frame. */
   private colorCopyFilled = false;
+  /** Whether this frame's copy has its mip chain, which frosted glass reads. See `snapshotColor`. */
+  private colorCopyMips = false;
   /**
    * The colour grade, as a 3D texture on unit 4, and the table it was built from.
    *
@@ -275,12 +277,24 @@ export class SceneTarget {
      */
     if (this.colorCopy === null) this.colorCopy = gl.createTexture();
     gl.bindTexture(gl.TEXTURE_2D, this.colorCopy);
-    if (this.floatColor) {
-      gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA16F, width, height, 0, gl.RGBA, gl.HALF_FLOAT, null);
-    } else {
-      gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, width, height, 0, gl.RGBA, gl.UNSIGNED_BYTE, null);
+    /*
+     * **Every level, so glass can read a blurrier one.** Frosted glass reads the copy at a level its
+     * frost picks, and a texture sampled through a mipmapping filter with a level missing is
+     * incomplete and reads black — so the chain is allocated here, once per size, and filled only on
+     * a frame that draws glass (`snapshotColor`). Plain refraction reads level 0, as it always has.
+     */
+    const levels = Math.floor(Math.log2(Math.max(width, height))) + 1;
+    for (let level = 0; level < levels; level += 1) {
+      const w = Math.max(1, width >> level);
+      const h = Math.max(1, height >> level);
+      if (this.floatColor) {
+        gl.texImage2D(gl.TEXTURE_2D, level, gl.RGBA16F, w, h, 0, gl.RGBA, gl.HALF_FLOAT, null);
+      } else {
+        gl.texImage2D(gl.TEXTURE_2D, level, gl.RGBA, w, h, 0, gl.RGBA, gl.UNSIGNED_BYTE, null);
+      }
     }
-    gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR);
+    gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAX_LEVEL, levels - 1);
+    gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR_MIPMAP_LINEAR);
     gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.LINEAR);
     gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
     gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);
@@ -419,6 +433,7 @@ export class SceneTarget {
     /* Last frame's snapshot is last frame's scene. See `snapshotDepth`. */
     this.depthCopyFilled = false;
     this.colorCopyFilled = false;
+    this.colorCopyMips = false;
     this.bind();
   }
 
@@ -516,12 +531,21 @@ export class SceneTarget {
    * Null where the copy could not be made, and a caller must read that as "do not refract" rather
    * than as a black texture — refracting against black paints every pane the colour of a hole.
    */
-  snapshotColor(afresh = false): WebGLTexture | null {
+  snapshotColor(
+    afresh = false,
+    /** Fill the copy's mip chain as well, once a frame: what frosted glass reads. */
+    mips = false,
+  ): WebGLTexture | null {
     if (this.colorCopy === null || this.colorCopyFramebuffer === null) return null;
-    if (this.colorCopyFilled && !afresh) return this.colorCopy;
+    if (this.colorCopyFilled && !afresh) {
+      if (mips) this.fillColorCopyMips();
+      return this.colorCopy;
+    }
     const { gl } = this;
     const source = this.msaaFramebuffer ?? this.framebuffer;
     if (source === null) return null;
+    const drawing = gl.getParameter(gl.DRAW_FRAMEBUFFER_BINDING) as WebGLFramebuffer | null;
+    const reading = gl.getParameter(gl.READ_FRAMEBUFFER_BINDING) as WebGLFramebuffer | null;
 
     gl.bindFramebuffer(gl.READ_FRAMEBUFFER, source);
     gl.bindFramebuffer(gl.DRAW_FRAMEBUFFER, this.colorCopyFramebuffer);
@@ -546,13 +570,33 @@ export class SceneTarget {
       gl.NEAREST,
     );
     const refused = gl.getError() !== gl.NO_ERROR;
-    /* Back to what the caller was drawing into, whichever that was. */
-    gl.bindFramebuffer(gl.FRAMEBUFFER, source);
+    /*
+     * **Back to what the caller was drawing into, whichever that was** — read before the copy and
+     * handed back, never assumed. It was the scene's framebuffer, assumed, and a pane drawn into a
+     * reflection probe's face then left the scene's bound: the probe attached its next face to it,
+     * a face-sized colour beside a screen-sized depth, and every draw after refused as incomplete.
+     */
+    gl.bindFramebuffer(gl.DRAW_FRAMEBUFFER, drawing);
+    gl.bindFramebuffer(gl.READ_FRAMEBUFFER, reading);
     if (refused) return null;
     this.colorCopyFilled = true;
+    this.colorCopyMips = false;
+    if (mips) this.fillColorCopyMips();
     return this.colorCopy;
   }
 
+  /** The copy's mip chain from its level 0, once per copy. */
+  private fillColorCopyMips(): void {
+    if (this.colorCopyMips || this.colorCopy === null) return;
+    const { gl } = this;
+    /* Bound on whichever unit is active and handed back, so the caller's texture there survives. */
+    const previous = gl.getParameter(gl.TEXTURE_BINDING_2D) as WebGLTexture | null;
+    gl.bindTexture(gl.TEXTURE_2D, this.colorCopy);
+    gl.generateMipmap(gl.TEXTURE_2D);
+    gl.bindTexture(gl.TEXTURE_2D, previous);
+    this.colorCopyMips = true;
+  }
+
   snapshotDepth(
     /**
      * Take the copy again even though one has already been taken this frame.
@@ -573,6 +617,8 @@ export class SceneTarget {
     const { gl } = this;
     const source = this.msaaFramebuffer ?? this.framebuffer;
     if (source === null) return null;
+    const drawing = gl.getParameter(gl.DRAW_FRAMEBUFFER_BINDING) as WebGLFramebuffer | null;
+    const reading = gl.getParameter(gl.READ_FRAMEBUFFER_BINDING) as WebGLFramebuffer | null;
 
     gl.bindFramebuffer(gl.READ_FRAMEBUFFER, source);
     gl.bindFramebuffer(gl.DRAW_FRAMEBUFFER, this.depthCopyFramebuffer);
@@ -595,8 +641,9 @@ export class SceneTarget {
       gl.NEAREST,
     );
     const refused = gl.getError() !== gl.NO_ERROR;
-    /* Back to what the caller was drawing into, whichever that was. */
-    gl.bindFramebuffer(gl.FRAMEBUFFER, source);
+    /* Back to what the caller was drawing into, read rather than assumed: see `snapshotColor`. */
+    gl.bindFramebuffer(gl.DRAW_FRAMEBUFFER, drawing);
+    gl.bindFramebuffer(gl.READ_FRAMEBUFFER, reading);
     if (refused) return null;
     this.depthCopyFilled = true;
     return this.depthCopy;

package/src/render/shaders/depth.ts

@@ -1,4 +1,5 @@
 import { resolveConditionals } from './conditionals.ts';
+import { SUN_STATIC_LAYER } from '../shadowMap.ts';
 import { CUTOUT_COVERAGE_GLSL } from './cutoutCoverage.ts';
 import { SKINNING_GLSL } from './skinning.ts';
 import { CHANNEL_ATTRIBUTE, CHANNEL_BEND } from './vertexChannel.ts';
@@ -73,6 +74,11 @@ out vec4 vLightPosition;
 out vec2 vUv;
 flat out float vAlphaCutout;
 #endif
+#if GLASS
+/* Where on the pane this is, for the tint's own normal and its angle to the light. Last, so the
+   outputs before it keep the locations the plain variants give them. */
+out vec3 vGlassWorld;
+#endif
 
 void main() {
 #if SKINNED
@@ -100,20 +106,23 @@ void main() {
   vUv = aUv * uUvScale;
   vAlphaCutout = uAlphaCutout;
 #endif
+#if GLASS
+  vGlassWorld = bent;
+#endif
 }
 `;
 
 /** The rigid variant: the world, a prop, a mesh with no rig behind it. */
 export const DEPTH_VERT = resolveConditionals(
   DEPTH_VERT_SOURCE,
-  { SKINNED: false, INSTANCED: false, CUTOUT: false },
+  { SKINNED: false, INSTANCED: false, CUTOUT: false, GLASS: false },
   'depth',
 );
 
 /** The skinned variant, which reads a joint palette and moves the vertex by it. */
 export const DEPTH_SKINNED_VERT = resolveConditionals(
   DEPTH_VERT_SOURCE,
-  { SKINNED: true, INSTANCED: false, CUTOUT: false },
+  { SKINNED: true, INSTANCED: false, CUTOUT: false, GLASS: false },
   'depth-skinned',
 );
 
@@ -127,7 +136,7 @@ export const DEPTH_SKINNED_VERT = resolveConditionals(
  */
 export const DEPTH_INSTANCED_VERT = resolveConditionals(
   DEPTH_VERT_SOURCE,
-  { SKINNED: false, INSTANCED: true, CUTOUT: false },
+  { SKINNED: false, INSTANCED: true, CUTOUT: false, GLASS: false },
   'depth-instanced',
 );
 
@@ -143,13 +152,13 @@ export const DEPTH_INSTANCED_VERT = resolveConditionals(
  */
 export const DEPTH_CUTOUT_VERT = resolveConditionals(
   DEPTH_VERT_SOURCE,
-  { SKINNED: false, INSTANCED: false, CUTOUT: true },
+  { SKINNED: false, INSTANCED: false, CUTOUT: true, GLASS: false },
   'depth-cutout',
 );
 
 export const DEPTH_INSTANCED_CUTOUT_VERT = resolveConditionals(
   DEPTH_VERT_SOURCE,
-  { SKINNED: false, INSTANCED: true, CUTOUT: true },
+  { SKINNED: false, INSTANCED: true, CUTOUT: true, GLASS: false },
   'depth-instanced-cutout',
 );
 
@@ -157,14 +166,14 @@ export const DEPTH_FRAG = `#version 300 es
 precision highp float;
 in vec4 vLightPosition;
 
-uniform highp sampler2D uPreviousShadowMap;
+uniform highp sampler2DArray uPreviousShadowMap;
 uniform int uPeelShadowLayer;
 
 void main() {
   if (uPeelShadowLayer != 0) {
     vec3 p = vLightPosition.xyz / vLightPosition.w;
     vec2 uv = p.xy * 0.5 + 0.5;
-    float previousDepth = texture(uPreviousShadowMap, uv).r;
+    float previousDepth = texture(uPreviousShadowMap, vec3(uv, ${SUN_STATIC_LAYER}.0)).r;
     // Discard the already-recorded surface and everything in front of it. The
     // ordinary depth test then stores the next independently fading occluder.
     if (gl_FragCoord.z <= previousDepth + 0.00001) discard;
@@ -190,7 +199,7 @@ in vec4 vLightPosition;
 in vec2 vUv;
 flat in float vAlphaCutout;
 
-uniform highp sampler2D uPreviousShadowMap;
+uniform highp sampler2DArray uPreviousShadowMap;
 uniform int uPeelShadowLayer;
 uniform highp sampler2D uCutoutMap;
 ${CUTOUT_COVERAGE_GLSL}
@@ -200,9 +209,100 @@ void main() {
   if (uPeelShadowLayer != 0) {
     vec3 p = vLightPosition.xyz / vLightPosition.w;
     vec2 uv = p.xy * 0.5 + 0.5;
-    float previousDepth = textureLod(uPreviousShadowMap, uv, 0.0).r;
+    float previousDepth = textureLod(uPreviousShadowMap, vec3(uv, ${SUN_STATIC_LAYER}.0), 0.0).r;
     if (gl_FragCoord.z <= previousDepth + 0.00001) discard;
   }
   if (alpha < vAlphaCutout) discard;
 }
 `;
+
+/**
+ * The glass tint's vertex stages: every way a caster is drawn, with the world position handed on.
+ *
+ * **The same five as the depth pass, and for the same reason**: a pane must cast its colour from
+ * exactly where it casts its depth, deformed and placed the same way, or the coloured patch parts
+ * from the pane's own shadow edge. The only addition is `vGlassWorld`.
+ */
+export const GLASS_TINT_VERT = resolveConditionals(
+  DEPTH_VERT_SOURCE,
+  { SKINNED: false, INSTANCED: false, CUTOUT: false, GLASS: true },
+  'glass-tint',
+);
+export const GLASS_TINT_SKINNED_VERT = resolveConditionals(
+  DEPTH_VERT_SOURCE,
+  { SKINNED: true, INSTANCED: false, CUTOUT: false, GLASS: true },
+  'glass-tint-skinned',
+);
+export const GLASS_TINT_INSTANCED_VERT = resolveConditionals(
+  DEPTH_VERT_SOURCE,
+  { SKINNED: false, INSTANCED: true, CUTOUT: false, GLASS: true },
+  'glass-tint-instanced',
+);
+export const GLASS_TINT_CUTOUT_VERT = resolveConditionals(
+  DEPTH_VERT_SOURCE,
+  { SKINNED: false, INSTANCED: false, CUTOUT: true, GLASS: true },
+  'glass-tint-cutout',
+);
+export const GLASS_TINT_INSTANCED_CUTOUT_VERT = resolveConditionals(
+  DEPTH_VERT_SOURCE,
+  { SKINNED: false, INSTANCED: true, CUTOUT: true, GLASS: true },
+  'glass-tint-instanced-cutout',
+);
+
+/**
+ * What a pane lets through: its transmission and colour, less what it reflects toward the light,
+ * and how clear it is — `glassShadow.ts`'s `paneTexel`, stated for the device. Drawn with a
+ * multiplying blend and no depth test, so every pane on a ray contributes whatever order they
+ * come in.
+ *
+ * **The pane's normal is its triangle's**, from the derivatives of its world position, first and in
+ * uniform control flow: a pane is flat, a sign does not matter to a cosine taken absolutely, and it
+ * spares the five vertex stages a normal they would carry for this alone. What it gives up is a
+ * curved pane, whose Fresnel steps per triangle; what would change it is glass that is mostly bulbs.
+ */
+const GLASS_TINT_BODY = /* glsl */ `
+  vec3 n = normalize(cross(dFdx(vGlassWorld), dFdy(vGlassWorld)));
+  vec3 toLight = uGlassLight.w > 0.5 ? normalize(uGlassLight.xyz - vGlassWorld) : uGlassLight.xyz;
+  float cosLight = abs(dot(n, toLight));
+  float reflected = 0.04 + 0.96 * pow(1.0 - cosLight, 5.0);
+  outTint = vec4(uGlassPane.rgb * (1.0 - reflected), uGlassPane.a);
+`;
+
+export const GLASS_TINT_FRAG = `#version 300 es
+precision highp float;
+in vec4 vLightPosition;
+in vec3 vGlassWorld;
+
+/* rgb: transmission times tint; a: clarity, one less the frost. */
+uniform vec4 uGlassPane;
+/* xyz: the light's position (w 1) or the direction toward it (w 0). */
+uniform vec4 uGlassLight;
+
+out vec4 outTint;
+
+void main() {
+${GLASS_TINT_BODY}
+}
+`;
+
+/** A cut-out pane: its colour lands only where its depth does, by the depth cutout's own test. */
+export const GLASS_TINT_CUTOUT_FRAG = `#version 300 es
+precision highp float;
+in vec4 vLightPosition;
+in vec2 vUv;
+flat in float vAlphaCutout;
+in vec3 vGlassWorld;
+
+uniform vec4 uGlassPane;
+uniform vec4 uGlassLight;
+uniform highp sampler2D uCutoutMap;
+${CUTOUT_COVERAGE_GLSL}
+out vec4 outTint;
+
+void main() {
+  /* First, in uniform control flow, as the depth cutout samples it. */
+  float alpha = cutoutAlpha(texture(uCutoutMap, vUv).a, vUv * vec2(textureSize(uCutoutMap, 0)));
+${GLASS_TINT_BODY}
+  if (alpha < vAlphaCutout) discard;
+}
+`;