ugly-game 0.5.15 → 0.5.16

package/dist/gpuSsao.d.ts

@@ -0,0 +1,10 @@
+export declare class GpuSSAO {
+    private device;
+    private pipe;
+    private uBuf;
+    private bg;
+    private u;
+    constructor(device: GPUDevice, format: GPUTextureFormat);
+    /** color = scene colour (input), depth = scene depth, out = darkened target the water pass then samples. */
+    frame(enc: GPUCommandEncoder, out: GPUTextureView, color: GPUTextureView, depth: GPUTextureView, camVP: Float32Array, w: number, h: number, radius?: number, bias?: number, strength?: number, maxDarken?: number): void;
+}

package/dist/gpuSsao.js

@@ -0,0 +1,156 @@
+// SCREEN-SPACE CONTACT AO — the missing cue that makes voxel terrain read as 3D. Fixed directional fill shades a
+// face by its ORIENTATION, but a large flat ground plane has one normal everywhere, so it still looks flat. What
+// the eye actually uses to read shape is the DARK where surfaces meet: the base of a step, the inside corner of a
+// pit, the ground under a tree. This pass reconstructs each pixel's world position from the scene depth (via the
+// inverse view-projection, so it's immune to the GL-vs-WebGPU depth-range convention), estimates a surface normal
+// from neighbours, samples a small normal-oriented hemisphere, and darkens where nearby geometry rises above the
+// tangent plane. It writes scene*ao into a second colour target the caller then composites (blit / water / post).
+//
+// PLATFORM PASS. Reusable by any ugly-game renderer: run it after the opaque scene is drawn, feeding the scene
+// colour + depth and the same camera view-projection, then sample the AO target instead of the raw scene. Pure
+// WebGPU — no engine deps.
+const SHADER = /* wgsl */ `
+struct U {
+  invVP: mat4x4<f32>,
+  params: vec4<f32>,   // x = world radius, y = bias, z = strength, w = max darken
+  dim: vec4<f32>,      // xy = target size in px
+};
+@group(0) @binding(0) var<uniform> u: U;
+@group(0) @binding(1) var colTex: texture_2d<f32>;
+@group(0) @binding(2) var depthTex: texture_depth_2d;
+
+@vertex fn vs(@builtin(vertex_index) vi: u32) -> @builtin(position) vec4<f32> {
+  var p = array<vec2<f32>, 3>(vec2(-1.0, -1.0), vec2(3.0, -1.0), vec2(-1.0, 3.0));
+  return vec4(p[vi], 0.0, 1.0);
+}
+
+fn worldAt(px: vec2<i32>, dim: vec2<f32>) -> vec4<f32> {
+  let c = clamp(px, vec2<i32>(0, 0), vec2<i32>(dim) - vec2<i32>(1, 1));
+  let d = textureLoad(depthTex, c, 0);
+  let uv = (vec2<f32>(c) + vec2(0.5, 0.5)) / dim;
+  let ndc = vec4(uv.x * 2.0 - 1.0, (1.0 - uv.y) * 2.0 - 1.0, d, 1.0);
+  let w = u.invVP * ndc;
+  return vec4(w.xyz / w.w, d);   // xyz = rebased world pos, w = stored depth
+}
+
+// 8 unit directions on the screen; sampled at two pixel radii for multi-scale contact darkening.
+const DIRS = array<vec2<f32>, 8>(
+  vec2( 1.0, 0.0), vec2(-1.0, 0.0), vec2(0.0, 1.0), vec2(0.0, -1.0),
+  vec2( 0.7, 0.7), vec2(-0.7, 0.7), vec2(0.7, -0.7), vec2(-0.7, -0.7));
+
+@fragment fn fs(@builtin(position) fc: vec4<f32>) -> @location(0) vec4<f32> {
+  let px = vec2<i32>(fc.xy);
+  let dim = u.dim.xy;
+  let base = textureLoad(colTex, px, 0).rgb;
+  let ctr = worldAt(px, dim);
+  if (ctr.w >= 0.9999) { return vec4(base, 1.0); }   // sky — no AO
+
+  let P = ctr.xyz;
+  let Px = worldAt(px + vec2<i32>(1, 0), dim).xyz;
+  let Py = worldAt(px + vec2<i32>(0, 1), dim).xyz;
+  let N = normalize(cross(Px - P, Py - P));
+
+  let radius = u.params.x;
+  let bias = u.params.y;
+  var occ = 0.0;
+  var wsum = 0.0;
+  // two pixel radii → catches both tight corners and broader valleys
+  let rads = array<f32, 2>(3.0, 8.0);
+  for (var r = 0; r < 2; r = r + 1) {
+    for (var i = 0; i < 8; i = i + 1) {
+      let o = vec2<i32>(DIRS[i] * rads[r]);
+      let s = worldAt(px + o, dim);
+      if (s.w >= 0.9999) { wsum = wsum + 1.0; continue; }   // neighbour is sky → not occluding
+      let v = s.xyz - P;
+      let dist = length(v);
+      if (dist < 1e-4) { continue; }
+      // occluded when the neighbour rises above the tangent plane (dot(N,dir) > bias), attenuated by world distance
+      let ao = max(dot(v / dist, N) - bias, 0.0) * (1.0 - smoothstep(0.0, radius, dist));
+      occ = occ + ao;
+      wsum = wsum + 1.0;
+    }
+  }
+  occ = select(0.0, occ / wsum, wsum > 0.0);
+  let darken = clamp(occ * u.params.z, 0.0, u.params.w);
+  return vec4(base * (1.0 - darken), 1.0);
+}`;
+/** Invert a column-major 4×4 (Float32Array). Returns a new Float32Array; identity if singular. */
+function invert4(m) {
+    const a = m;
+    const b = new Float32Array(16);
+    const m00 = a[0], m01 = a[1], m02 = a[2], m03 = a[3];
+    const m10 = a[4], m11 = a[5], m12 = a[6], m13 = a[7];
+    const m20 = a[8], m21 = a[9], m22 = a[10], m23 = a[11];
+    const m30 = a[12], m31 = a[13], m32 = a[14], m33 = a[15];
+    const b00 = m00 * m11 - m01 * m10, b01 = m00 * m12 - m02 * m10;
+    const b02 = m00 * m13 - m03 * m10, b03 = m01 * m12 - m02 * m11;
+    const b04 = m01 * m13 - m03 * m11, b05 = m02 * m13 - m03 * m12;
+    const b06 = m20 * m31 - m21 * m30, b07 = m20 * m32 - m22 * m30;
+    const b08 = m20 * m33 - m23 * m30, b09 = m21 * m32 - m22 * m31;
+    const b10 = m21 * m33 - m23 * m31, b11 = m22 * m33 - m23 * m32;
+    let det = b00 * b11 - b01 * b10 + b02 * b09 + b03 * b08 - b04 * b07 + b05 * b06;
+    if (!det) {
+        b[0] = b[5] = b[10] = b[15] = 1;
+        return b;
+    }
+    det = 1.0 / det;
+    b[0] = (m11 * b11 - m12 * b10 + m13 * b09) * det;
+    b[1] = (m02 * b10 - m01 * b11 - m03 * b09) * det;
+    b[2] = (m31 * b05 - m32 * b04 + m33 * b03) * det;
+    b[3] = (m22 * b04 - m21 * b05 - m23 * b03) * det;
+    b[4] = (m12 * b08 - m10 * b11 - m13 * b07) * det;
+    b[5] = (m00 * b11 - m02 * b08 + m03 * b07) * det;
+    b[6] = (m32 * b02 - m30 * b05 - m33 * b01) * det;
+    b[7] = (m20 * b05 - m22 * b02 + m23 * b01) * det;
+    b[8] = (m10 * b10 - m11 * b08 + m13 * b06) * det;
+    b[9] = (m01 * b08 - m00 * b10 - m03 * b06) * det;
+    b[10] = (m30 * b04 - m31 * b02 + m33 * b00) * det;
+    b[11] = (m21 * b02 - m20 * b04 - m23 * b00) * det;
+    b[12] = (m11 * b07 - m10 * b09 - m12 * b06) * det;
+    b[13] = (m00 * b09 - m01 * b07 + m02 * b06) * det;
+    b[14] = (m31 * b01 - m30 * b03 - m32 * b00) * det;
+    b[15] = (m20 * b03 - m21 * b01 + m22 * b00) * det;
+    return b;
+}
+export class GpuSSAO {
+    device;
+    pipe;
+    uBuf;
+    bg = null;
+    u = new Float32Array(24); // invVP(16) + params(4) + dim(4)
+    constructor(device, format) {
+        this.device = device;
+        const sm = device.createShaderModule({ code: SHADER });
+        this.pipe = device.createRenderPipeline({
+            layout: 'auto',
+            vertex: { module: sm, entryPoint: 'vs' },
+            fragment: { module: sm, entryPoint: 'fs', targets: [{ format }] },
+            primitive: { topology: 'triangle-list' },
+        });
+        this.uBuf = device.createBuffer({ size: 96, usage: GPUBufferUsage.UNIFORM | GPUBufferUsage.COPY_DST });
+    }
+    /** color = scene colour (input), depth = scene depth, out = darkened target the water pass then samples. */
+    frame(enc, out, color, depth, camVP, w, h, radius = 2.2, bias = 0.12, strength = 1.9, maxDarken = 0.72) {
+        this.u.set(invert4(camVP), 0);
+        this.u[16] = radius;
+        this.u[17] = bias;
+        this.u[18] = strength;
+        this.u[19] = maxDarken;
+        this.u[20] = w;
+        this.u[21] = h;
+        this.device.queue.writeBuffer(this.uBuf, 0, this.u);
+        this.bg = this.device.createBindGroup({
+            layout: this.pipe.getBindGroupLayout(0),
+            entries: [
+                { binding: 0, resource: { buffer: this.uBuf } },
+                { binding: 1, resource: color },
+                { binding: 2, resource: depth },
+            ],
+        });
+        const rp = enc.beginRenderPass({ colorAttachments: [{ view: out, loadOp: 'clear', clearValue: { r: 0, g: 0, b: 0, a: 1 }, storeOp: 'store' }] });
+        rp.setPipeline(this.pipe);
+        rp.setBindGroup(0, this.bg);
+        rp.draw(3);
+        rp.end();
+    }
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ugly-game",
-  "version": "0.5.15",
+  "version": "0.5.16",
   "type": "module",
   "exports": {
     ".": {