docs: ducks

apps/typegpu-docs/src/examples/threejs/ducklings/consts.ts

@@ -0,0 +1,40 @@
+import * as d from 'typegpu/data';
+
+// water
+export const WIDTH = 256;
+export const BOUNDS = 6;
+export const BOUNDS_HALF = BOUNDS * 0.5;
+export const limit = BOUNDS_HALF - 0.2;
+
+export const waterMaxHeight = 0.1;
+
+// ducklings
+export const SPEED = 5.0;
+export const NUM_DUCKS = 100;
+export const DUCK_STRIDE = 3;
+export const Y_OFFSET = -0.04;
+export const VERTICAL_RESPONSE_FACTOR = 0.98;
+export const WATER_PUSH_FACTOR = 0.015;
+export const LINEAR_DAMPING = 0.92;
+export const BOUNCE_DAMPING = -0.4;
+
+// controls
+export const INITIAL_VISCOSITY = 0.96;
+export const INITIAL_MOUSE_SIZE = 0.12;
+export const INITIAL_MOUSE_DEEP = 0.2;
+
+//sun
+export const SUN_POSITION = [-1, 2.6, 1.4];
+
+// STRUCTS
+export const NeighborIndices = d.struct({
+  northIndex: d.u32,
+  southIndex: d.u32,
+  eastIndex: d.u32,
+  westIndex: d.u32,
+});
+
+export const Normals = d.struct({
+  normalX: d.f32,
+  normalY: d.f32,
+});

apps/typegpu-docs/src/examples/threejs/ducklings/gpuHelpers.ts

@@ -0,0 +1,75 @@
+import type * as t3 from '@typegpu/three';
+import * as d from 'typegpu/data';
+import * as std from 'typegpu/std';
+import type { StorageBufferNode, UniformNode } from 'three/webgpu';
+import { BOUNDS, NeighborIndices, Normals, WIDTH } from './consts.ts';
+
+export function createGpuHelpers(
+  heightStorageA: t3.TSLAccessor<d.WgslArray<typeof d.f32>, StorageBufferNode>,
+  heightStorageB: t3.TSLAccessor<d.WgslArray<typeof d.f32>, StorageBufferNode>,
+  readFromA: t3.TSLAccessor<typeof d.u32, UniformNode<number>>,
+) {
+  const getNeighborIndices = (index: number) => {
+    'use gpu';
+    const width = d.u32(WIDTH);
+    const x = d.i32(std.mod(index, WIDTH));
+    const y = d.i32(std.div(index, WIDTH));
+
+    const leftX = std.max(0, std.sub(x, 1));
+    const rightX = std.min(std.add(x, 1), std.sub(d.i32(width), 1));
+    const bottomY = std.max(0, std.sub(y, 1));
+    const topY = std.min(std.add(y, 1), std.sub(d.i32(width), 1));
+
+    const westIndex = d.u32(std.add(std.mul(y, d.i32(width)), leftX));
+    const eastIndex = d.u32(std.add(std.mul(y, d.i32(width)), rightX));
+    const southIndex = d.u32(std.add(std.mul(bottomY, d.i32(width)), x));
+    const northIndex = d.u32(std.add(std.mul(topY, d.i32(width)), x));
+
+    return NeighborIndices({ northIndex, southIndex, eastIndex, westIndex });
+  };
+
+  const getCurrentHeight = (index: number) => {
+    'use gpu';
+    return std.select(
+      heightStorageB.$[index],
+      heightStorageA.$[index],
+      readFromA.$ === 1,
+    );
+  };
+
+  const getCurrentNormals = (index: number) => {
+    'use gpu';
+    const neighbors = getNeighborIndices(index);
+    const north = std.select(
+      heightStorageB.$[neighbors.northIndex],
+      heightStorageA.$[neighbors.northIndex],
+      readFromA.$ === 1,
+    );
+    const south = std.select(
+      heightStorageB.$[neighbors.southIndex],
+      heightStorageA.$[neighbors.southIndex],
+      readFromA.$ === 1,
+    );
+    const east = std.select(
+      heightStorageB.$[neighbors.eastIndex],
+      heightStorageA.$[neighbors.eastIndex],
+      readFromA.$ === 1,
+    );
+    const west = std.select(
+      heightStorageB.$[neighbors.westIndex],
+      heightStorageA.$[neighbors.westIndex],
+      readFromA.$ === 1,
+    );
+
+    const normalX = std.mul(std.sub(west, east), std.div(WIDTH, BOUNDS));
+    const normalY = std.mul(std.sub(south, north), std.div(WIDTH, BOUNDS));
+
+    return Normals({ normalX, normalY });
+  };
+
+  return {
+    getNeighborIndices,
+    getCurrentHeight,
+    getCurrentNormals,
+  };
+}

apps/typegpu-docs/src/examples/threejs/ducklings/index.html

@@ -0,0 +1 @@
+<canvas></canvas>