OLD | NEW |
| (Empty) |
1 description("Ensure correct behavior of canvas with strokeRect using a semi-tran
sparent solid strokeStyle and a shadow"); | |
2 | |
3 function print(message, color) | |
4 { | |
5 var paragraph = document.createElement("div"); | |
6 paragraph.appendChild(document.createTextNode(message)); | |
7 paragraph.style.fontFamily = "monospace"; | |
8 if (color) | |
9 paragraph.style.color = color; | |
10 document.getElementById("console").appendChild(paragraph); | |
11 } | |
12 | |
13 function shouldBeAround(a, b) | |
14 { | |
15 var evalA; | |
16 try { | |
17 evalA = eval(a); | |
18 } catch(e) { | |
19 evalA = e; | |
20 } | |
21 | |
22 if (Math.abs(evalA - b) < 15) | |
23 print("PASS " + a + " is around " + b , "green") | |
24 else | |
25 print("FAIL " + a + " is not around " + b + " (actual: " + evalA + ")",
"red"); | |
26 } | |
27 | |
28 var canvas = document.createElement('canvas'); | |
29 document.body.appendChild(canvas); | |
30 canvas.setAttribute('width', '600'); | |
31 canvas.setAttribute('height', '1100'); | |
32 var ctx = canvas.getContext('2d'); | |
33 | |
34 ctx.save(); | |
35 ctx.strokeStyle = 'rgba(0, 0, 255, 0.5)'; | |
36 ctx.shadowColor = 'rgba(255, 0, 0, 0.5)'; | |
37 ctx.shadowOffsetX = 250; | |
38 ctx.lineWidth = 25; | |
39 | |
40 var side = 200; | |
41 | |
42 // Alpha shadow. | |
43 ctx.shadowBlur = 0; | |
44 ctx.strokeRect(50, 50, side, side); | |
45 | |
46 // Blurry shadow. | |
47 ctx.shadowBlur = 10; | |
48 ctx.strokeRect(50, 300, side, side); | |
49 | |
50 ctx.rotate(Math.PI / 2); | |
51 | |
52 // Rotated alpha shadow. | |
53 ctx.shadowBlur = 0; | |
54 ctx.strokeRect(550, -250, side, side); | |
55 | |
56 // Rotated blurry shadow. | |
57 ctx.shadowBlur = 10; | |
58 ctx.strokeRect(800, -250, side, side); | |
59 | |
60 ctx.restore(); | |
61 | |
62 var imageData, data; | |
63 ctx.fillStyle = 'black'; | |
64 | |
65 function test(alphaTestFunction, x, y, r, g, b, a) { | |
66 // Get pixel. | |
67 imageData = ctx.getImageData(x, y, 1, 1); | |
68 data = imageData.data; | |
69 // Test pixel color components. | |
70 shouldBe('data[0]', r+''); | |
71 shouldBe('data[1]', g+''); | |
72 shouldBe('data[2]', b+''); | |
73 alphaTestFunction('data[3]', a+''); | |
74 // Plot test point. | |
75 ctx.fillRect(x, y, 3, 3); | |
76 } | |
77 | |
78 print('Verifying alpha shadow...'); | |
79 test(shouldBe, 400, 150, 0, 0, 0, 0); | |
80 | |
81 test(shouldBe, 400, 75, 0, 0, 0, 0); | |
82 test(shouldBe, 400, 225, 0, 0, 0, 0); | |
83 test(shouldBe, 325, 150, 0, 0, 0, 0); | |
84 test(shouldBe, 475, 150, 0, 0, 0, 0); | |
85 | |
86 test(shouldBeAround, 400, 50, 255, 0, 0, 64); | |
87 test(shouldBeAround, 500, 150, 255, 0, 0, 64); | |
88 test(shouldBeAround, 400, 250, 255, 0, 0, 64); | |
89 test(shouldBeAround, 300, 150, 255, 0, 0, 64); | |
90 | |
91 test(shouldBe, 400, 25, 0, 0, 0, 0); | |
92 test(shouldBe, 525, 150, 0, 0, 0, 0); | |
93 test(shouldBe, 400, 275, 0, 0, 0, 0); | |
94 test(shouldBe, 275, 150, 0, 0, 0, 0); | |
95 | |
96 print(' '); | |
97 print('Verifying blurry shadow...'); | |
98 test(shouldBe, 400, 400, 0, 0, 0, 0); | |
99 | |
100 test(shouldBe, 400, 325, 0, 0, 0, 0); | |
101 test(shouldBe, 475, 400, 0, 0, 0, 0); | |
102 test(shouldBe, 400, 475, 0, 0, 0, 0); | |
103 test(shouldBe, 325, 400, 0, 0, 0, 0); | |
104 | |
105 test(shouldBeAround, 400, 300, 255, 0, 0, 64); | |
106 test(shouldBeAround, 400, 500, 255, 0, 0, 64); | |
107 test(shouldBeAround, 300, 400, 255, 0, 0, 64); | |
108 test(shouldBeAround, 500, 400, 255, 0, 0, 64); | |
109 | |
110 test(shouldBe, 525, 400, 0, 0, 0, 0); | |
111 test(shouldBe, 275, 400, 0, 0, 0, 0); | |
112 | |
113 print(' '); | |
114 print('Verifying rotated alpha shadow...'); | |
115 test(shouldBe, 400, 650, 0, 0, 0, 0); | |
116 | |
117 test(shouldBe, 400, 575, 0, 0, 0, 0); | |
118 test(shouldBe, 400, 725, 0, 0, 0, 0); | |
119 test(shouldBe, 325, 650, 0, 0, 0, 0); | |
120 test(shouldBe, 475, 650, 0, 0, 0, 0); | |
121 | |
122 test(shouldBeAround, 400, 550, 255, 0, 0, 64); | |
123 test(shouldBeAround, 500, 650, 255, 0, 0, 64); | |
124 test(shouldBeAround, 400, 750, 255, 0, 0, 64); | |
125 test(shouldBeAround, 300, 650, 255, 0, 0, 64); | |
126 | |
127 test(shouldBe, 400, 525, 0, 0, 0, 0); | |
128 test(shouldBe, 525, 650, 0, 0, 0, 0); | |
129 test(shouldBe, 400, 775, 0, 0, 0, 0); | |
130 test(shouldBe, 275, 650, 0, 0, 0, 0); | |
131 | |
132 print(' '); | |
133 print('Verifying rotated blurry shadow...'); | |
134 test(shouldBe, 400, 900, 0, 0, 0, 0); | |
135 | |
136 test(shouldBe, 400, 825, 0, 0, 0, 0); | |
137 test(shouldBe, 475, 900, 0, 0, 0, 0); | |
138 test(shouldBe, 400, 975, 0, 0, 0, 0); | |
139 test(shouldBe, 325, 900, 0, 0, 0, 0); | |
140 | |
141 test(shouldBeAround, 400, 800, 255, 0, 0, 64); | |
142 test(shouldBeAround, 400, 1000, 255, 0, 0, 64); | |
143 test(shouldBeAround, 300, 900, 255, 0, 0, 64); | |
144 test(shouldBeAround, 500, 900, 255, 0, 0, 64); | |
145 | |
146 test(shouldBe, 525, 900, 0, 0, 0, 0); | |
147 test(shouldBe, 275, 900, 0, 0, 0, 0); | |
148 test(shouldBe, 400, 1025, 0, 0, 0, 0); | |
149 | |
150 print(' '); | |
OLD | NEW |