1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
|
<!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>
|
