| OLD | NEW | 
|---|
|  | (Empty) | 
| 1 description("Ensure correct behavior of canvas with path stroke using a strokeSt
     yle color with alpha 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 = 50; |  | 
| 39 |  | 
| 40 function strokePath(x, y) { |  | 
| 41     ctx.beginPath(); |  | 
| 42     ctx.arc(x, y, 75, 0, Math.PI*2, true); |  | 
| 43     ctx.stroke(); |  | 
| 44 } |  | 
| 45 |  | 
| 46 // Alpha shadow. |  | 
| 47 ctx.shadowBlur = 0; |  | 
| 48 strokePath(150, 150); |  | 
| 49 |  | 
| 50 // Blurry shadow. |  | 
| 51 ctx.shadowBlur = 10; |  | 
| 52 strokePath(150, 400); |  | 
| 53 |  | 
| 54 ctx.rotate(Math.PI/2); |  | 
| 55 |  | 
| 56 // Rotated alpha shadow. |  | 
| 57 ctx.shadowBlur = 0; |  | 
| 58 strokePath(650, -150); |  | 
| 59 |  | 
| 60 // Rotated blurry shadow. |  | 
| 61 ctx.shadowBlur = 10; |  | 
| 62 strokePath(900, -150); |  | 
| 63 |  | 
| 64 ctx.restore(); |  | 
| 65 |  | 
| 66 var imageData, data; |  | 
| 67 ctx.fillStyle = 'black'; |  | 
| 68 |  | 
| 69 function test(alphaTestFunction, x, y, r, g, b, a) { |  | 
| 70     // Get pixel. |  | 
| 71     imageData = ctx.getImageData(x, y, 1, 1); |  | 
| 72     data = imageData.data; |  | 
| 73     // Test pixel color components. |  | 
| 74     shouldBe('data[0]', r+''); |  | 
| 75     shouldBe('data[1]', g+''); |  | 
| 76     shouldBe('data[2]', b+''); |  | 
| 77     alphaTestFunction('data[3]', a+''); |  | 
| 78     // Plot test point. |  | 
| 79     ctx.fillRect(x, y, 3, 3); |  | 
| 80 } |  | 
| 81 |  | 
| 82 print('Verifying alpha shadow...'); |  | 
| 83 test(shouldBe, 400, 150, 0, 0, 0, 0); |  | 
| 84 test(shouldBeAround, 400, 75, 255,  0, 0, 64); |  | 
| 85 test(shouldBeAround, 400, 225, 255, 0, 0, 64); |  | 
| 86 test(shouldBeAround, 325, 150, 255, 0, 0, 64); |  | 
| 87 test(shouldBeAround, 475, 150, 255, 0, 0, 64); |  | 
| 88 |  | 
| 89 print(' '); |  | 
| 90 print('Verifying blurry shadow...'); |  | 
| 91 test(shouldBe, 400, 400, 0, 0, 0, 0); |  | 
| 92 test(shouldBeAround, 400, 300, 255, 0, 0, 31); |  | 
| 93 test(shouldBeAround, 400, 500, 255, 0, 0, 31); |  | 
| 94 test(shouldBeAround, 300, 400, 255, 0, 0, 31); |  | 
| 95 test(shouldBeAround, 500, 400, 255, 0, 0, 31); |  | 
| 96 |  | 
| 97 print(' '); |  | 
| 98 print('Verifying rotated alpha shadow...'); |  | 
| 99 test(shouldBe, 400, 650, 0, 0, 0, 0); |  | 
| 100 test(shouldBeAround, 400, 575, 255, 0, 0, 64); |  | 
| 101 test(shouldBeAround, 400, 725, 255, 0, 0, 64); |  | 
| 102 test(shouldBeAround, 325, 650, 255, 0, 0, 64); |  | 
| 103 test(shouldBeAround, 475, 650, 255, 0, 0, 64); |  | 
| 104 |  | 
| 105 print(' '); |  | 
| 106 print('Verifying rotated blurry shadow...'); |  | 
| 107 test(shouldBe, 400, 900, 0, 0, 0, 0); |  | 
| 108 test(shouldBeAround, 400, 800, 255, 0, 0, 31); |  | 
| 109 test(shouldBeAround, 400, 1000, 255, 0, 0, 31); |  | 
| 110 test(shouldBeAround, 300, 900, 255, 0, 0, 31); |  | 
| 111 test(shouldBeAround, 500, 900, 255, 0, 0, 31); |  | 
| 112 |  | 
| 113 print(' '); |  | 
| OLD | NEW | 
|---|