test_webgl2_uniform_block.html (2812B)
1 <!DOCTYPE HTML> 2 <meta http-equiv="content-type" content="text/html; charset=utf-8" /> 3 <title>WebGL2 test: using uniform blocks</title> 4 <script src="/tests/SimpleTest/SimpleTest.js"></script> 5 <link rel="stylesheet" href="/tests/SimpleTest/test.css"> 6 <script src="webgl-util.js"></script> 7 <script id='vertSource' type='none'> 8 #version 300 es 9 uniform UniformBlock 10 { 11 vec3 color; 12 vec3 offset; 13 }; 14 in vec2 POSITION; 15 out vec3 outCOLOR0; 16 17 void main() { 18 gl_Position = vec4(POSITION, 0.0, 1.0); 19 outCOLOR0 = vec3(color.x + offset.x, color.y + offset.y, 20 color.z + offset.z); 21 } 22 </script> 23 <script id='fragSource' type='none'> 24 #version 300 es 25 precision mediump float; 26 in vec3 outCOLOR0; 27 out vec4 oFragColor; 28 29 void main() { 30 oFragColor = vec4(outCOLOR0, 1.0); 31 } 32 </script> 33 <body> 34 <canvas id="c" width="32" height="32"></canvas> 35 <script> 36 WebGLUtil.withWebGL2('c', function(gl) { 37 const vs = gl.createShader(gl.VERTEX_SHADER); 38 gl.shaderSource(vs, vertSource.innerHTML.trim()); 39 gl.compileShader(vs); 40 const fs = gl.createShader(gl.FRAGMENT_SHADER); 41 gl.shaderSource(fs, fragSource.innerHTML.trim()); 42 gl.compileShader(fs); 43 const prog = gl.createProgram(); 44 gl.attachShader(prog, vs); 45 gl.attachShader(prog, fs); 46 gl.linkProgram(prog); 47 gl.useProgram(prog); 48 gl.detachShader(prog, vs); 49 gl.detachShader(prog, fs); 50 51 gl.disable(gl.DEPTH_TEST); 52 var vertData = gl.createBuffer(); 53 gl.bindBuffer(gl.ARRAY_BUFFER, vertData); 54 gl.bufferData(gl.ARRAY_BUFFER, new Float32Array([-0.5, -0.5, 55 0.5, -0.5, 56 0.0, 0.5]), gl.STATIC_DRAW); 57 58 gl.clearColor(0, 1, 0, 1); 59 60 prog.POSITION = gl.getAttribLocation(prog, "POSITION"); 61 ok(prog.POSITION >= 0, '`POSITION` should be valid.'); 62 prog.blockIndex = gl.getUniformBlockIndex(prog, "UniformBlock"); 63 ok(prog.blockIndex >= 0, '`UniformBlock` index should be valid.'); 64 prog.blockSize = gl.getActiveUniformBlockParameter(prog, 65 prog.blockIndex, gl.UNIFORM_BLOCK_DATA_SIZE); 66 ok(prog.blockSize >= 0, '`UniformBlock` size should be valid.'); 67 68 var uboArray = new ArrayBuffer(prog.blockSize); 69 var uboFloat = new Float32Array(uboArray); 70 uboFloat.set([0.5, 0.2, 0.3, 0.3, 0.2, 0.1], 0); 71 var uniformBuffer = gl.createBuffer(); 72 gl.uniformBlockBinding(prog, prog.blockIndex, 1); 73 gl.bindBuffer(gl.UNIFORM_BUFFER, uniformBuffer); 74 gl.bufferData(gl.UNIFORM_BUFFER, uboFloat, gl.DYNAMIC_DRAW); 75 gl.bindBufferBase(gl.UNIFORM_BUFFER, 1, uniformBuffer); 76 77 gl.clear(gl.COLOR_BUFFER_BIT); 78 gl.drawArrays(gl.POINTS, 0, 1); 79 80 ok(true, 'Test complete.'); 81 }, function() { 82 SimpleTest.finish(); 83 }); 84 85 SimpleTest.waitForExplicitFinish(); 86 </script>