OLD | NEW |
1 <!DOCTYPE HTML> | 1 <!DOCTYPE HTML> |
2 <html> | 2 <html> |
3 <head> | 3 <head> |
4 <title>WebGL Test: Green Triangle over Black Background</title> | 4 <title>WebGL Test: Green Triangle over Black Background</title> |
5 <style type="text/css"> | 5 <style type="text/css"> |
6 .nomargin { | 6 .nomargin { |
7 margin: 0px auto; | 7 margin: 0px auto; |
8 } | 8 } |
9 </style> | 9 </style> |
10 | 10 |
11 <script id="shader-vs" type="x-shader/x-vertex"> | 11 <script id="shader-vs" type="x-shader/x-vertex"> |
12 attribute vec3 pos; | 12 attribute vec3 pos; |
13 void main(void) | 13 void main(void) |
14 { | 14 { |
15 gl_Position = vec4(pos, 1.0); | 15 gl_Position = vec4(pos, 1.0); |
16 } | 16 } |
17 </script> | 17 </script> |
18 | 18 |
19 <script id="shader-fs" type="x-shader/x-fragment"> | 19 <script id="shader-fs" type="x-shader/x-fragment"> |
20 precision mediump float; | 20 precision mediump float; |
21 void main(void) | 21 void main(void) |
22 { | 22 { |
23 gl_FragColor = vec4(0.0, 1.0, 0.0, 1.0); | 23 gl_FragColor = vec4(0.0, 1.0, 0.0, 1.0); |
24 } | 24 } |
25 </script> | 25 </script> |
26 | 26 |
27 <script> | 27 <script> |
28 var g_swapsBeforeAck = 15; | 28 var g_swapsBeforeAck = 15; |
29 var g_paintLoopStarted = false; | 29 var g_targetWidth, g_targetHeight; |
30 var gl; | 30 var gl; |
31 | 31 |
| 32 function onresized() |
| 33 { |
| 34 if (window.outerWidth != g_targetWidth || |
| 35 window.outerHeight != g_targetHeight) |
| 36 return; |
| 37 |
| 38 main(); |
| 39 } |
| 40 |
32 function main() | 41 function main() |
33 { | 42 { |
34 g_swapsBeforeAck = 15; | 43 var canvas = document.getElementById("c"); |
| 44 gl = initGL(canvas); |
| 45 if (gl && setup(gl)) { |
| 46 drawSomeFrames(); |
| 47 } else { |
| 48 domAutomationController.setAutomationId(1); |
| 49 domAutomationController.send("resized"); |
| 50 } |
35 | 51 |
36 if (!g_paintLoopStarted) { | |
37 g_paintLoopStarted = true; | |
38 var canvas = document.getElementById("c"); | |
39 gl = initGL(canvas); | |
40 if (gl && setup(gl)) | |
41 drawSomeFrames(); | |
42 } | |
43 } | 52 } |
44 | 53 |
45 function notifyLoadFinished() | 54 function notifyLoadFinished() |
46 { | 55 { |
47 domAutomationController.setAutomationId(1); | 56 domAutomationController.setAutomationId(1); |
48 domAutomationController.send("ok"); | 57 domAutomationController.send("ok"); |
49 } | 58 } |
50 | 59 |
51 function preCallResizeInChromium() | 60 function preCallResizeInChromium(targetWidth, targetHeight) |
52 { | 61 { |
53 window.onresize = main; | 62 g_targetWidth = targetWidth; |
| 63 g_targetHeight = targetHeight; |
| 64 window.onresize = onresized; |
54 // Call main() on a timeout in case the window did not resize for whatever | 65 // Call main() on a timeout in case the window did not resize for whatever |
55 // reason. | 66 // reason. |
56 setTimeout(main, 10000); | 67 setTimeout(main, 10000); |
57 } | 68 } |
58 | 69 |
59 function drawSomeFrames() | 70 function drawSomeFrames() |
60 { | 71 { |
61 if (g_swapsBeforeAck == 0) { | 72 if (g_swapsBeforeAck == 0) { |
62 domAutomationController.setAutomationId(1); | 73 domAutomationController.setAutomationId(1); |
63 domAutomationController.send("resized"); | 74 domAutomationController.send("resized"); |
(...skipping 80 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
144 } | 155 } |
145 </script> | 156 </script> |
146 </head> | 157 </head> |
147 <body onload="notifyLoadFinished()"> | 158 <body onload="notifyLoadFinished()"> |
148 <div style="position:relative; width:200px; height:200px; background-color:black
"></div> | 159 <div style="position:relative; width:200px; height:200px; background-color:black
"></div> |
149 <div style="position:absolute; top:0px; left:0px"> | 160 <div style="position:absolute; top:0px; left:0px"> |
150 <canvas id="c" width="200" height="200" class="nomargin"></canvas> | 161 <canvas id="c" width="200" height="200" class="nomargin"></canvas> |
151 </div> | 162 </div> |
152 </body> | 163 </body> |
153 </html> | 164 </html> |
OLD | NEW |