tex-image-and-sub-image-3d-with-image.js (12771B)
1 /* 2 Copyright (c) 2019 The Khronos Group Inc. 3 Use of this source code is governed by an MIT-style license that can be 4 found in the LICENSE.txt file. 5 */ 6 7 function generateTest(internalFormat, pixelFormat, pixelType, prologue, resourcePath, defaultContextVersion) { 8 var wtu = WebGLTestUtils; 9 var tiu = TexImageUtils; 10 var gl = null; 11 var successfullyParsed = false; 12 var imgCanvas; 13 var redColor = [255, 0, 0]; 14 var greenColor = [0, 255, 0]; 15 var blueColor = [0, 0, 255]; 16 var cyanColor = [0, 255, 255]; 17 var imageURLs = [resourcePath + "red-green.png", 18 resourcePath + "red-green-blue-cyan-4x4.png"]; 19 20 function init() 21 { 22 description('Verify texImage3D and texSubImage3D code paths taking image elements (' + internalFormat + '/' + pixelFormat + '/' + pixelType + ')'); 23 24 // Set the default context version while still allowing the webglVersion URL query string to override it. 25 wtu.setDefault3DContextVersion(defaultContextVersion); 26 gl = wtu.create3DContext("example"); 27 28 if (!prologue(gl)) { 29 finishTest(); 30 return; 31 } 32 33 switch (gl[pixelFormat]) { 34 case gl.RED: 35 case gl.RED_INTEGER: 36 greenColor = [0, 0, 0]; 37 blueColor = [0, 0, 0]; 38 cyanColor = [0, 0, 0]; 39 break; 40 41 case gl.RG: 42 case gl.RG_INTEGER: 43 blueColor = [0, 0, 0]; 44 cyanColor = [0, 255, 0]; 45 break; 46 47 default: 48 break; 49 } 50 51 gl.clearColor(0,0,0,1); 52 gl.clearDepth(1); 53 54 wtu.loadImagesAsync(imageURLs, runTest); 55 } 56 57 function uploadImageToTexture(image, useTexSubImage3D, flipY, bindingTarget, 58 depth, sourceSubRectangle, unpackImageHeight) 59 { 60 gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT); 61 // Disable any writes to the alpha channel 62 gl.colorMask(1, 1, 1, 0); 63 var texture = gl.createTexture(); 64 // Bind the texture to texture unit 0 65 gl.bindTexture(bindingTarget, texture); 66 // Set up texture parameters 67 gl.texParameteri(bindingTarget, gl.TEXTURE_MIN_FILTER, gl.NEAREST); 68 gl.texParameteri(bindingTarget, gl.TEXTURE_MAG_FILTER, gl.NEAREST); 69 gl.texParameteri(bindingTarget, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE); 70 gl.texParameteri(bindingTarget, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE); 71 gl.texParameteri(bindingTarget, gl.TEXTURE_WRAP_R, gl.CLAMP_TO_EDGE); 72 // Set up pixel store parameters 73 gl.pixelStorei(gl.UNPACK_FLIP_Y_WEBGL, flipY); 74 gl.pixelStorei(gl.UNPACK_PREMULTIPLY_ALPHA_WEBGL, false); 75 gl.pixelStorei(gl.UNPACK_COLORSPACE_CONVERSION_WEBGL, gl.NONE); 76 var uploadWidth = image.width; 77 var uploadHeight = image.height; 78 if (sourceSubRectangle) { 79 gl.pixelStorei(gl.UNPACK_SKIP_PIXELS, sourceSubRectangle[0]); 80 gl.pixelStorei(gl.UNPACK_SKIP_ROWS, sourceSubRectangle[1]); 81 uploadWidth = sourceSubRectangle[2]; 82 uploadHeight = sourceSubRectangle[3]; 83 } 84 if (unpackImageHeight) { 85 gl.pixelStorei(gl.UNPACK_IMAGE_HEIGHT, unpackImageHeight); 86 } 87 // Upload the image into the texture 88 if (useTexSubImage3D) { 89 // Initialize the texture to black first 90 gl.texImage3D(bindingTarget, 0, gl[internalFormat], uploadWidth, uploadHeight, depth, 0, 91 gl[pixelFormat], gl[pixelType], null); 92 gl.texSubImage3D(bindingTarget, 0, 0, 0, 0, uploadWidth, uploadHeight, depth, 93 gl[pixelFormat], gl[pixelType], image); 94 } else { 95 gl.texImage3D(bindingTarget, 0, gl[internalFormat], uploadWidth, uploadHeight, depth, 0, 96 gl[pixelFormat], gl[pixelType], image); 97 } 98 gl.pixelStorei(gl.UNPACK_SKIP_PIXELS, 0); 99 gl.pixelStorei(gl.UNPACK_SKIP_ROWS, 0); 100 gl.pixelStorei(gl.UNPACK_IMAGE_HEIGHT, 0); 101 wtu.glErrorShouldBe(gl, gl.NO_ERROR, "should be no errors from texture upload"); 102 } 103 104 function runRedGreenTest(image) { 105 function runOneIteration(image, useTexSubImage3D, flipY, bindingTarget, topColor, bottomColor, program) 106 { 107 debug('Testing ' + (useTexSubImage3D ? 'texSubImage3D' : 'texImage3D') + 108 ' with flipY=' + flipY + ' bindingTarget=' + 109 (bindingTarget == gl.TEXTURE_3D ? 'TEXTURE_3D' : 'TEXTURE_2D_ARRAY')); 110 111 uploadImageToTexture(image, useTexSubImage3D, flipY, bindingTarget, 1); 112 113 // Draw the triangles 114 wtu.clearAndDrawUnitQuad(gl, [0, 0, 0, 255]); 115 // Check a few pixels near the top and bottom and make sure they have 116 // the right color. 117 debug("Checking lower left corner"); 118 wtu.checkCanvasRect(gl, 4, 4, 2, 2, bottomColor, 119 "shouldBe " + bottomColor); 120 debug("Checking upper left corner"); 121 wtu.checkCanvasRect(gl, 4, gl.canvas.height - 8, 2, 2, topColor, 122 "shouldBe " + topColor); 123 } 124 125 var cases = [ 126 { sub: false, flipY: true, topColor: redColor, bottomColor: greenColor }, 127 { sub: false, flipY: false, topColor: greenColor, bottomColor: redColor }, 128 { sub: true, flipY: true, topColor: redColor, bottomColor: greenColor }, 129 { sub: true, flipY: false, topColor: greenColor, bottomColor: redColor }, 130 ]; 131 132 var program = tiu.setupTexturedQuadWith3D(gl, internalFormat); 133 for (var i in cases) { 134 runOneIteration(image, cases[i].sub, cases[i].flipY, gl.TEXTURE_3D, 135 cases[i].topColor, cases[i].bottomColor, program); 136 } 137 program = tiu.setupTexturedQuadWith2DArray(gl, internalFormat); 138 for (var i in cases) { 139 runOneIteration(image, cases[i].sub, cases[i].flipY, gl.TEXTURE_2D_ARRAY, 140 cases[i].topColor, cases[i].bottomColor, program); 141 } 142 } 143 144 function runRedGreenBlueCyanTest(image) { 145 function runOneIteration(image, useTexSubImage3D, flipY, bindingTarget, 146 depth, sourceSubRectangle, unpackImageHeight, 147 rTextureCoord, topColor, bottomColor, program) 148 { 149 sourceSubRectangleString = ''; 150 if (sourceSubRectangle) { 151 sourceSubRectangleString = ' sourceSubRectangle=' + sourceSubRectangle; 152 } 153 unpackImageHeightString = ''; 154 if (unpackImageHeight) { 155 unpackImageHeightString = ' unpackImageHeight=' + unpackImageHeight; 156 } 157 debug('Testing ' + (useTexSubImage3D ? 'texSubImage3D' : 'texImage3D') + 158 ' with flipY=' + flipY + ' bindingTarget=' + 159 (bindingTarget == gl.TEXTURE_3D ? 'TEXTURE_3D' : 'TEXTURE_2D_ARRAY') + 160 sourceSubRectangleString + ' depth=' + depth + unpackImageHeightString + 161 ' rTextureCoord=' + rTextureCoord); 162 163 uploadImageToTexture(image, useTexSubImage3D, flipY, bindingTarget, 164 depth, sourceSubRectangle, unpackImageHeight); 165 var rCoordLocation = gl.getUniformLocation(program, 'uRCoord'); 166 if (!rCoordLocation) { 167 testFailed('Shader incorrectly set up; couldn\'t find uRCoord uniform'); 168 return; 169 } 170 gl.uniform1f(rCoordLocation, rTextureCoord); 171 172 // Draw the triangles 173 wtu.clearAndDrawUnitQuad(gl, [0, 0, 0, 255]); 174 // Check a few pixels near the top and bottom and make sure they have 175 // the right color. 176 debug("Checking lower left corner"); 177 wtu.checkCanvasRect(gl, 4, 4, 2, 2, bottomColor, 178 "shouldBe " + bottomColor); 179 debug("Checking upper left corner"); 180 wtu.checkCanvasRect(gl, 4, gl.canvas.height - 8, 2, 2, topColor, 181 "shouldBe " + topColor); 182 } 183 184 var cases = [ 185 // No UNPACK_IMAGE_HEIGHT specified. 186 { flipY: false, sourceSubRectangle: [0, 0, 2, 2], depth: 2, rTextureCoord: 0.0, 187 topColor: redColor, bottomColor: redColor }, 188 { flipY: false, sourceSubRectangle: [0, 0, 2, 2], depth: 2, rTextureCoord: 1.0, 189 topColor: blueColor, bottomColor: blueColor }, 190 { flipY: true, sourceSubRectangle: [0, 0, 2, 2], depth: 2, rTextureCoord: 0.0, 191 topColor: blueColor, bottomColor: blueColor }, 192 { flipY: true, sourceSubRectangle: [0, 0, 2, 2], depth: 2, rTextureCoord: 1.0, 193 topColor: redColor, bottomColor: redColor }, 194 { flipY: false, sourceSubRectangle: [2, 0, 2, 2], depth: 2, rTextureCoord: 0.0, 195 topColor: greenColor, bottomColor: greenColor }, 196 { flipY: false, sourceSubRectangle: [2, 0, 2, 2], depth: 2, rTextureCoord: 1.0, 197 topColor: cyanColor, bottomColor: cyanColor }, 198 { flipY: true, sourceSubRectangle: [2, 0, 2, 2], depth: 2, rTextureCoord: 0.0, 199 topColor: cyanColor, bottomColor: cyanColor }, 200 { flipY: true, sourceSubRectangle: [2, 0, 2, 2], depth: 2, rTextureCoord: 1.0, 201 topColor: greenColor, bottomColor: greenColor }, 202 203 // Use UNPACK_IMAGE_HEIGHT to skip some pixels. 204 { flipY: false, sourceSubRectangle: [0, 0, 1, 1], depth: 2, unpackImageHeight: 2, rTextureCoord: 0.0, 205 topColor: redColor, bottomColor: redColor }, 206 { flipY: false, sourceSubRectangle: [0, 0, 1, 1], depth: 2, unpackImageHeight: 2, rTextureCoord: 1.0, 207 topColor: blueColor, bottomColor: blueColor }, 208 { flipY: true, sourceSubRectangle: [0, 0, 1, 1], depth: 2, unpackImageHeight: 2, rTextureCoord: 0.0, 209 topColor: blueColor, bottomColor: blueColor }, 210 { flipY: true, sourceSubRectangle: [0, 0, 1, 1], depth: 2, unpackImageHeight: 2, rTextureCoord: 1.0, 211 topColor: redColor, bottomColor: redColor }, 212 { flipY: false, sourceSubRectangle: [2, 0, 1, 1], depth: 2, unpackImageHeight: 2, rTextureCoord: 0.0, 213 topColor: greenColor, bottomColor: greenColor }, 214 { flipY: false, sourceSubRectangle: [2, 0, 1, 1], depth: 2, unpackImageHeight: 2, rTextureCoord: 1.0, 215 topColor: cyanColor, bottomColor: cyanColor }, 216 { flipY: true, sourceSubRectangle: [2, 0, 1, 1], depth: 2, unpackImageHeight: 2, rTextureCoord: 0.0, 217 topColor: cyanColor, bottomColor: cyanColor }, 218 { flipY: true, sourceSubRectangle: [2, 0, 1, 1], depth: 2, unpackImageHeight: 2, rTextureCoord: 1.0, 219 topColor: greenColor, bottomColor: greenColor }, 220 ]; 221 222 var program = tiu.setupTexturedQuadWith3D(gl, internalFormat); 223 for (var i in cases) { 224 runOneIteration(image, false, cases[i].flipY, gl.TEXTURE_3D, 225 cases[i].depth, cases[i].sourceSubRectangle, 226 cases[i].unpackImageHeight, cases[i].rTextureCoord, 227 cases[i].topColor, cases[i].bottomColor, 228 program); 229 runOneIteration(image, true, cases[i].flipY, gl.TEXTURE_3D, 230 cases[i].depth, cases[i].sourceSubRectangle, 231 cases[i].unpackImageHeight, cases[i].rTextureCoord, 232 cases[i].topColor, cases[i].bottomColor, 233 program); 234 } 235 236 program = tiu.setupTexturedQuadWith2DArray(gl, internalFormat); 237 for (var i in cases) { 238 runOneIteration(image, false, cases[i].flipY, gl.TEXTURE_2D_ARRAY, 239 cases[i].depth, cases[i].sourceSubRectangle, 240 cases[i].unpackImageHeight, cases[i].rTextureCoord, 241 cases[i].topColor, cases[i].bottomColor, 242 program); 243 runOneIteration(image, true, cases[i].flipY, gl.TEXTURE_2D_ARRAY, 244 cases[i].depth, cases[i].sourceSubRectangle, 245 cases[i].unpackImageHeight, cases[i].rTextureCoord, 246 cases[i].topColor, cases[i].bottomColor, 247 program); 248 } 249 } 250 251 function runTest(imageMap) 252 { 253 runRedGreenTest(imageMap[imageURLs[0]]); 254 runRedGreenBlueCyanTest(imageMap[imageURLs[1]]); 255 wtu.glErrorShouldBe(gl, gl.NO_ERROR, "should be no errors"); 256 finishTest(); 257 } 258 259 return init; 260 }