fix: webgpu example

deno-windowing · Jan 24, 2024 · 21d3fa9 · 21d3fa9
1 parent c3bef22
commit 21d3fa9
Show file tree

Hide file tree

Showing 4 changed files with 20 additions and 127 deletions.
diff --git a/deno.jsonc b/deno.jsonc
@@ -18,12 +18,12 @@
     "example:capture": "deno run -A --unstable examples/mouse-capture.ts",
     "example:custom_cursor": "deno run -A --unstable examples/custom-cursor.ts",
     "example:custom_icon": "deno run -A --unstable examples/custom-icon.ts",
-    "example:webgpu": "deno run -A --unstable examples/webgpu.ts"
+    "example:webgpu": "deno run -A --unstable-ffi --unstable-webgpu examples/webgpu.ts"
   },
 
   "lint": {
     "rules": {
-      "exclude": ["no-unused-vars", "no-window"]
+      "exclude": ["no-unused-vars"]
     }
   }
 }
diff --git a/examples/webgpu.ts b/examples/webgpu.ts
@@ -16,141 +16,34 @@ const surface = window.windowSurface();
 
 const context = surface.getContext("webgpu");
 
-let pipeline: GPURenderPipeline;
-
-const uniformLength = 5;
-
-let uniformValues: Float32Array,
-  uniformBindGroup: GPUBindGroup,
-  uniformBuffer: GPUBuffer;
-
-function createPipeline() {
-  const fragEntry = "fs_main";
-
-  const shaderModule = device.createShaderModule({
-    code: `
-  struct Uniforms {
-      mouse: vec2f,
-      clicked: f32,
-      frame: f32,
-  };
-  
-  @group(0) @binding(0) var<uniform> shaderplay: Uniforms;
-  $struct VertexInput {
-      @builtin(vertex_index) vertex_index: u32,
-  };
-  
-  @vertex
-  fn vs_main(in: VertexInput) -> @builtin(position) vec4<f32> {
-      let x = f32(i32(in.vertex_index) - 1);
-      let y = f32(i32(in.vertex_index & 1u) * 2 - 1);
-      return vec4<f32>(x, y, 0.0, 1.0);
-  }
-  
-  @fragment
-  fn fs_main(@builtin(position) pos: vec4<f32>) -> @location(0) vec4<f32> {
-      return vec4<f32>(1.0, 0.0, 0.0, 1.0);
-  }
-  `,
-    label: "example",
-  });
-
-  const bindGroupLayout = device.createBindGroupLayout({
-    entries: [
-      {
-        binding: 0,
-        visibility: GPUShaderStage.FRAGMENT | GPUShaderStage.VERTEX,
-        buffer: {
-          type: "uniform",
-        },
-      },
-    ],
-  });
-  pipeline = device.createRenderPipeline({
-    // "auto" layout not working in Deno but works in browser
-    layout: device.createPipelineLayout({
-      bindGroupLayouts: [
-        bindGroupLayout,
-      ],
-    }),
-    vertex: {
-      module: shaderModule,
-      entryPoint: "vs_main",
-      buffers: [],
-    },
-    fragment: {
-      module: shaderModule,
-      entryPoint: fragEntry,
-      targets: [
-        {
-          format: "bgra8unorm",
-        },
-      ],
-    },
-  });
-
-  const value = new Float32Array(uniformLength);
-  uniformBuffer = device.createBuffer({
-    size: value.byteLength,
-    usage: GPUBufferUsage.UNIFORM | GPUBufferUsage.COPY_DST,
-  });
-  uniformValues = value;
-
-  device.queue.writeBuffer(uniformBuffer, 0, value);
-
-  uniformBindGroup = device.createBindGroup({
-    layout: bindGroupLayout,
-    entries: [
-      { binding: 0, resource: { buffer: uniformBuffer } },
-    ],
-  });
-
-  // window.raise();
-}
-
-createPipeline();
-
 context.configure({
   device,
   format: "bgra8unorm",
-});
-
-addEventListener("mousemove", (evt) => {
-  uniformValues[0] = evt.clientX / width;
-  uniformValues[1] = evt.clientY / height;
-});
-
-addEventListener("mousedown", (evt) => {
-  uniformValues[2] = 1;
-});
-
-addEventListener("mouseup", (evt) => {
-  uniformValues[2] = 0;
+  width,
+  height,
 });
 
 await mainloop(() => {
-  uniformValues[3]++; // frame++
+  // Sine wave
+  const r = Math.sin(Date.now() / 1000) / 2 + 0.5;
+  const g = Math.sin(Date.now() / 1000 + 2) / 2 + 0.5;
+  const b = Math.sin(Date.now() / 1000 + 4) / 2 + 0.5;
 
-  const commandEncoder = device.createCommandEncoder();
   const textureView = context.getCurrentTexture().createView();
-
-  const renderPass = commandEncoder.beginRenderPass({
+  const renderPassDescriptor = {
     colorAttachments: [
       {
         view: textureView,
-        clearValue: { r: 0, g: 0, b: 0, a: 1 },
+        clearValue: { r, g, b, a: 1.0 },
         loadOp: "clear",
         storeOp: "store",
       },
     ],
-  });
-
-  device.queue.writeBuffer(uniformBuffer, 0, uniformValues);
+  };
 
-  renderPass.setPipeline(pipeline);
-  renderPass.setBindGroup(0, uniformBindGroup);
-  renderPass.draw(3, 1);
-  renderPass.end();
+  const commandEncoder = device.createCommandEncoder();
+  const passEncoder = commandEncoder.beginRenderPass(renderPassDescriptor);
+  passEncoder.end();
 
   device.queue.submit([commandEncoder.finish()]);
   surface.present();

diff --git a/src/core/event.ts b/src/core/event.ts
@@ -1,3 +1,4 @@
+// deno-lint-ignore-file no-window
 import { DwmWindow } from "./window.ts";
 
 /**
@@ -256,8 +257,7 @@ export function _cancelAnimationFrameImpl(id: number) {
   animationFrames.delete(id);
 }
 
-// deno-lint-ignore no-window
-Object.assign(window, {
+Object.assign(globalThis, {
   requestAnimationFrame: _requestAnimationFrameImpl,
   cancelAnimationFrame: _cancelAnimationFrameImpl,
 });

diff --git a/src/platform/glfw/window.ts b/src/platform/glfw/window.ts
@@ -1071,8 +1071,8 @@ export class WindowGlfw extends DwmWindow {
 
   #rawHandle(): [
     RawPlatform,
-    Deno.UnsafePointerView,
-    Deno.UnsafePointerView | null,
+    Deno.PointerValue<unknown>,
+    Deno.PointerValue<unknown> | null,
   ] {
     let platform: RawPlatform;
     let handle: Deno.PointerValue<unknown>;
@@ -1114,8 +1114,8 @@ export class WindowGlfw extends DwmWindow {
     }
     return [
       platform,
-      new Deno.UnsafePointerView(handle!),
-      display == null ? null : new Deno.UnsafePointerView(display),
+      handle!,
+      display == null ? null : display,
     ];
   }