|
1 <!-- Any copyright is dedicated to the Public Domain. |
|
2 http://creativecommons.org/publicdomain/zero/1.0/ --> |
|
3 <!doctype html> |
|
4 |
|
5 <html> |
|
6 <head> |
|
7 <meta charset="utf-8"/> |
|
8 <title>Canvas inspector test page</title> |
|
9 </head> |
|
10 |
|
11 <body> |
|
12 <canvas width="128" height="128"></canvas> |
|
13 |
|
14 <script type="text/javascript;version=1.8"> |
|
15 "use strict"; |
|
16 |
|
17 var ctx = document.querySelector("canvas").getContext("2d"); |
|
18 |
|
19 function drawRect(fill, size) { |
|
20 function A() { |
|
21 function B() { |
|
22 function C() { |
|
23 ctx.fillStyle = fill; |
|
24 ctx.fillRect(size[0], size[1], size[2], size[3]); |
|
25 } |
|
26 C(); |
|
27 } |
|
28 B(); |
|
29 } |
|
30 A(); |
|
31 } |
|
32 |
|
33 function drawScene() { |
|
34 ctx.clearRect(0, 0, 128, 128); |
|
35 drawRect("rgb(192, 192, 192)", [0, 0, 128, 128]); |
|
36 drawRect("rgba(0, 0, 192, 0.5)", [30, 30, 55, 50]); |
|
37 drawRect("rgba(192, 0, 0, 0.5)", [10, 10, 55, 50]); |
|
38 |
|
39 window.requestAnimationFrame(drawScene); |
|
40 } |
|
41 |
|
42 drawScene(); |
|
43 </script> |
|
44 </body> |
|
45 |
|
46 </html> |