<!DOCTYPE HTML>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>WebGL2 test: using uniform blocks</title>
<script src="/tests/SimpleTest/SimpleTest.js"></script>
<link rel="stylesheet" href="/tests/SimpleTest/test.css">
<script src="webgl-util.js"></script>
<script id='vertSource' type='none'>
#version 300 es
uniform UniformBlock
{
  vec3 color;
  vec3 offset;
};
in vec2 POSITION;
out vec3 outCOLOR0;

void main() {
  gl_Position = vec4(POSITION, 0.0, 1.0);
  outCOLOR0 = vec3(color.x + offset.x, color.y + offset.y,
                   color.z + offset.z);
}
</script>
<script id='fragSource' type='none'>
#version 300 es
precision mediump float;
in vec3 outCOLOR0;
out vec4 oFragColor;

void main() {
  oFragColor = vec4(outCOLOR0, 1.0);
}
</script>
<body>
<canvas id="c" width="32" height="32"></canvas>
<script>
  WebGLUtil.withWebGL2('c', function(gl) {
    const vs = gl.createShader(gl.VERTEX_SHADER);
    gl.shaderSource(vs, vertSource.innerHTML.trim());
    gl.compileShader(vs);
    const fs = gl.createShader(gl.FRAGMENT_SHADER);
    gl.shaderSource(fs, fragSource.innerHTML.trim());
    gl.compileShader(fs);
    const prog = gl.createProgram();
    gl.attachShader(prog, vs);
    gl.attachShader(prog, fs);
    gl.linkProgram(prog);
    gl.useProgram(prog);
    gl.detachShader(prog, vs);
    gl.detachShader(prog, fs);

    gl.disable(gl.DEPTH_TEST);
    var vertData = gl.createBuffer();
    gl.bindBuffer(gl.ARRAY_BUFFER, vertData);
    gl.bufferData(gl.ARRAY_BUFFER, new Float32Array([-0.5, -0.5,
                                                     0.5, -0.5,
                                                     0.0, 0.5]), gl.STATIC_DRAW);

    gl.clearColor(0, 1, 0, 1);

    prog.POSITION = gl.getAttribLocation(prog, "POSITION");
    ok(prog.POSITION >= 0, '`POSITION` should be valid.');
    prog.blockIndex = gl.getUniformBlockIndex(prog, "UniformBlock");
    ok(prog.blockIndex >= 0, '`UniformBlock` index should be valid.');
    prog.blockSize = gl.getActiveUniformBlockParameter(prog,
                      prog.blockIndex, gl.UNIFORM_BLOCK_DATA_SIZE);
    ok(prog.blockSize >= 0, '`UniformBlock` size should be valid.');

    var uboArray = new ArrayBuffer(prog.blockSize);
    var uboFloat = new Float32Array(uboArray);
    uboFloat.set([0.5, 0.2, 0.3, 0.3, 0.2, 0.1], 0);
    var uniformBuffer = gl.createBuffer();
    gl.uniformBlockBinding(prog, prog.blockIndex, 1);
    gl.bindBuffer(gl.UNIFORM_BUFFER, uniformBuffer);
    gl.bufferData(gl.UNIFORM_BUFFER, uboFloat, gl.DYNAMIC_DRAW);
    gl.bindBufferBase(gl.UNIFORM_BUFFER, 1, uniformBuffer);

    gl.clear(gl.COLOR_BUFFER_BIT);
    gl.drawArrays(gl.POINTS, 0, 1);

    ok(true, 'Test complete.');
  }, function() {
    SimpleTest.finish();
  });

  SimpleTest.waitForExplicitFinish();
</script>
