|
1 <!-- |
|
2 Copyright (c) 2011 The Chromium Authors. All rights reserved. |
|
3 Use of this source code is governed by a BSD-style license that can be |
|
4 found in the LICENSE file. |
|
5 --> |
|
6 <!DOCTYPE html> |
|
7 <html> |
|
8 <head> |
|
9 <meta charset="utf-8"> |
|
10 <title>WebGL TexParameter conformance test.</title> |
|
11 <link rel="stylesheet" href="../../resources/js-test-style.css"/> |
|
12 <script src="../../resources/js-test-pre.js"></script> |
|
13 <script src="../resources/webgl-test.js"> </script> |
|
14 </head> |
|
15 <body> |
|
16 <canvas id="example" width="24" height="24"></canvas> |
|
17 <canvas id="canvas2d" width="2" height="2"></canvas> |
|
18 <div id="description"></div> |
|
19 <div id="console"></div> |
|
20 <script id="vshader" type="x-shader/x-vertex"> |
|
21 uniform mat4 world; |
|
22 attribute vec3 vPosition; |
|
23 attribute vec2 texCoord0; |
|
24 varying vec2 texCoord; |
|
25 void main() |
|
26 { |
|
27 gl_Position = world * vec4(vPosition, 1); |
|
28 texCoord = texCoord0; |
|
29 } |
|
30 </script> |
|
31 |
|
32 <script id="fshader" type="x-shader/x-fragment"> |
|
33 precision mediump float; |
|
34 |
|
35 uniform sampler2D tex; |
|
36 varying vec2 texCoord; |
|
37 void main() |
|
38 { |
|
39 gl_FragColor = texture2D(tex, texCoord); |
|
40 } |
|
41 </script> |
|
42 |
|
43 <script> |
|
44 function init() |
|
45 { |
|
46 if (window.initNonKhronosFramework) { |
|
47 window.initNonKhronosFramework(false); |
|
48 } |
|
49 |
|
50 description("Tests TexParameter works as expected"); |
|
51 debug(""); |
|
52 |
|
53 var canvas2d = document.getElementById("canvas2d"); |
|
54 var ctx2d = canvas2d.getContext("2d"); |
|
55 |
|
56 gl = initWebGL("example", "vshader", "fshader", [ "vPosition", "texCoord0"], |
|
57 [ 0, 0, 0, 1 ], 1); |
|
58 |
|
59 gl.disable(gl.DEPTH_TEST); |
|
60 gl.disable(gl.BLEND); |
|
61 |
|
62 var vertexObject = gl.createBuffer(); |
|
63 gl.bindBuffer(gl.ARRAY_BUFFER, vertexObject); |
|
64 gl.bufferData( |
|
65 gl.ARRAY_BUFFER, |
|
66 new Float32Array([-1, 1,0, 1,1,0, -1,-1,0, |
|
67 -1,-1,0, 1,1,0, 1,-1,0]), |
|
68 gl.STATIC_DRAW); |
|
69 gl.enableVertexAttribArray(0); |
|
70 gl.vertexAttribPointer(0, 3, gl.FLOAT, false, 0, 0); |
|
71 |
|
72 var vertexObject = gl.createBuffer(); |
|
73 gl.bindBuffer(gl.ARRAY_BUFFER, vertexObject); |
|
74 gl.bufferData( |
|
75 gl.ARRAY_BUFFER, |
|
76 new Float32Array([ -2.5,-2.5, 3.5,-2.5, -2.5,3.5, |
|
77 -2.5,3.5, 3.5,-2.5, 3.5,3.5]), |
|
78 gl.STATIC_DRAW); |
|
79 gl.enableVertexAttribArray(1); |
|
80 gl.vertexAttribPointer(1, 2, gl.FLOAT, false, 0, 0); |
|
81 |
|
82 var colors = [ |
|
83 [0,255,128,255], |
|
84 [128,64,255,255], |
|
85 [192,255,64,255], |
|
86 [200,0,255,255]]; |
|
87 var texParam = [ |
|
88 gl.REPEAT, |
|
89 gl.CLAMP_TO_EDGE, |
|
90 gl.MIRRORED_REPEAT, |
|
91 gl.REPEAT]; |
|
92 |
|
93 // Make textures setting the texture parameters differently each time.. |
|
94 // This verifies both that the render correct AND that texture parameters |
|
95 // are associated with the textures, not with the texture-units. |
|
96 var textures = []; |
|
97 for (var ii = 0; ii < colors.length; ++ii) { |
|
98 var c = colors[ii]; |
|
99 ctx2d.fillStyle = |
|
100 "rgba(" + c[0] + "," + c[1] + "," + c[2] + "," + c[3] + ")"; |
|
101 ctx2d.fillRect(0, 0, 1, 1); |
|
102 var tex = gl.createTexture(); |
|
103 gl.bindTexture(gl.TEXTURE_2D, tex); |
|
104 gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, canvas2d); |
|
105 gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.NEAREST); |
|
106 gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.NEAREST); |
|
107 gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, texParam[ii]); |
|
108 gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, texParam[ii]); |
|
109 textures[ii] = tex; |
|
110 } |
|
111 |
|
112 var textureLoc = gl.getUniformLocation(gl.program, "tex"); |
|
113 var worldLoc = gl.getUniformLocation(gl.program, "world"); |
|
114 |
|
115 gl.clearColor(1,1,1,1); |
|
116 gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT); |
|
117 |
|
118 for (var ii = 0; ii < colors.length; ++ii) { |
|
119 var x = ii % 2; |
|
120 var y = Math.floor(ii / 2); |
|
121 gl.bindTexture(gl.TEXTURE_2D, textures[ii]); |
|
122 gl.uniformMatrix4fv( |
|
123 worldLoc, false, |
|
124 [0.5, 0, 0, 0, |
|
125 0, 0.5, 0, 0, |
|
126 0, 0, 1, 0, |
|
127 -0.5 + x, -0.5 + y, 0, 1]); |
|
128 gl.drawArrays(gl.TRIANGLES, 0, 6); |
|
129 } |
|
130 |
|
131 var buf = new Uint8Array(24 * 24 * 4); |
|
132 gl.readPixels(0, 0, 24, 24, gl.RGBA, gl.UNSIGNED_BYTE, buf); |
|
133 var passed = true; |
|
134 for (var ii = 0; ii < colors.length; ++ii) { |
|
135 var x = ii % 2; |
|
136 var y = Math.floor(ii / 2); |
|
137 var c = colors[ii]; |
|
138 for (var yy = 0; yy < 12; ++yy) { |
|
139 for (var xx = 0; xx < 12; ++xx) { |
|
140 var ec = [0,0,0,0]; |
|
141 switch (texParam[ii]) { |
|
142 case gl.REPEAT: |
|
143 if (xx % 2 == 1 && yy % 2 == 0) { |
|
144 ec = c; |
|
145 } |
|
146 break; |
|
147 case gl.CLAMP_TO_EDGE: |
|
148 if (xx < 6 && yy >= 6) { |
|
149 ec = c; |
|
150 } |
|
151 break; |
|
152 case gl.MIRRORED_REPEAT: |
|
153 if (xx % 4 < 2 && yy % 4 >= 2) { |
|
154 ec = c; |
|
155 } |
|
156 break; |
|
157 } |
|
158 var off = ((y * 12 + yy) * 24 + x * 12 + xx) * 4; |
|
159 if (buf[off + 0] != ec[0] || |
|
160 buf[off + 1] != ec[1] || |
|
161 buf[off + 2] != ec[2] || |
|
162 buf[off + 3] != ec[3]) { |
|
163 var msg = 'at (' + (x * 12 + xx) + ', ' + (y * 12 + yy) + |
|
164 ') expected: ' + |
|
165 ec[0] + ', ' + ec[1] + ', ' + ec[2] + ', ' + ec[3] + ' found: ' + |
|
166 buf[off + 0] + ', ' + |
|
167 buf[off + 1] + ', ' + |
|
168 buf[off + 2] + ', ' + |
|
169 buf[off + 3]; |
|
170 testFailed(msg); |
|
171 passed = false; |
|
172 } |
|
173 } |
|
174 } |
|
175 } |
|
176 if (passed) { |
|
177 testPassed("rendered as expected"); |
|
178 } |
|
179 } |
|
180 |
|
181 init(); |
|
182 successfullyParsed = true; |
|
183 </script> |
|
184 <script>finishTest();</script> |
|
185 |
|
186 </body> |
|
187 </html> |
|
188 |