Update world.js

world.js

@@ -9,36 +9,37 @@ export class World {
 
     this.size = 512;
     this.time = 0;
+    this.power = 8.0;
     this.ready = false;
 
     this.field = new Float32Array(this.size);
 
-    if (gpu.mode === "gpu") {
-      this.initGPU();
-    } else {
-      this.ready = true;
-    }
+    if (gpu.mode === "gpu") this.initGPU();
+    else this.ready = true;
   }
 
   async initGPU() {
     try {
-      const device = this.gpu.device;
+      const d = this.gpu.device;
 
-      this.buffer = device.createBuffer({
+      this.buffer = d.createBuffer({
         size: this.field.byteLength,
         usage: GPUBufferUsage.STORAGE | GPUBufferUsage.COPY_SRC | GPUBufferUsage.COPY_DST
       });
 
-      this.readback = device.createBuffer({
+      this.paramBuffer = d.createBuffer({
+        size: 8,
+        usage: GPUBufferUsage.UNIFORM | GPUBufferUsage.COPY_DST
+      });
+
+      this.readback = d.createBuffer({
         size: this.field.byteLength,
         usage: GPUBufferUsage.COPY_DST | GPUBufferUsage.MAP_READ
       });
 
-      this.pipeline = await createCompute(device, wgsl);
-
+      this.pipeline = createCompute(d, wgsl);
       this.ready = true;
-    } catch (e) {
-      console.warn("GPU init failed, falling back to CPU");
+    } catch {
       this.gpu.mode = "cpu";
       this.ready = true;
     }
@@ -46,31 +47,34 @@ export class World {
 
   update(dt) {
     if (!this.ready) return;
-
     this.time += dt;
 
     if (this.gpu.mode === "gpu") {
-      const device = this.gpu.device;
-      const encoder = device.createCommandEncoder();
+      const d = this.gpu.device;
 
+      d.queue.writeBuffer(
+        this.paramBuffer,
+        0,
+        new Float32Array([this.power, this.time])
+      );
+
+      const encoder = d.createCommandEncoder();
       const pass = encoder.beginComputePass();
+
       pass.setPipeline(this.pipeline);
-      pass.setBindGroup(0, device.createBindGroup({
+      pass.setBindGroup(0, d.createBindGroup({
         layout: this.pipeline.getBindGroupLayout(0),
-        entries: [{ binding: 0, resource: { buffer: this.buffer } }]
+        entries: [
+          { binding: 0, resource: { buffer: this.buffer } },
+          { binding: 1, resource: { buffer: this.paramBuffer } }
+        ]
       }));
+
       pass.dispatchWorkgroups(Math.ceil(this.size / 64));
       pass.end();
 
-      encoder.copyBufferToBuffer(
-        this.buffer,
-        0,
-        this.readback,
-        0,
-        this.field.byteLength
-      );
-
-      device.queue.submit([encoder.finish()]);
+      encoder.copyBufferToBuffer(this.buffer, 0, this.readback, 0, this.field.byteLength);
+      d.queue.submit([encoder.finish()]);
     } else {
       for (let i = 0; i < this.size; i++) {
         this.field[i] = Math.sin(this.time + i * 0.02) * 0.5 + 0.5;
@@ -78,15 +82,20 @@ export class World {
     }
   }
 
-  render() {
+  async render() {
     if (!this.ready) return;
 
+    if (this.gpu.mode === "gpu") {
+      await this.readback.mapAsync(GPUMapMode.READ);
+      this.field.set(new Float32Array(this.readback.getMappedRange()));
+      this.readback.unmap();
+    }
+
     const w = this.canvas.width = this.canvas.clientWidth;
     const h = this.canvas.height = this.canvas.clientHeight;
 
     this.ctx.fillStyle = "#000";
     this.ctx.fillRect(0, 0, w, h);
-
     this.ctx.fillStyle = "#00ffd0";
 
     for (let i = 0; i < this.size; i += 4) {
@@ -99,6 +108,8 @@ export class World {
   }
 
   apply(cmd) {
-    // PLME hooks here
+    if (cmd.lane === "world" && cmd.payload.power) {
+      this.power = cmd.payload.power;
+    }
   }
 }