Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(554)

Side by Side Diff: content/test/data/gpu/pixel_offscreenCanvas_webgl_commit_worker.html

Issue 2594843002: Implementing promise-based commit for driving OffscreenCanvas animations (Closed)
Patch Set: rebase Created 3 years, 11 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
OLDNEW
1 <!DOCTYPE HTML> 1 <!DOCTYPE HTML>
2 2
3 <!-- READ BEFORE UPDATING: 3 <!-- READ BEFORE UPDATING:
4 If this test is updated make sure to increment the "revision" value of the 4 If this test is updated make sure to increment the "revision" value of the
5 associated test in content/test/gpu/gpu_tests/pixel_test_pages.py. This will ens ure 5 associated test in content/test/gpu/gpu_tests/pixel_test_pages.py. This will ens ure
6 that the baseline images are regenerated on the next run. 6 that the baseline images are regenerated on the next run.
7 --> 7 -->
8 8
9 <html> 9 <html>
10 <head> 10 <head>
11 <title>OffscreenCanvas commit flow on worker thread: red square on white backgro und.</title> 11 <title>OffscreenCanvas commit flow on worker thread: red square on white backgro und.</title>
12 <style type="text/css"> 12 <style type="text/css">
13 .nomargin { 13 .nomargin {
14 margin: 0px auto; 14 margin: 0px auto;
15 } 15 }
16 </style> 16 </style>
17 <script id="myWorker" type="text/worker"> 17 <script id="myWorker" type="text/worker">
18 function drawTriangle(canvas) 18
19 var g_frameNumber = 0;
20 var gl;
21
22 function drawTriangle()
19 { 23 {
20 var gl = canvas.getContext("webgl");
21 gl.clearColor(0, 1, 0, 1); 24 gl.clearColor(0, 1, 0, 1);
22 gl.clear(gl.COLOR_BUFFER_BIT); 25 gl.clear(gl.COLOR_BUFFER_BIT);
23 26
24 var prog = gl.createProgram(); 27 var prog = gl.createProgram();
25 var vs = gl.createShader(gl.VERTEX_SHADER); 28 var vs = gl.createShader(gl.VERTEX_SHADER);
26 gl.shaderSource(vs, ['attribute vec2 pos;', 29 gl.shaderSource(vs, ['attribute vec2 pos;',
27 'void main() {', 30 'void main() {',
28 ' gl_Position = vec4(pos, 0., 1.);', 31 ' gl_Position = vec4(pos, 0., 1.);',
29 '}'].join('\n')); 32 '}'].join('\n'));
30 gl.compileShader(vs); 33 gl.compileShader(vs);
(...skipping 18 matching lines...) Expand all
49 } 52 }
50 gl.useProgram(prog); 53 gl.useProgram(prog);
51 54
52 gl.bindBuffer(gl.ARRAY_BUFFER, gl.createBuffer()); 55 gl.bindBuffer(gl.ARRAY_BUFFER, gl.createBuffer());
53 gl.bufferData(gl.ARRAY_BUFFER, new Float32Array([-.5,0, 0,.5, .5,0]), gl.STATI C_DRAW); 56 gl.bufferData(gl.ARRAY_BUFFER, new Float32Array([-.5,0, 0,.5, .5,0]), gl.STATI C_DRAW);
54 var attr = gl.getAttribLocation(prog, 'pos'); 57 var attr = gl.getAttribLocation(prog, 'pos');
55 gl.enableVertexAttribArray(attr); 58 gl.enableVertexAttribArray(attr);
56 gl.vertexAttribPointer(attr, 2, gl.FLOAT, false, 0, 0); 59 gl.vertexAttribPointer(attr, 2, gl.FLOAT, false, 0, 0);
57 60
58 gl.drawArrays(gl.TRIANGLE_STRIP, 0, 3); 61 gl.drawArrays(gl.TRIANGLE_STRIP, 0, 3);
62 }
59 63
60 gl.commit(); 64 function drawLoop()
65 {
66 if (g_frameNumber < 3) {
67 gl.clearColor(1, 0, 0, 1);
68 gl.clear(gl.COLOR_BUFFER_BIT);
69 g_frameNumber++;
70 gl.commit().then(drawLoop);
71 } else {
72 drawTriangle();
73 gl.commit();
74
75 // The following clear is never committed
76 gl.clearColor(0, 0, 1, 1);
77 gl.clear(gl.COLOR_BUFFER_BIT);
78
79 self.postMessage("");
80 }
61 } 81 }
62 82
63 self.onmessage = function(e) { 83 self.onmessage = function(e) {
64 var transferredOffscreenCanvas = e.data; 84 var transferredOffscreenCanvas = e.data;
65 drawTriangle(transferredOffscreenCanvas); 85 gl = transferredOffscreenCanvas.getContext("webgl");
66 self.postMessage(""); 86 drawLoop();
67 }; 87 };
68 </script> 88 </script>
69 <script> 89 <script>
70 var g_swapsBeforeAck = 15; 90 var g_swapsBeforeAck = 15;
71 91
72 function makeWorker(script) { 92 function makeWorker(script) {
73 var blob = new Blob([script]); 93 var blob = new Blob([script]);
74 return new Worker(URL.createObjectURL(blob)); 94 return new Worker(URL.createObjectURL(blob));
75 } 95 }
76 96
(...skipping 14 matching lines...) Expand all
91 } 111 }
92 112
93 function waitForFinish() 113 function waitForFinish()
94 { 114 {
95 if (g_swapsBeforeAck == 0) { 115 if (g_swapsBeforeAck == 0) {
96 domAutomationController.setAutomationId(1); 116 domAutomationController.setAutomationId(1);
97 domAutomationController.send("SUCCESS"); 117 domAutomationController.send("SUCCESS");
98 } else { 118 } else {
99 g_swapsBeforeAck--; 119 g_swapsBeforeAck--;
100 document.getElementById('container').style.zIndex = g_swapsBeforeAck + 1; 120 document.getElementById('container').style.zIndex = g_swapsBeforeAck + 1;
101 window.webkitRequestAnimationFrame(waitForFinish); 121 window.requestAnimationFrame(waitForFinish);
102 } 122 }
103 } 123 }
104 </script> 124 </script>
105 </head> 125 </head>
106 <body onload="main()"> 126 <body onload="main()">
107 <div style="position:relative; width:300px; height:300px; background-color:white "> 127 <div style="position:relative; width:300px; height:300px; background-color:white ">
108 </div> 128 </div>
109 <div id="container" style="position:absolute; top:0px; left:0px"> 129 <div id="container" style="position:absolute; top:0px; left:0px">
110 <canvas id="c" width="300" height="300" class="nomargin"></canvas> 130 <canvas id="c" width="300" height="300" class="nomargin"></canvas>
111 </div> 131 </div>
112 </body> 132 </body>
113 </html> 133 </html>
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698