1 var IS_SKV8 = typeof document == "undefined"; 2 var HAS_PATH = typeof Path2D != "undefined"; 3 4 function circlePath(r) { 5 if (HAS_PATH) { 6 var p = new Path2D(); 7 p.arc(0, 0, r, 0, 2*Math.PI); 8 p.closePath(); 9 return p; 10 } else { 11 return null; 12 } 13 } 14 15 var onDraw = function() { 16 var W = 500; 17 var H = 500; 18 var NumParticles = 100; 19 20 var angle = 0; 21 var ticks = 0; 22 var particles =[]; 23 24 for (var i = 0; i < NumParticles; i++) { 25 particles[i] = { 26 x: Math.floor(Math.random()*W), 27 y: Math.floor(Math.random()*H), 28 r: Math.floor(Math.random()*7+1), 29 path: circlePath(Math.random()*7+1), 30 } 31 } 32 33 function draw(ctx) { 34 ctx.fillStyle = "#ADD8E6"; 35 ctx.fillRect(0, 0, W-1, H-1); 36 ctx.fillStyle = "#FFFFFF"; 37 38 angle += 0.0039; 39 for (var i = 0; i < particles.length; i++) { 40 var p = particles[i]; 41 p.x += Math.floor(Math.sin(angle)*5.0); 42 p.y += 0.6*p.r; 43 if (p.x > W) { 44 p.x-=W; 45 } 46 if (p.x < 0) { 47 p.x += W; 48 } 49 if(p.y>(H+1)){ 50 p.y = 0; 51 } 52 if (HAS_PATH) { 53 ctx.save(); 54 ctx.translate(p.x, p.y); 55 ctx.fill(p.path); 56 ctx.restore(); 57 } else { 58 ctx.beginPath(); 59 ctx.moveTo(p.x, p.y); 60 ctx.arc(p.x, p.y, p.r, 0, 2*Math.PI, true); 61 ctx.closePath(); 62 ctx.fill(); 63 } 64 }; 65 66 ticks++; 67 if (IS_SKV8) { 68 inval(); 69 } 70 } 71 72 function fps() { 73 console.log(ticks); 74 ticks = 0; 75 setTimeout(fps, 1000); 76 } 77 78 setTimeout(fps, 1000); 79 80 return draw; 81 }(); 82 83 if (!IS_SKV8) { 84 window.onload = function(){ 85 var canvas = document.getElementById("snow"); 86 var ctx = canvas.getContext("2d"); 87 function drawCallback() { 88 onDraw(ctx); 89 setTimeout(drawCallback, 1); 90 } 91 setTimeout(drawCallback, 1); 92 } 93 } 94 95 console.log("HAS_PATH: " + HAS_PATH); 96
