Changeset 214849 in webkit


Ignore:
Timestamp:
Apr 3, 2017 3:47:53 PM (7 years ago)
Author:
dino@apple.com
Message:

Unreviewed. More WebGPU demos.

  • demos/webgpu/2d.jpg: Added.
  • demos/webgpu/2d.js:
  • demos/webgpu/circle.svg: Added.
  • demos/webgpu/cubes.jpg: Added.
  • demos/webgpu/hello.html: Added.
  • demos/webgpu/hello.jpg: Added.
  • demos/webgpu/hello.js: Copied from Websites/webkit.org/demos/webgpu/2d.js.

(init):
(render):

  • demos/webgpu/index.html: Added.
  • demos/webgpu/simple.jpg: Added.
Location:
trunk/Websites/webkit.org
Files:
7 added
2 edited
1 copied

Legend:

Unmodified
Added
Removed

  • trunk/Websites/webkit.org/ChangeLog

    r214710 r214849  
     12017-04-03  Dean Jackson  <dino@apple.com>
     2
     3        Unreviewed. More WebGPU demos.
     4
     5        * demos/webgpu/2d.jpg: Added.
     6        * demos/webgpu/2d.js:
     7        * demos/webgpu/circle.svg: Added.
     8        * demos/webgpu/cubes.jpg: Added.
     9        * demos/webgpu/hello.html: Added.
     10        * demos/webgpu/hello.jpg: Added.
     11        * demos/webgpu/hello.js: Copied from Websites/webkit.org/demos/webgpu/2d.js.
     12        (init):
     13        (render):
     14        * demos/webgpu/index.html: Added.
     15        * demos/webgpu/simple.jpg: Added.
     16
    1172017-03-31  Dean Jackson  <dino@apple.com>
    218

  • trunk/Websites/webkit.org/demos/webgpu/2d.js

    r214710 r214849  
    133133}
    134134
    135 var count = 0;
    136 
    137135function updateUniformData(index) {
    138136    var now = Date.now() % 100000 / 500;

  • trunk/Websites/webkit.org/demos/webgpu/hello.js

    r214848 r214849  
    1 class Uniform {
    2     constructor(float32Array) {
    3         if (float32Array && float32Array.length != 64) {
    4             console.log("Incorrect backing store for Uniform");
    5             return;
    6         }
    7 
    8         this.array = float32Array || new Float32Array(64);
    9     }
    10     // Layout is
    11     // 0-1 = resolution (float2)
    12     // 2 = time (float)
    13     get buffer() {
    14         return this.array;
    15     }
    16     get resolution() {
    17         return this.array.subarray(0, 2);
    18     }
    19     get time() {
    20         return this.array[2];
    21     }
    22     set resolution(value) {
    23         this.array[0] = value[0];
    24         this.array[1] = value[1];
    25     }
    26     set time(value) {
    27         this.array[2] = value;
    28     }
    29     copyValuesTo(buffer) {
    30         var bufferData = new Float32Array(buffer.contents);
    31         for (let i = 0; i < 3; i++) {
    32             bufferData[i] = this.array[i];
    33         }
    34     }
    35 }
    36 
    37 const vertexData = new Float32Array(
    38 [
    39     -1, -1, 0, 1,
    40     1, -1, 0, 1,
    41     1, 1, 0, 1,
    42     -1, -1, 0, 1,
    43     -1, 1, 0, 1,
    44     1, 1, 0, 1,
    45 ]);
    46 
    471let gpu;
    482let commandQueue;
    493let renderPassDescriptor;
    504let renderPipelineState;
    51 
    52 const NumActiveUniformBuffers = 3;
    53 let uniforms = new Array(NumActiveUniformBuffers);
    54 let uniformBuffers = new Array(NumActiveUniformBuffers);
    55 let currentUniformBufferIndex = 0;
    565
    576window.addEventListener("load", init, false);
    … …  
    8837    renderPipelineState = gpu.createRenderPipelineState(pipelineDescriptor);
    8938
    90     for (let i = 0; i < NumActiveUniformBuffers; i++) {
    91         let uniform = new Uniform();
    92         uniform.resolution = new Float32Array([canvasSize.width, canvasSize.height]);
    93         uniforms[i] = uniform;
    94         uniformBuffers[i] = gpu.createBuffer(uniform.buffer);
    95     }
    96 
    9739    renderPassDescriptor = new WebGPURenderPassDescriptor();
    9840    // NOTE: Our API proposal has some of these values as enums, not constant numbers.
    … …  
    10244    renderPassDescriptor.colorAttachments[0].clearColor = [0.35, 0.65, 0.85, 1.0];
    10345
    104     vertexBuffer = gpu.createBuffer(vertexData);
    10546    render();
    10647}
    … …  
    10849function render() {
    10950
    110     updateUniformData(currentUniformBufferIndex);
    111 
    11251    let commandBuffer = commandQueue.createCommandBuffer();
    113 
    11452    let drawable = gpu.nextDrawable();
    115 
    11653    renderPassDescriptor.colorAttachments[0].texture = drawable.texture;
    11754
    11855    let commandEncoder = commandBuffer.createRenderCommandEncoderWithDescriptor(renderPassDescriptor);
    11956    commandEncoder.setRenderPipelineState(renderPipelineState);
    120     commandEncoder.setVertexBuffer(vertexBuffer, 0, 0);
    121     commandEncoder.setVertexBuffer(uniformBuffers[currentUniformBufferIndex], 0, 1);
    122     commandEncoder.setFragmentBuffer(uniformBuffers[currentUniformBufferIndex], 0, 0);
     57
     58    // NOTE: We didn't attach any buffers. We create the geometry in the vertex shader using
     59    // the vertex ID.
    12360
    12461    // NOTE: Our API proposal uses the enum value "triangle" here. We haven't got around to implementing the enums yet.
    125     commandEncoder.drawPrimitives(gpu.PrimitiveTypeTriangle, 0, 6);
     62    commandEncoder.drawPrimitives(gpu.PrimitiveTypeTriangle, 0, 3);
    12663
    12764    commandEncoder.endEncoding();
    12865    commandBuffer.presentDrawable(drawable);
    12966    commandBuffer.commit();
    130 
    131     currentUniformBufferIndex = (currentUniformBufferIndex + 1) % NumActiveUniformBuffers;
    132     requestAnimationFrame(render);
    13367}
    134 
    135 var count = 0;
    136 
    137 function updateUniformData(index) {
    138     var now = Date.now() % 100000 / 500;
    139     let uniform = uniforms[index];
    140     uniform.time = now;
    141 
    142     uniform.copyValuesTo(uniformBuffers[index]);
    143 
    144 }
Note: See TracChangeset for help on using the changeset viewer.