Add resizing

src/pipelines/agents/agent-pipeline.ts

@@ -51,12 +51,10 @@ export class AgentPipeline {
 
     new Float32Array(this.agentsBuffer.getMappedRange()).set(
       agents.flatMap((agent) => [
-        agent.position[0],
-        agent.position[1],
-        agent.angle,
+        ...agent.position,
+        ...agent.direction,
         agent.species,
         agent.timeToLive,
-        0, // padding
       ])
     );
     this.agentsBuffer.unmap();
@@ -66,8 +64,8 @@ export class AgentPipeline {
     brushTrailWeight,
     moveSpeed,
     turnSpeed,
-    sensorAngleDegrees,
-    sensorOffsetDst,
+    sensorOffsetAngle,
+    sensorOffsetDistance,
   }: AgentSettings) {
     this.device.queue.writeBuffer(
       this.uniforms,
@@ -76,8 +74,8 @@ export class AgentPipeline {
         brushTrailWeight,
         moveSpeed,
         turnSpeed,
-        (sensorAngleDegrees * Math.PI) / 180,
-        sensorOffsetDst,
+        (sensorOffsetAngle * Math.PI) / 180,
+        sensorOffsetDistance,
       ])
     );
   }

src/pipelines/agents/agent-settings.ts

@@ -2,6 +2,6 @@ export interface AgentSettings {
   brushTrailWeight: number;
   moveSpeed: number;
   turnSpeed: number;
-  sensorAngleDegrees: number;
-  sensorOffsetDst: number;
+  sensorOffsetAngle: number;
+  sensorOffsetDistance: number;
 }

src/pipelines/agents/agent.ts

@@ -2,7 +2,7 @@ import { vec2 } from 'gl-matrix';
 
 export interface Agent {
   position: vec2;
-  angle: number;
+  direction: vec2;
   species: number;
   timeToLive: number;
 }

src/pipelines/agents/agent.wgsl

@@ -1,6 +1,6 @@
 struct Agent {
   position: vec2<f32>,
-  angle: f32,
+  direction: vec2<f32>,
   species: f32,
   timeToLive: f32
 }
@@ -15,10 +15,10 @@ struct Settings {
 
 @group(1) @binding(0) var<uniform> settings: Settings;
 @group(1) @binding(1) var<storage, read_write> agents: array<Agent>;
-@group(1) @binding(2) var TrailMapIn: texture_2d<f32>;
-@group(1) @binding(3) var TrailMapOut: texture_storage_2d<rgba16float, write>;
+@group(1) @binding(2) var trailMapIn: texture_2d<f32>;
+@group(1) @binding(3) var trailMapOut: texture_storage_2d<rgba16float, write>;
 
-@compute @workgroup_size(8, 8)
+@compute @workgroup_size(64)
 fn main(@builtin(global_invocation_id) global_id: vec3<u32>) {
   let id = global_id.x;
 
@@ -29,20 +29,20 @@ fn main(@builtin(global_invocation_id) global_id: vec3<u32>) {
   var agent = agents[id];
 
   if (agent.timeToLive <= 0.) {
-    agent.position = vec2(
-      random_with_seed(agent.position, f32(id) + state.time),
-      random_with_seed(agent.position, f32(id) + state.time + 12),
-    );
-    agent.angle = random_with_seed(vec2(agent.angle), f32(id) + state.time);
-    agent.species = 1;
-    agent.timeToLive = 1000;
-    agents[id] = agent;
+    // agent.position = vec2(
+    //   random_with_seed(agent.position, f32(id) + state.time),
+    //   random_with_seed(agent.position, f32(id) + state.time + 12),
+    // );
+    // agent.angle = random_with_seed(vec2(agent.angle), f32(id) + state.time);
+    // agent.species = 1;
+    // agent.timeToLive = 1000;
+    // agents[id] = agent;
     return;
   }
 
   let random = random_with_seed(agent.position, f32(id) + state.time);
+  let trailCurrent = textureLoad(trailMapIn, vec2<i32>(agent.position), 0);
 
-  let trailCurrent = sense(agent, 0, 0);
   var weight: f32;
   if(agent.species == 0) {
     weight = trailCurrent.r - trailCurrent.g;
@@ -53,10 +53,11 @@ fn main(@builtin(global_invocation_id) global_id: vec3<u32>) {
     agent.timeToLive = 0;
     return;
   }
+
   
-  let trailForward = sense(agent, settings.sensorOffset, 0);
-  let trailLeft = sense(agent, settings.sensorOffset, settings.sensorAngle);
-  let trailRight = sense(agent, settings.sensorOffset, -settings.sensorAngle);
+  let trailForward = sense(agent.position, agent.direction, settings.sensorOffset, 0);
+  let trailLeft = sense(agent.position, agent.direction, settings.sensorOffset, settings.sensorAngle);
+  let trailRight = sense(agent.position, agent.direction, settings.sensorOffset, -settings.sensorAngle);
 
   var weightForward: f32 = trailForward.a * settings.brushTrailWeight;
   var weightLeft: f32 = trailLeft.a * settings.brushTrailWeight;
@@ -71,42 +72,44 @@ fn main(@builtin(global_invocation_id) global_id: vec3<u32>) {
     weightRight += trailRight.g - trailRight.r;
   }
 
+  var rotation: f32 = 0;
   if (weightForward < weightLeft && weightForward < weightRight) {
-    agent.angle += (random - 0.5) * 2. * settings.turnRate * state.deltaTime;
+    rotation = (random - 0.5) * 2. * settings.turnRate * state.deltaTime;
   } else if (weightLeft < weightRight) {
-    agent.angle -= random * settings.turnRate * state.deltaTime;
+    rotation = random * -settings.turnRate * state.deltaTime;
   } else if (weightRight < weightLeft) {
-    agent.angle += random * settings.turnRate * state.deltaTime;
+    rotation = random * settings.turnRate * state.deltaTime;
   }
 
-  let direction = vec2(cos(agent.angle), sin(agent.angle));
-  var newPos = agent.position + direction / normalize(state.size) * settings.moveRate * state.deltaTime;
-  newPos = clamp(newPos, vec2<f32>(0, 0), vec2<f32>(1, 1));
-  if (newPos.x == 0. || newPos.x == 1. || newPos.y == 0. || newPos.y == 1.) {
-    agent.angle += 3.14159265359 + random - 0.5;
+  var nextDirection = agent.direction * mat2x2<f32>(cos(rotation), sin(rotation), -sin(rotation), cos(rotation));
+
+  var nextPosition = agent.position + agent.direction * settings.moveRate * state.deltaTime;
+  nextPosition = clamp(nextPosition, vec2<f32>(0, 0), state.size);
+  if nextPosition.x == 0 || nextPosition.x == state.size.x || nextPosition.y == 0 || nextPosition.y == state.size.y {
+    rotation = 3.14159265359 + random - 0.5;
+    nextDirection = agent.direction * mat2x2<f32>(cos(rotation), sin(rotation), -sin(rotation), cos(rotation));
   }
 
   var trail = vec4<f32>(0, 1, 0, 0);
   if (agent.species == 0) {
-    trail = vec4(1, 0, 0, 0);
+    trail = vec4(0.1, 0, 0, 0);
   }
-  textureStore(TrailMapOut, vec2<i32>(newPos * state.size), trail);
 
-  agent.position = newPos;
+  let current = textureLoad(trailMapIn, vec2<i32>(nextPosition), 0); 
+  textureStore(trailMapOut, vec2<i32>(nextPosition), vec4(trail.rgb + current.rgb, 0));
+
+  agent.position = nextPosition;
+  agent.direction = nextDirection;
   agent.timeToLive -= state.deltaTime;
   agents[id] = agent;
 }
 
-fn sense(agent: Agent, sensorOffset: f32, sensorOffsetAngle: f32) -> vec4<f32> {
-  let sensorAngle = agent.angle + sensorOffsetAngle;
-
-  let sensorDir: vec2<f32> = vec2(cos(sensorAngle), sin(sensorAngle)) / normalize(state.size);
-  let sensorPos: vec2<f32> = agent.position + sensorDir * sensorOffset;
-  return textureLoad(TrailMapIn, vec2<i32>(sensorPos * state.size), 0); 
+fn sense(agentPosition: vec2<f32>, agentDirection: vec2<f32>, sensorOffset: f32, sensorOffsetAngle: f32) -> vec4<f32> {
+  let sensorDirection = agentDirection * mat2x2<f32>(cos(sensorOffsetAngle), sin(sensorOffsetAngle), -sin(sensorOffsetAngle), cos(sensorOffsetAngle));
+  let sensorPosition = vec2<i32>(agentPosition + sensorDirection * sensorOffset);
+  return textureLoad(trailMapIn, sensorPosition, 0); 
 }
 
-
 fn random_with_seed(uv: vec2<f32>, seed: f32) -> f32 {
   return fract(sin(dot(uv, vec2(12.9898 + seed, 78.233 + seed)))* 43758.5453123 + seed);
 }
-

src/pipelines/copy/copy-pipeline.ts

@@ -1,10 +1,17 @@
 import { setUpFullScreenQuad } from '../../utils/graphics/full-screen-quad/full-screen-quad';
 import { smartCompile } from '../../utils/graphics/smart-compile';
+import shader from './copy.wgsl';
+
+import { vec2 } from 'gl-matrix';
 
 export class CopyPipeline {
+  private static readonly UNIFORM_COUNT = 2;
+
   private readonly bindGroupLayout: GPUBindGroupLayout;
   private readonly pipeline: GPURenderPipeline;
-  private readonly quadVertexBuffer: GPUBuffer;
+  private readonly uniforms: GPUBuffer;
+
+  private readonly vertexBuffer: GPUBuffer;
 
   private bindGroup?: GPUBindGroup;
   private previousTrailMapIn?: GPUTextureView;
@@ -12,26 +19,50 @@ export class CopyPipeline {
   public constructor(private readonly device: GPUDevice) {
     this.bindGroupLayout = device.createBindGroupLayout(CopyPipeline.bindGroupLayout);
 
-    const { buffer, vertex } = setUpFullScreenQuad(device);
-    this.quadVertexBuffer = buffer;
+    this.uniforms = this.device.createBuffer({
+      size: CopyPipeline.UNIFORM_COUNT * Float32Array.BYTES_PER_ELEMENT,
+      usage: GPUBufferUsage.UNIFORM | GPUBufferUsage.COPY_DST,
+    });
+
+    this.vertexBuffer = device.createBuffer({
+      size: 2 * 4 * Float32Array.BYTES_PER_ELEMENT, // 4 x vec2<f32>
+      usage: GPUBufferUsage.VERTEX,
+      mappedAtCreation: true,
+    });
+    // prettier-ignore
+    const vertexData = [
+    // U    V
+      0.0, 1.0,
+      1.0, 1.0,
+      0.0, 0.0,
+      1.0, 0.0,
+    ];
+    new Float32Array(this.vertexBuffer.getMappedRange()).set(vertexData);
+    this.vertexBuffer.unmap();
 
     this.pipeline = device.createRenderPipeline({
       layout: device.createPipelineLayout({
         bindGroupLayouts: [this.bindGroupLayout],
       }),
-      vertex,
+      vertex: {
+        module: smartCompile(device, shader),
+        entryPoint: 'vertex',
+        buffers: [
+          {
+            arrayStride: 2 * Float32Array.BYTES_PER_ELEMENT,
+            stepMode: 'vertex',
+            attributes: [
+              {
+                shaderLocation: 0,
+                offset: 0,
+                format: 'float32x2',
+              },
+            ],
+          },
+        ],
+      },
       fragment: {
-        module: smartCompile(
-          device,
-          /* wgsl */ `
-          @group(0) @binding(0) var Sampler: sampler;
-          @group(0) @binding(1) var original: texture_2d<f32>;
-
-          @fragment
-          fn fragment(@location(0) uv: vec2<f32>) -> @location(0) vec4<f32> {
-              return textureSample(original, Sampler, uv);
-          }`
-        ),
+        module: smartCompile(device, shader),
         entryPoint: 'fragment',
         targets: [
           {
@@ -48,8 +79,11 @@ export class CopyPipeline {
   public execute(
     commandEncoder: GPUCommandEncoder,
     trailMapIn: GPUTextureView,
-    trailMapOut: GPUTextureView
+    trailMapOut: GPUTextureView,
+    scale: vec2 = vec2.fromValues(1, 1)
   ) {
+    this.device.queue.writeBuffer(this.uniforms, 0, new Float32Array(scale));
+
     const renderPassDescriptor: GPURenderPassDescriptor = {
       colorAttachments: [
         {
@@ -64,13 +98,13 @@ export class CopyPipeline {
     const passEncoder = commandEncoder.beginRenderPass(renderPassDescriptor);
     passEncoder.setPipeline(this.pipeline);
     passEncoder.setBindGroup(0, this.bindGroup);
-    passEncoder.setVertexBuffer(0, this.quadVertexBuffer);
+    passEncoder.setVertexBuffer(0, this.vertexBuffer);
     passEncoder.draw(4, 1);
     passEncoder.end();
   }
 
   public destroy() {
-    this.quadVertexBuffer.destroy();
+    this.vertexBuffer.destroy();
   }
 
   private ensureBindGroupExists(trailMapIn: GPUTextureView) {
@@ -80,13 +114,19 @@ export class CopyPipeline {
         entries: [
           {
             binding: 0,
+            resource: {
+              buffer: this.uniforms,
+            },
+          },
+          {
+            binding: 1,
             resource: this.device.createSampler({
               magFilter: 'linear',
               minFilter: 'linear',
             }),
           },
           {
-            binding: 1,
+            binding: 2,
             resource: trailMapIn,
           },
         ],
@@ -101,13 +141,20 @@ export class CopyPipeline {
       entries: [
         {
           binding: 0,
+          visibility: GPUShaderStage.VERTEX,
+          buffer: {
+            type: 'uniform',
+          },
+        },
+        {
+          binding: 1,
           visibility: GPUShaderStage.FRAGMENT,
           sampler: {
             type: 'filtering',
           },
         },
         {
-          binding: 1,
+          binding: 2,
           visibility: GPUShaderStage.FRAGMENT,
           texture: {
             sampleType: 'float',

src/pipelines/copy/copy.wgsl

@@ -0,0 +1,19 @@
+struct VertexOutput {
+  @builtin(position) position: vec4<f32>,
+  @location(0) uv: vec2<f32>,
+}
+
+@vertex
+fn vertex(@location(0) uv: vec2<f32>) -> VertexOutput {
+  let ndc = uv * sourceScaler * vec2(2) - vec2(1);
+  return VertexOutput(vec4(ndc.x, -ndc.y, 0, 1), uv);
+}
+
+@group(0) @binding(0) var<uniform> sourceScaler: vec2<f32>;
+@group(0) @binding(1) var Sampler: sampler;
+@group(0) @binding(2) var original: texture_2d<f32>;
+
+@fragment
+fn fragment(@location(0) uv: vec2<f32>) -> @location(0) vec4<f32> {
+  return textureSample(original, Sampler, uv);
+}

src/pipelines/diffusion/diffuse.wgsl

@@ -40,9 +40,9 @@ fn fragment(@location(0) uv: vec2<f32>) -> @location(0) vec4<f32> {
     current += change / 4;
 
   let decayed = vec4(
-    current.rgb,
-    current.a
-  ) - vec4(vec3(settings.decayRateTrails), settings.decayRateBrush) * state.deltaTime;
+    current.rgb * settings.decayRateTrails,
+    current.a * settings.decayRateBrush
+  );
  
   return clamp(decayed, vec4(0), vec4(1));
 }

src/pipelines/diffusion/diffusion-pipeline.ts

@@ -10,7 +10,7 @@ export class DiffusionPipeline {
   private readonly bindGroupLayout: GPUBindGroupLayout;
   private readonly pipeline: GPURenderPipeline;
   private readonly uniforms: GPUBuffer;
-  private readonly quadVertexBuffer: GPUBuffer;
+  private readonly vertexBuffer: GPUBuffer;
   private readonly noise: GPUTextureView;
 
   private bindGroup?: GPUBindGroup;
@@ -25,7 +25,7 @@ export class DiffusionPipeline {
     );
 
     const { buffer, vertex } = setUpFullScreenQuad(device);
-    this.quadVertexBuffer = buffer;
+    this.vertexBuffer = buffer;
 
     this.pipeline = device.createRenderPipeline({
       layout: device.createPipelineLayout({
@@ -90,7 +90,7 @@ export class DiffusionPipeline {
 
     const passEncoder = commandEncoder.beginRenderPass(renderPassDescriptor);
     passEncoder.setPipeline(this.pipeline);
-    passEncoder.setVertexBuffer(0, this.quadVertexBuffer);
+    passEncoder.setVertexBuffer(0, this.vertexBuffer);
     this.commonState.execute(passEncoder);
     passEncoder.setBindGroup(1, this.bindGroup);
     passEncoder.draw(4, 1);
@@ -127,7 +127,7 @@ export class DiffusionPipeline {
   }
 
   public destroy() {
-    this.quadVertexBuffer.destroy();
+    this.vertexBuffer.destroy();
     this.uniforms.destroy();
   }
 

src/pipelines/render/render-pipeline.ts

@@ -11,7 +11,7 @@ export class RenderPipeline {
   private readonly bindGroupLayout: GPUBindGroupLayout;
   private readonly pipeline: GPURenderPipeline;
   private readonly uniforms: GPUBuffer;
-  private readonly quadVertexBuffer: GPUBuffer;
+  private readonly vertexBuffer: GPUBuffer;
 
   private bindGroup?: GPUBindGroup;
   private previousColorTexture?: GPUTextureView;
@@ -24,7 +24,7 @@ export class RenderPipeline {
     this.bindGroupLayout = device.createBindGroupLayout(RenderPipeline.bindGroupLayout);
 
     const { buffer, vertex } = setUpFullScreenQuad(device);
-    this.quadVertexBuffer = buffer;
+    this.vertexBuffer = buffer;
 
     this.pipeline = device.createRenderPipeline({
       layout: device.createPipelineLayout({
@@ -82,7 +82,7 @@ export class RenderPipeline {
     const passEncoder = commandEncoder.beginRenderPass(renderPassDescriptor);
     passEncoder.setPipeline(this.pipeline);
     this.commonState.execute(passEncoder);
-    passEncoder.setVertexBuffer(0, this.quadVertexBuffer);
+    passEncoder.setVertexBuffer(0, this.vertexBuffer);
     passEncoder.setBindGroup(1, this.bindGroup);
     passEncoder.draw(4, 1);
     passEncoder.end();
@@ -118,7 +118,7 @@ export class RenderPipeline {
   }
 
   public destroy() {
-    this.quadVertexBuffer.destroy();
+    this.vertexBuffer.destroy();
     this.uniforms.destroy();
   }
 

src/pipelines/render/render.wgsl

@@ -18,13 +18,13 @@ fn fragment(@location(0) uv: vec2<f32>) -> @location(0) vec4<f32> {
   let brushStrength = traces.a;
 
   let rgbColor = sqrt(vec3(
-    settings.speciesColorA * speciesAStrength +
-    settings.speciesColorB * speciesBStrength +
+    settings.speciesColorA * clamp(speciesAStrength, 0, 1) +
+    settings.speciesColorB * clamp(speciesBStrength, 0, 1) +
     settings.brushColor * brushStrength
   ));
 
 
-  let bg = vec3(0.9) + 0.05 * (random.r - 0.5);
+  let bg = vec3(0.9) + 0.075 * random.r;
   
   
   return vec4(bg - rgbColor, 1);