Updated to new function API

Author: iwoplaza

apps/phoure-www/package.json

@@ -28,7 +28,7 @@
     "@radix-ui/react-tooltip": "^1.1.6",
     "@typegpu/color": "workspace:*",
     "@typegpu/common": "workspace:*",
-    "@typegpu/noise": "^0.0.3",
+    "@typegpu/noise": "^0.0.5",
     "@typegpu/sdf": "workspace:*",
     "@types/react": "^18.0.2",
     "@types/react-dom": "^18.0.2",

apps/phoure-www/src/lib-filter/bicubicFilter.ts

@@ -21,8 +21,7 @@ const fullScreenQuadVertexFn = tgpu['~unstable']
       texelSizeY: vec2f,
       coordHG: vec2f,
     },
-  })
-  .does(/* wgsl */ `(input: VertexInput) -> VertexOutput {
+  })(/* wgsl */ `{
     const SCREEN_RECT = array<vec2f, 6>(
       vec2f(-1.0, -1.0),
       vec2f(1.0, -1.0),
@@ -45,14 +44,14 @@ const fullScreenQuadVertexFn = tgpu['~unstable']
 
     let viewport_size = vec2f(textureDimensions(texture));
 
-    var output: VertexOutput;
-    output.pos = vec4f(SCREEN_RECT[input.idx], 0.0, 1.0);
-    output.uv = UVS[input.idx];
+    var output: Out;
+    output.pos = vec4f(SCREEN_RECT[in.idx], 0.0, 1.0);
+    output.uv = UVS[in.idx];
     output.texelSizeX = vec2f(1. / f32(viewport_size.x), 0);
     output.texelSizeY = vec2f(0, 1. / f32(viewport_size.y));
 
     // calc filter texture coordinates where [0,1] is a single texel
-    output.coordHG = UVS[input.idx] * viewport_size - vec2f(0.5f, 0.5f);      // fetch offsets and weights from filter texture
+    output.coordHG = UVS[in.idx] * viewport_size - vec2f(0.5f, 0.5f);      // fetch offsets and weights from filter texture
 
     return output;
   }`)
@@ -72,16 +71,15 @@ const resampleCubic = tgpu['~unstable']
       coordHG: vec2f,
     },
     out: vec4f,
-  })
-  .does(/* wgsl */ `(input: FragmentInput) -> @location(0) vec4f {
-    var hg_x = textureSample(hgLookup, wrappingSampler, input.coordHG.x).xyz;
-    var hg_y = textureSample(hgLookup, wrappingSampler, input.coordHG.y).xyz;      // determine linear sampling coordinates
-    var coord_source10 = input.uv + hg_x.x * input.texelSizeX;
-    var coord_source00 = input.uv - hg_x.y * input.texelSizeX;
-    var coord_source11 = coord_source10 + hg_y.x * input.texelSizeY;
-    var coord_source01 = coord_source00 + hg_y.x * input.texelSizeY;
-    coord_source10 = coord_source10 - hg_y.y * input.texelSizeY;
-    coord_source00 = coord_source00 - hg_y.y * input.texelSizeY;      // fetch four linearly interpolated inputs
+  })(/* wgsl */ `{
+    var hg_x = textureSample(hgLookup, wrappingSampler, in.coordHG.x).xyz;
+    var hg_y = textureSample(hgLookup, wrappingSampler, in.coordHG.y).xyz;      // determine linear sampling coordinates
+    var coord_source10 = in.uv + hg_x.x * in.texelSizeX;
+    var coord_source00 = in.uv - hg_x.y * in.texelSizeX;
+    var coord_source11 = coord_source10 + hg_y.x * in.texelSizeY;
+    var coord_source01 = coord_source00 + hg_y.x * in.texelSizeY;
+    coord_source10 = coord_source10 - hg_y.y * in.texelSizeY;
+    coord_source00 = coord_source00 - hg_y.y * in.texelSizeY;      // fetch four linearly interpolated inputs
     var tex_source00 = textureSample(texture, clampingSampler, coord_source00);
     var tex_source10 = textureSample(texture, clampingSampler, coord_source10);
     var tex_source01 = textureSample(texture, clampingSampler, coord_source01);

apps/phoure-www/src/lib-phoure/combineShader.ts

@@ -16,9 +16,8 @@ export const combinationEntryFn = tgpu['~unstable']
   .fragmentFn({
     in: { coord_f: d.builtin.position, uv: d.vec2f },
     out: d.vec4f,
-  })
-  .does(/* wgsl */ `(input: FragmentInput) -> @location(0) vec4f {
-    let coord = vec2u(floor(input.coord_f.xy));
+  })(/* wgsl */ `{
+    let coord = vec2u(floor(in.coord_f.xy));
 
     let blurred = textureLoad(
       blurredTexture,

apps/phoure-www/src/lib-phoure/menderStep.ts

@@ -155,14 +155,14 @@ const entryComputeFn = tgpu['~unstable']
     in: {
       gid: d.builtin.globalInvocationId,
     },
-  })
-  .does(/* wgsl */ `(input: Input) {
+  })(/* wgsl */ `{
     var result: array<f32, OUT_CHANNELS>;
+    
     for (var i = 0; i < OUT_CHANNELS; i += 1) {
       result[i] = biases[i];
     }
 
-    menderConvolveFn(input.gid.xy, &result);
+    menderConvolveFn(in.gid.xy, &result);
   
     if (reluSlot) {
       applyReLU(&result);
@@ -171,8 +171,8 @@ const entryComputeFn = tgpu['~unstable']
     let canvasSize = accessViewportSize;
   
     let output_buffer_begin =
-      (input.gid.y * u32(canvasSize.x) +
-      input.gid.x) * OUT_CHANNELS;
+      (in.gid.y * u32(canvasSize.x) +
+      in.gid.x) * OUT_CHANNELS;
   
     for (var i: u32 = 0; i < OUT_CHANNELS; i++) {
       output_buffer[output_buffer_begin + i] = result[i];

apps/phoure-www/src/lib/GameEngine/blipDifferenceStep/blipDifferenceStep.ts

@@ -9,25 +9,26 @@ type Options = {
   textures: [() => GPUTextureView, () => GPUTextureView];
 };
 
-const fragFn = tgpu['~unstable']
-  .fragmentFn({ in: { coordFloat: d.builtin.position }, out: d.vec4f })
-  .does(`(input: FragmentInput) -> @location(0) vec4f {
-    var coord = vec2u(floor(input.coordFloat.xy));
+const fragFn = tgpu['~unstable'].fragmentFn({
+  in: { coordFloat: d.builtin.position },
+  out: d.vec4f,
+})(`{
+  var coord = vec2u(floor(in.coordFloat.xy));
 
-    let color_a = textureLoad(
-      texture_a,
-      coord,
-      0
-    );
+  let color_a = textureLoad(
+    texture_a,
+    coord,
+    0
+  );
 
-    let color_b = textureLoad(
-      texture_b,
-      coord,
-      0
-    );
+  let color_b = textureLoad(
+    texture_b,
+    coord,
+    0
+  );
 
-    return vec4f(abs(color_a.rgb - color_b.rgb), 1.0);
-  }`);
+  return vec4f(abs(color_a.rgb - color_b.rgb), 1.0);
+}`);
 
 export const BlipDifferenceStep = ({
   root,

apps/phoure-www/src/lib/GameEngine/gBufferDebugger.ts

@@ -22,9 +22,8 @@ const mainFragFn = tgpu['~unstable']
   .fragmentFn({
     in: { coord_f: d.builtin.position, uv: d.vec2f },
     out: d.vec4f,
-  })
-  .does(/* wgsl */ `(input: FragmentInput) -> @location(0) vec4f {
-    let coord = vec2<i32>(floor(input.coord_f.xy));
+  })(/* wgsl */ `{
+    let coord = vec2<i32>(floor(in.coord_f.xy));
     let channel_mode = getChannelModeSlot();
 
     let blurred = textureLoad(
@@ -48,7 +47,7 @@ const mainFragFn = tgpu['~unstable']
 
     var result: vec4<f32>;
 
-    let c = input.uv;
+    let c = in.uv;
     if (channel_mode == CHANNEL_SPLIT) {
       if (c.x < 0.33) {
         // NORMALS

apps/phoure-www/src/lib/GameEngine/postProcessingStep.ts

@@ -21,9 +21,8 @@ const mainFragFn = tgpu['~unstable']
   .fragmentFn({
     in: { coord_f: d.builtin.position, uv: d.vec2f },
     out: d.vec4f,
-  })
-  .does(`(input: FragmentInput) -> @location(0) vec4f {
-    var coord = vec2u(floor(input.coord_f.xy));
+  })(`{
+    var coord = vec2u(floor(in.coord_f.xy));
 
     let color = textureLoad(
       sourceTexture,

apps/phoure-www/src/lib/GameEngine/sdfRenderer/sdfRenderer.ts

@@ -1,6 +1,6 @@
 import { convertRgbToY } from '@typegpu/color';
 import { accessViewportSize } from '@typegpu/common';
-import { DefaultGenerator, rand } from '@typegpu/noise';
+import { randf } from '@typegpu/noise';
 import { atom } from 'jotai';
 import {
   Camera,
@@ -50,8 +50,12 @@ export const accumulatedLayersAtom = atom(0);
  * @param mat_roughness
  */
 const reflect = tgpu['~unstable']
-  .fn([d.vec3f, d.vec3f, d.f32, d.ptrFn(d.f32)])
-  .does(`(ray_dir: vec3f, normal: vec3f, mat_roughness: f32, out_roughness: ptr<function, f32>) -> vec3f {
+  .fn([
+    d.vec3f,
+    d.vec3f,
+    d.f32,
+    d.ptrFn(d.f32),
+  ])(`(ray_dir: vec3f, normal: vec3f, mat_roughness: f32, out_roughness: ptr<function, f32>) -> vec3f {
     let slope = dot(ray_dir, normal);
     let dn2 = 2. * slope;
     let refl_dir = ray_dir - dn2 * normal;
@@ -64,7 +68,7 @@ const reflect = tgpu['~unstable']
     new_ray_dir = mix(refl_dir, new_ray_dir, roughness);
     return normalize(new_ray_dir);
   }`)
-  .$uses({ randOnHemisphere: rand.onHemisphere })
+  .$uses({ randOnHemisphere: randf.onHemisphere })
   .$name('reflect');
 
 const renderSubPixel = tgpu['~unstable']
@@ -185,12 +189,11 @@ const mainComputeFn = tgpu['~unstable']
   .computeFn({
     workgroupSize: [BlockSize, BlockSize],
     in: { gid: d.builtin.globalInvocationId },
-  })
-  .does(/* wgsl */ `(input: Input) {
-    setupRandomSeed(vec2f(input.gid.xy) * ${Math.random()} + getRandomSeedPrimer * ${Math.random()});
+  })(/* wgsl */ `{
+    setupRandomSeed(vec2f(in.gid.xy) * ${Math.random()} + getRandomSeedPrimer * ${Math.random()});
 
     let prev_layers = getAccumulatedLayers;
-    let prev_render = textureLoad(previousRender, input.gid.xy, 0);
+    let prev_render = textureLoad(previousRender, in.gid.xy, 0);
   
     var acc = vec3f(0., 0., 0.);
     for (var sx = 0u; sx < SUPER_SAMPLES; sx++) {
@@ -200,7 +203,7 @@ const mainComputeFn = tgpu['~unstable']
           (f32(sy) + 0.5) * ONE_OVER_SUPER_SAMPLES,
         );
   
-        acc += renderSubPixel(vec2f(input.gid.xy) + offset);
+        acc += renderSubPixel(vec2f(in.gid.xy) + offset);
       }
     }
   
@@ -215,14 +218,14 @@ const mainComputeFn = tgpu['~unstable']
       new_render = (prev_render * prev_layers + vec4(acc, 1.0)) / (prev_layers + 1);
     }
   
-    textureStore(mainOutput, input.gid.xy, new_render);
+    textureStore(mainOutput, in.gid.xy, new_render);
   }`)
   .$uses({
     SUPER_SAMPLES,
     ONE_OVER_SUPER_SAMPLES,
     previousRender: mainLayout.bound.previousRender,
     mainOutput: mainLayout.bound.mainOutput,
-    setupRandomSeed: DefaultGenerator.seed,
+    setupRandomSeed: randf.seed2,
     renderSubPixel,
     getRandomSeedPrimer,
     getAccumulatedLayers,
@@ -238,8 +241,7 @@ const auxComputeFn = tgpu['~unstable']
   .computeFn({
     workgroupSize: [BlockSize, BlockSize],
     in: { gid: d.builtin.globalInvocationId },
-  })
-  .does(/* wgsl */ `(input: Input) {
+  })(/* wgsl */ `{
     let offset = vec2f(
       0.5,
       0.5,
@@ -249,7 +251,7 @@ const auxComputeFn = tgpu['~unstable']
     var shape_ctx: ShapeContext;
     shape_ctx.rayPos = constructRayPos();
     shape_ctx.rayDir = constructRayDir(
-      vec2f(input.gid.xy) + offset
+      vec2f(in.gid.xy) + offset
     );
     shape_ctx.rayDistance = 0.;
   
@@ -288,7 +290,7 @@ const auxComputeFn = tgpu['~unstable']
   
     // TODO: maybe apply gamma correction to the albedo luminance parameter??
   
-    textureStore(auxOutput, input.gid.xy, aux);
+    textureStore(auxOutput, in.gid.xy, aux);
   }`)
   .$uses({
     MAX_STEPS: MarchParams.maxSteps,

apps/phoure-www/src/lib/shaders/fullScreenQuad.ts

@@ -1,34 +1,32 @@
 import tgpu from 'typegpu';
 import { builtin, vec2f } from 'typegpu/data';
 
-export const fullScreenQuadVertexFn = tgpu['~unstable']
-  .vertexFn({
-    in: { idx: builtin.vertexIndex },
-    out: { pos: builtin.position, uv: vec2f },
-  })
-  .does(/* wgsl */ `(input: VertexInput) -> VertexOutput {
-    const SCREEN_RECT = array<vec2f, 6>(
-      vec2f(-1.0, -1.0),
-      vec2f(1.0, -1.0),
-      vec2f(-1.0, 1.0),
+export const fullScreenQuadVertexFn = tgpu['~unstable'].vertexFn({
+  in: { idx: builtin.vertexIndex },
+  out: { pos: builtin.position, uv: vec2f },
+})(/* wgsl */ `{
+  const SCREEN_RECT = array<vec2f, 6>(
+    vec2f(-1.0, -1.0),
+    vec2f(1.0, -1.0),
+    vec2f(-1.0, 1.0),
 
-      vec2f(1.0, -1.0),
-      vec2f(-1.0, 1.0),
-      vec2f(1.0, 1.0),
-    );
+    vec2f(1.0, -1.0),
+    vec2f(-1.0, 1.0),
+    vec2f(1.0, 1.0),
+  );
 
-    const UVS = array<vec2f, 6>(
-      vec2f(0.0, 1.0),
-      vec2f(1.0, 1.0),
-      vec2f(0.0, 0.0),
+  const UVS = array<vec2f, 6>(
+    vec2f(0.0, 1.0),
+    vec2f(1.0, 1.0),
+    vec2f(0.0, 0.0),
 
-      vec2f(1.0, 1.0),
-      vec2f(0.0, 0.0),
-      vec2f(1.0, 0.0),
-    );
+    vec2f(1.0, 1.0),
+    vec2f(0.0, 0.0),
+    vec2f(1.0, 0.0),
+  );
 
-    var output: VertexOutput;
-    output.pos = vec4f(SCREEN_RECT[input.idx], 0.0, 1.0);
-    output.uv = UVS[input.idx];
-    return output;
-  }`);
+  var output: Out;
+  output.pos = vec4f(SCREEN_RECT[in.idx], 0.0, 1.0);
+  output.uv = UVS[in.idx];
+  return output;
+}`);