1 <!DOCTYPE html> 2 <html> 3 <body> 4 <script src="../resources/runner.js"></script> 5 <script src="resources/canvas_runner.js"></script> 6 <script> 7 8 var canvas2D = document.createElement("canvas"); 9 var ctx2D = canvas2D.getContext("2d"); 10 var canvas3D = document.createElement('canvas'); 11 var gl = canvas3D.getContext('experimental-webgl'); 12 if(!gl) 13 CanvasRunner.logFatalError("\nWebGL is not supported or enabled on this platform!\n"); 14 var tex = null; 15 16 function setSize(width, height) { 17 canvas2D.width = width; 18 canvas2D.height = height; 19 canvas3D.width = width; 20 canvas3D.height = height; 21 } 22 23 function rand(range) { 24 return Math.floor(Math.random() * range); 25 } 26 27 function fillCanvas(ctx2d, canvas2d) { 28 ctx2d.fillStyle = "rgba(" + rand(255) + "," + rand(255) + "," + rand(255) + "," + rand(255) + ")"; 29 ctx2d.fillRect(0, 0, canvas2d.width, canvas2d.height); 30 } 31 32 function preRun() { 33 tex = gl.createTexture(); 34 gl.bindTexture(gl.TEXTURE_2D, tex); 35 } 36 37 function doRun() { 38 gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, canvas2D); 39 } 40 41 function ensureComplete() { 42 gl.readPixels(0, 0, 1, 1, gl.RGBA, gl.UNSIGNED_BYTE, new Uint8Array(4)); 43 } 44 45 function postRun() { 46 gl.deleteTexture(tex); 47 } 48 49 window.onload = function () { 50 setSize(1024, 1024); 51 fillCanvas(ctx2D, canvas2D); 52 CanvasRunner.start({ 53 description: "This bench test checks the speed on uploading 2d Canvas(1024x1024) to Webgl Texture(1024x1024).", 54 preRun: preRun, 55 doRun: doRun, 56 ensureComplete: ensureComplete, 57 postRun: postRun}); 58 } 59 60 </script> 61 </body> 62 </html> 63