content/canvas/test/webgl-conformance/conformance/textures/texture-mips.html@deefc01c0e14
content/canvas/test/webgl-conformance/conformance/textures/texture-mips.html
Thu, 15 Jan 2015 21:03:48 +0100
- author
- Michael Schloh von Bennewitz <michael@schloh.com>
- date
- Thu, 15 Jan 2015 21:03:48 +0100
- branch
- TOR_BUG_9701
- changeset 11
- deefc01c0e14
- permissions
- -rw-r--r--
Integrate friendly tips from Tor colleagues to make (or not) 4.5 alpha 3;
This includes removal of overloaded (but unused) methods, and addition of
a overlooked call to DataStruct::SetData(nsISupports, uint32_t, bool.)
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 texture mips 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 <script src="../resources/webgl-test-utils.js"></script>
15 </head>
16 <body>
17 <canvas id="example" width="2" height="2" style="width: 40px; height: 40px;"></canvas>
18 <div id="description"></div>
19 <div id="console"></div>
20 <script id="vshader" type="x-shader/x-vertex">
21 uniform vec4 uMult;
22 attribute vec4 vPosition;
23 attribute vec2 texCoord0;
24 varying vec2 texCoord;
25 void main()
26 {
27 gl_Position = vPosition * uMult;
28 texCoord = texCoord0;
29 }
30 </script>
32 <script id="fshader" type="x-shader/x-fragment">
33 precision mediump float;
34 uniform sampler2D tex;
35 varying vec2 texCoord;
36 void main()
37 {
38 gl_FragColor = texture2D(tex, texCoord);
39 }
40 </script>
41 <script>
42 var canvas;
43 var wtu = WebGLTestUtils;
44 function init()
45 {
46 if (window.initNonKhronosFramework) {
47 window.initNonKhronosFramework(false);
48 }
50 description("Checks mip issues");
52 canvas = document.getElementById("example");
53 shouldBe("canvas.width", "2");
54 shouldBe("canvas.height", "2");
56 gl = wtu.create3DContext(canvas);
57 wtu.setupUnitQuad(gl, 0, 1);
58 var program = wtu.setupProgram(
59 gl, ['vshader', 'fshader'], ['vPosition', 'texCoord0'], [0, 1]);
61 gl.disable(gl.DEPTH_TEST);
62 gl.disable(gl.BLEND);
64 var colors = {
65 blue: [0, 0, 255, 255],
66 red: [255, 0, 0, 255],
67 green: [0, 255, 0, 255],
68 cyan: [128, 255, 255, 255],
69 black: [0, 0, 0, 255]
70 };
72 var mips = [
73 ];
75 var texLoc = gl.getUniformLocation(program, "tex");
76 gl.uniform1i(texLoc, 0);
77 var multLoc = gl.getUniformLocation(program, "uMult");
79 // ----------------------------------------------------
80 var tex = createTexture();
81 gl.uniform4f(multLoc, 1, 1, 1, 1);
83 gl.bindTexture(gl.TEXTURE_2D, tex);
84 // 16x16 texture no mips
85 fillLevel(tex, 0, 16, 'cyan');
87 check('black',
88 "texture that is missing mips when TEXTURE_MIN_FILTER not NEAREST or LINEAR");
90 generateMipmap();
92 check('cyan', "texture that has all mips");
94 // Fill in the bottom 2 mips with a different color.
95 fillLevel(tex, 4, 1, 'green');
96 fillLevel(tex, 3, 2, 'green');
98 // Choose the nearest mip
99 texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR_MIPMAP_NEAREST);
101 check('green', "texture that is only using the smallest 2 mips");
103 gl.uniform4f(multLoc, 16, 16, 1, 1);
105 check('cyan', "texture that is using only the largest 2 mips");
107 // Set the top level
108 fillLevel(tex, 0, 1, 'red');
109 check('red',
110 "texture that is only using the top level even though other levels are defined");
112 // Set the top 2 levels using generateMipmap
113 fillLevel(tex, 0, 2, 'blue');
114 generateMipmap();
116 check('blue',
117 "texture that is only using the top 2 levels even though other levels are defined");
119 // Set the top 2 levels back to sizes that end up using levels 2, 3, and 4 again.
120 fillLevel(tex, 0, 16, 'blue');
121 fillLevel(tex, 1, 8, 'blue');
122 check('blue', "texture that is only using the largest 2 mips");
123 gl.uniform4f(multLoc, 1, 1, 1, 1);
124 check('green', "texture that is only using the smallest 2 mips");
126 // ----------------------------------------------------
127 var tex = createTexture();
128 gl.uniform4f(multLoc, 1, 1, 1, 1);
129 fillLevel(tex, 0, 8, 'cyan');
130 generateMipmap();
131 check('cyan', "texture that has 3 mips");
133 fillLevel(tex, 0, 16, 'blue');
134 texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR);
135 check('blue', "texture that is only using top mips");
137 fillLevel(tex, 0, 8, 'red');
138 texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR_MIPMAP_NEAREST);
139 check('cyan', "texture that is only using smallest mips");
141 gl.uniform4f(multLoc, 16, 16, 1, 1);
142 check('red', "texture that is using only the largest mip");
144 // ----------------------------------------------------
145 var tex = createTexture();
146 gl.uniform4f(multLoc, 1, 1, 1, 1);
147 fillLevel(tex, 2, 1, 'green');
148 fillLevel(tex, 1, 2, 'green');
149 fillLevel(tex, 0, 4, 'green');
150 check('green', "texture that was built smallest mip first");
152 // ----------------------------------------------------
153 var tex = createTexture();
154 gl.uniform4f(multLoc, 1, 1, 1, 1);
155 fillLevel(tex, 0, 16, 'red');
156 generateMipmap();
157 check('red', "texture with 1 genmipmaps");
158 fillLevel(tex, 0, 16, 'blue');
159 generateMipmap();
160 fillLevel(tex, 0, 16, 'green');
161 generateMipmap();
162 check('green', "texture with 2 genmipmaps");
164 // ----------------------------------------------------
165 glErrorShouldBe(gl, gl.NO_ERROR, "Should be no errors.");
167 function createTexture() {
168 debug("<hr/>gl.createTexture()");
169 mips = [];
170 makeDivMipChain();
171 return gl.createTexture();
172 }
174 function texParameteri(target, pname, value) {
175 debug("gl.texParameteri(" +
176 wtu.glEnumToString(gl, target) + ", " +
177 wtu.glEnumToString(gl, pname) + ", " +
178 wtu.glEnumToString(gl, value) + ")")
179 gl.texParameteri(target, pname, value);
180 }
182 function generateMipmap() {
183 debug("gl.genreateMipmap(gl.TEXTURE_2D)");
184 gl.generateMipmap(gl.TEXTURE_2D);
185 var mip0 = mips[0];
186 var size = mip0.size;
187 var level = 1;
188 for(;;) {
189 size = Math.floor(size / 2);
190 if (!size) {
191 break;
192 }
193 setMipData(level, size, mip0.color);
194 ++level;
195 }
196 makeDivMipChain();
197 }
199 function check(color, msg) {
200 wtu.drawQuad(gl);
201 wtu.checkCanvas(gl, colors[color], msg + " should draw with " + color);
202 }
204 function fillLevel(tex, level, size, color) {
205 setMipData(level, size, color);
206 debug("gl.texImage2D(gl.TEXTURE_2D, " + level + ", gl.RGBA, " + size + ", " + size +
207 ", 0, gl.RGBA, gl.UNSIGNED_BYTE, " + color + ");");
208 wtu.fillTexture(gl, tex, size, size, colors[color], level);
209 makeDivMipChain();
210 }
212 function setMipData(level, size, color) {
213 mips[level] = {
214 size: size,
215 color: color
216 };
217 }
219 function makeDivMipChain(color) {
220 var html = [
221 '<div style="height: 68px; margin-top: 5px">',
222 '<div style="float:left;">mips: </div>'];
223 for (var ii = 0; ii < 5; ++ii) {
224 var mip = mips[ii];
225 if (mip) {
226 html.push(makeDivSquare(mip.size, mip.color));
227 } else {
228 html.push(makeDivSquare(16, undefined));
229 }
230 }
231 html.push("</div>");
232 debug(html.join(""));
233 }
235 function makeDivSquare(size, color) {
236 size *= 4;
237 var c = color ? colors[color] : [255,255,255];
238 var border = color ? 'solid' : 'dashed';
239 return '<div style="float:left; width: ' + size + 'px; height: ' + size +
240 'px; background-color: ' + rgb(c) +
241 '; border: 1px ' + border + ' black; margin-right: 3px;"></div>';
242 }
244 function rgb(c) {
245 return 'rgb(' + c[0] + ',' + c[1] + ',' + c[2] +')';
246 }
247 }
249 init();
250 successfullyParsed = true;
251 </script>
253 <script>finishTest();</script>
254 </body>
255 </html>
