Use a simpler clearValue

This is obviously a personal preference but, ... I feel like the `{ r: ?, g: ?, b: ?, a: ? }` format is left over from before the time when an array of numbers was allowed? The array of numbers is arguably more useful since all kinds of things can easily provide an array of numbers. So, it seems like it would be good for the samples to show the more useful usage. That way devs are not mislead into thinking they need to take some array of numbers and convert it into the more verbose format.
webgpu · Apr 3, 2024 · c653759 · c653759
1 parent e6793c6
commit c653759
Show file tree

Hide file tree

Showing 28 changed files with 32 additions and 32 deletions.
diff --git a/sample/a-buffer/main.ts b/sample/a-buffer/main.ts
@@ -122,7 +122,7 @@ const opaquePassDescriptor: GPURenderPassDescriptor = {
   colorAttachments: [
     {
       view: undefined,
-      clearValue: { r: 0, g: 0, b: 0, a: 1.0 },
+      clearValue: [0, 0, 0, 1.0],
       loadOp: 'clear',
       storeOp: 'store',
     },

diff --git a/sample/animometer/main.ts b/sample/animometer/main.ts
@@ -275,7 +275,7 @@ function configure() {
     colorAttachments: [
       {
         view: undefined as GPUTextureView, // Assigned later
-        clearValue: { r: 0.0, g: 0.0, b: 0.0, a: 1.0 },
+        clearValue: [0, 0, 0, 1],
         loadOp: 'clear' as const,
         storeOp: 'store' as const,
       },

diff --git a/sample/bitonicSort/main.ts b/sample/bitonicSort/main.ts
@@ -315,7 +315,7 @@ SampleInitFactoryWebGPU(
         {
           view: undefined, // Assigned later
 
-          clearValue: { r: 0.1, g: 0.4, b: 0.5, a: 1.0 },
+          clearValue: [0.1, 0.4, 0.5, 1.0],
           loadOp: 'clear',
           storeOp: 'store',
         },

diff --git a/sample/cameras/main.ts b/sample/cameras/main.ts
@@ -174,7 +174,7 @@ const renderPassDescriptor: GPURenderPassDescriptor = {
     {
       view: undefined, // Assigned later
 
-      clearValue: { r: 0.5, g: 0.5, b: 0.5, a: 1.0 },
+      clearValue: [0.5, 0.5, 0.5, 1.0],
       loadOp: 'clear',
       storeOp: 'store',
     },

diff --git a/sample/computeBoids/main.ts b/sample/computeBoids/main.ts
@@ -105,7 +105,7 @@ const renderPassDescriptor: GPURenderPassDescriptor = {
   colorAttachments: [
     {
       view: undefined as GPUTextureView, // Assigned later
-      clearValue: { r: 0.0, g: 0.0, b: 0.0, a: 1.0 },
+      clearValue: [0, 0, 0, 1],
       loadOp: 'clear' as const,
       storeOp: 'store' as const,
     },

diff --git a/sample/deferredRendering/main.ts b/sample/deferredRendering/main.ts
@@ -252,14 +252,14 @@ const writeGBufferPassDescriptor: GPURenderPassDescriptor = {
     {
       view: gBufferTextureViews[0],
 
-      clearValue: { r: 0.0, g: 0.0, b: 1.0, a: 1.0 },
+      clearValue: [0.0, 0.0, 1.0, 1.0],
       loadOp: 'clear',
       storeOp: 'store',
     },
     {
       view: gBufferTextureViews[1],
 
-      clearValue: { r: 0.0, g: 0.0, b: 0.0, a: 1.0 },
+      clearValue: [0, 0, 0, 1],
       loadOp: 'clear',
       storeOp: 'store',
     },
@@ -279,7 +279,7 @@ const textureQuadPassDescriptor: GPURenderPassDescriptor = {
       // view is acquired and set in render loop.
       view: undefined,
 
-      clearValue: { r: 0.0, g: 0.0, b: 0.0, a: 1.0 },
+      clearValue: [0, 0, 0, 1],
       loadOp: 'clear',
       storeOp: 'store',
     },

diff --git a/sample/fractalCube/main.ts b/sample/fractalCube/main.ts
@@ -146,7 +146,7 @@ const renderPassDescriptor: GPURenderPassDescriptor = {
     {
       view: undefined, // Assigned later
 
-      clearValue: { r: 0.5, g: 0.5, b: 0.5, a: 1.0 },
+      clearValue: [0.5, 0.5, 0.5, 1.0],
       loadOp: 'clear',
       storeOp: 'store',
     },

diff --git a/sample/helloTriangle/main.ts b/sample/helloTriangle/main.ts
@@ -48,7 +48,7 @@ function frame() {
     colorAttachments: [
       {
         view: textureView,
-        clearValue: { r: 0.0, g: 0.0, b: 0.0, a: 1.0 },
+        clearValue: [0, 0, 0, 1],
         loadOp: 'clear',
         storeOp: 'store',
       },

diff --git a/sample/helloTriangleMSAA/main.ts b/sample/helloTriangleMSAA/main.ts
@@ -61,7 +61,7 @@ function frame() {
       {
         view,
         resolveTarget: context.getCurrentTexture().createView(),
-        clearValue: { r: 0.0, g: 0.0, b: 0.0, a: 1.0 },
+        clearValue: [0, 0, 0, 1],
         loadOp: 'clear',
         storeOp: 'discard',
       },

diff --git a/sample/imageBlur/main.ts b/sample/imageBlur/main.ts
@@ -267,7 +267,7 @@ function frame() {
     colorAttachments: [
       {
         view: context.getCurrentTexture().createView(),
-        clearValue: { r: 0.0, g: 0.0, b: 0.0, a: 1.0 },
+        clearValue: [0, 0, 0, 1],
         loadOp: 'clear',
         storeOp: 'store',
       },

diff --git a/sample/instancedCube/main.ts b/sample/instancedCube/main.ts
@@ -186,7 +186,7 @@ const renderPassDescriptor: GPURenderPassDescriptor = {
     {
       view: undefined, // Assigned later
 
-      clearValue: { r: 0.5, g: 0.5, b: 0.5, a: 1.0 },
+      clearValue: [0.5, 0.5, 0.5, 1.0],
       loadOp: 'clear',
       storeOp: 'store',
     },

diff --git a/sample/normalMap/main.ts b/sample/normalMap/main.ts
@@ -157,7 +157,7 @@ const renderPassDescriptor: GPURenderPassDescriptor = {
     {
       view: undefined, // Assigned later
 
-      clearValue: { r: 0.0, g: 0.0, b: 0.0, a: 1.0 },
+      clearValue: [0, 0, 0, 1],
       loadOp: 'clear',
       storeOp: 'store',
     },

diff --git a/sample/particles/main.ts b/sample/particles/main.ts
@@ -145,7 +145,7 @@ const renderPassDescriptor: GPURenderPassDescriptor = {
   colorAttachments: [
     {
       view: undefined, // Assigned later
-      clearValue: { r: 0.0, g: 0.0, b: 0.0, a: 1.0 },
+      clearValue: [0, 0, 0, 1],
       loadOp: 'clear',
       storeOp: 'store',
     },

diff --git a/sample/renderBundles/main.ts b/sample/renderBundles/main.ts
@@ -276,7 +276,7 @@ const renderPassDescriptor: GPURenderPassDescriptor = {
     {
       view: undefined, // Assigned later
 
-      clearValue: { r: 0.0, g: 0.0, b: 0.0, a: 1.0 },
+      clearValue: [0, 0, 0, 1],
       loadOp: 'clear',
       storeOp: 'store',
     },

diff --git a/sample/resizeCanvas/main.ts b/sample/resizeCanvas/main.ts
@@ -92,7 +92,7 @@ function frame() {
         {
           view: renderTargetView,
           resolveTarget: context.getCurrentTexture().createView(),
-          clearValue: { r: 0.2, g: 0.2, b: 0.2, a: 1.0 },
+          clearValue: [0.2, 0.2, 0.2, 1.0],
           loadOp: 'clear',
           storeOp: 'store',
         },

diff --git a/sample/resizeObserverHDDPI/main.ts b/sample/resizeObserverHDDPI/main.ts
@@ -116,7 +116,7 @@ function frame() {
     colorAttachments: [
       {
         view: context.getCurrentTexture().createView(),
-        clearValue: { r: 0.2, g: 0.2, b: 0.2, a: 1.0 },
+        clearValue: [0.2, 0.2, 0.2, 1.0],
         loadOp: 'clear',
         storeOp: 'store',
       },

diff --git a/sample/reversedZ/main.ts b/sample/reversedZ/main.ts
@@ -357,7 +357,7 @@ const drawPassDescriptor: GPURenderPassDescriptor = {
       // view is acquired and set in render loop.
       view: undefined,
 
-      clearValue: { r: 0.0, g: 0.0, b: 0.5, a: 1.0 },
+      clearValue: [0.0, 0.0, 0.5, 1.0],
       loadOp: 'clear',
       storeOp: 'store',
     },
@@ -396,7 +396,7 @@ const textureQuadPassDescriptor: GPURenderPassDescriptor = {
       // view is acquired and set in render loop.
       view: undefined,
 
-      clearValue: { r: 0.0, g: 0.0, b: 0.5, a: 1.0 },
+      clearValue: [0.0, 0.0, 0.5, 1.0],
       loadOp: 'clear',
       storeOp: 'store',
     },

diff --git a/sample/rotatingCube/main.ts b/sample/rotatingCube/main.ts
@@ -120,7 +120,7 @@ const renderPassDescriptor: GPURenderPassDescriptor = {
     {
       view: undefined, // Assigned later
 
-      clearValue: { r: 0.5, g: 0.5, b: 0.5, a: 1.0 },
+      clearValue: [0.5, 0.5, 0.5, 1.0],
       loadOp: 'clear',
       storeOp: 'store',
     },

diff --git a/sample/samplerParameters/main.ts b/sample/samplerParameters/main.ts
@@ -317,7 +317,7 @@ function frame() {
     colorAttachments: [
       {
         view: textureView,
-        clearValue: { r: 0.2, g: 0.2, b: 0.2, a: 1.0 },
+        clearValue: [0.2, 0.2, 0.2, 1.0],
         loadOp: 'clear',
         storeOp: 'store',
       },

diff --git a/sample/shadowMapping/main.ts b/sample/shadowMapping/main.ts
@@ -194,7 +194,7 @@ const renderPassDescriptor: GPURenderPassDescriptor = {
       // view is acquired and set in render loop.
       view: undefined,
 
-      clearValue: { r: 0.5, g: 0.5, b: 0.5, a: 1.0 },
+      clearValue: [0.5, 0.5, 0.5, 1.0],
       loadOp: 'clear',
       storeOp: 'store',
     },

diff --git a/sample/skinnedMesh/main.ts b/sample/skinnedMesh/main.ts
@@ -348,7 +348,7 @@ const gltfRenderPassDescriptor: GPURenderPassDescriptor = {
     {
       view: undefined, // Assigned later
 
-      clearValue: { r: 0.3, g: 0.3, b: 0.3, a: 1.0 },
+      clearValue: [0.3, 0.3, 0.3, 1.0],
       loadOp: 'clear',
       storeOp: 'store',
     },
@@ -367,7 +367,7 @@ const skinnedGridRenderPassDescriptor: GPURenderPassDescriptor = {
     {
       view: undefined, // Assigned later
 
-      clearValue: { r: 0.3, g: 0.3, b: 0.3, a: 1.0 },
+      clearValue: [0.3, 0.3, 0.3, 1.0],
       loadOp: 'clear',
       storeOp: 'store',
     },

diff --git a/sample/texturedCube/main.ts b/sample/texturedCube/main.ts
@@ -155,7 +155,7 @@ const renderPassDescriptor: GPURenderPassDescriptor = {
     {
       view: undefined, // Assigned later
 
-      clearValue: { r: 0.5, g: 0.5, b: 0.5, a: 1.0 },
+      clearValue: [0.5, 0.5, 0.5, 1.0],
       loadOp: 'clear',
       storeOp: 'store',
     },

diff --git a/sample/twoCubes/main.ts b/sample/twoCubes/main.ts
@@ -139,7 +139,7 @@ const renderPassDescriptor: GPURenderPassDescriptor = {
     {
       view: undefined, // Assigned later
 
-      clearValue: { r: 0.5, g: 0.5, b: 0.5, a: 1.0 },
+      clearValue: [0.5, 0.5, 0.5, 1.0],
       loadOp: 'clear',
       storeOp: 'store',
     },

diff --git a/sample/videoUploading/main.ts b/sample/videoUploading/main.ts
@@ -93,7 +93,7 @@ function frame() {
     colorAttachments: [
       {
         view: textureView,
-        clearValue: { r: 0.0, g: 0.0, b: 0.0, a: 1.0 },
+        clearValue: [0, 0, 0, 1],
         loadOp: 'clear',
         storeOp: 'store',
       },

diff --git a/sample/videoUploading/video.ts b/sample/videoUploading/video.ts
@@ -93,7 +93,7 @@ export default async function ({ useVideoFrame }: { useVideoFrame: boolean }) {
       colorAttachments: [
         {
           view: textureView,
-          clearValue: { r: 0.0, g: 0.0, b: 0.0, a: 1.0 },
+          clearValue: [0, 0, 0, 1],
           loadOp: 'clear',
           storeOp: 'store',
         },

diff --git a/sample/volumeRenderingTexture3D/main.ts b/sample/volumeRenderingTexture3D/main.ts
@@ -153,7 +153,7 @@ const renderPassDescriptor: GPURenderPassDescriptor = {
     {
       view: undefined, // Assigned later
 
-      clearValue: { r: 0.5, g: 0.5, b: 0.5, a: 1.0 },
+      clearValue: [0.5, 0.5, 0.5, 1.0],
       loadOp: 'clear',
       storeOp: 'discard',
     },

diff --git a/sample/worker/worker.ts b/sample/worker/worker.ts
@@ -138,7 +138,7 @@ async function init(canvas) {
       {
         view: undefined, // Assigned later
 
-        clearValue: { r: 0.5, g: 0.5, b: 0.5, a: 1.0 },
+        clearValue: [0.5, 0.5, 0.5, 1.0],
         loadOp: 'clear',
         storeOp: 'store',
       },

diff --git a/sample/workloadSimulator/index.html b/sample/workloadSimulator/index.html
@@ -812,7 +812,7 @@ <h2><center>Web graphics workload simulator</center></h2>
           view: renderAttachment,
           resolveTarget: multisampling.checked ? canvasView : undefined,
           loadOp: 'clear',
-          clearValue: { r: 1, g: 1, b: 1, a: 1 },
+          clearValue: [1, 1, 1, 1],
           storeOp: multisampling.checked ? 'discard' : 'store',
         }, ],
       });