// 使用最优频率requestAnimationFrame代替定时器，当然如果浏览器如果不支持的话，还是使用定时器完成
window.rAF = (function(){    
  return window.requestAnimationFrame ||
             window.webkitRequestAnimationFrame ||
             window.mozRequestAnimationFrame ||
            window.oRequestAnimationFrame ||
            window.msRequestAnimationFrame ||
            function (callback) {                
              setTimeout(callback, 1000 / 60);            
            };
})();

// 默认配置
var defaultSetting = {
  width: 900, // canvas默认宽度，后面修改为频幕宽度
  height: 300, // canvas默认高度
  canvas: null, // canvas对象
  ctx: null, // 画布content
  snowArr: [], // 雪花数组
  total: 80  // 雪花数量
}

defaultSetting.width = window.innerWidth || document.documentElement.clientWidth ||  document.body.clientWidth;
defaultSetting.canvas = document.getElementById("canvas");
defaultSetting.canvas.setAttribute("width",defaultSetting.width);
defaultSetting.ctx = defaultSetting.canvas.getContext("2d");
for(var i = 0; i < defaultSetting.total;i  ){
    defaultSetting.snowArr.push({
        "left":Tools.createRandom(0, defaultSetting.width), // 工具函数createRandom是创建一个m上下n的随机数
        "top":Tools.createRandom(0, defaultSetting.height),
        "deg":Tools.createRandom(-6, 6),
        "scale":Tools.createRandom(3, 6)
    });
}

function updateSnow(){
    // 清除画布，重新绘制下一帧雪花的位置
    defaultSetting.ctx.clearRect(0, 0, defaultSetting.width, defaultSetting.height);
    defaultSetting.ctx.save();
    // 循环雪花数组，分别绘制每一个雪花的位置
    for(var i=0; i<defaultSetting.snowArr.length; i  ){
        var h = 0.5 * defaultSetting.snowArr[i].scale;
        defaultSetting.snowArr[i].left = defaultSetting.snowArr[i].left   Math.tan(Tools.radian(defaultSetting.snowArr[i].deg))*h/2;
        defaultSetting.snowArr[i].top = defaultSetting.snowArr[i].top   h;
        // 删除画面外的雪花
        if(defaultSetting.snowArr[i].left < 0 || defaultSetting.snowArr[i].left > defaultSetting.width || defaultSetting.snowArr[i].top > defaultSetting.height){
            defaultSetting.snowArr.splice(i--, 1);
            continue;
        }
        var width_i = defaultSetting.snowArr[i].scale;
        // 雪花边界投影
        var ra = defaultSetting.ctx.createRadialGradient(defaultSetting.snowArr[i].left, defaultSetting.snowArr[i].top, width_i/4, defaultSetting.snowArr[i].left, defaultSetting.snowArr[i].top, width_i);
        ra.addColorStop(0, "rgba(255,255,255,0.8)");
        ra.addColorStop(1, "rgba(255,255,255,0.1)");
        defaultSetting.ctx.fillStyle = ra;
        defaultSetting.ctx.beginPath();
        defaultSetting.ctx.arc(defaultSetting.snowArr[i].left, defaultSetting.snowArr[i].top, width_i, 0, 2*Math.PI);
        defaultSetting.ctx.fill();
    }
    defaultSetting.ctx.restore();
    // 持续刷新雪花的位置
    rAF(updateSnow);
}

// 增加新的雪花
function createNewSnow(){
    setTimeout(function(){
        if(defaultSetting.snowArr.length < 200){
            for(var i=0; i<20; i  ){
                defaultSetting.snowArr.push({
                    "left":Tools.createRandom(0, defaultSetting.width),
                    "top":0,
                    "deg":Tools.createRandom(-6, 6),
                    "scale":Tools.createRandom(3, 6)
                });
            }
        }
        createNewSnow();
    }, Math.random()*200 500);
}
createNewSnow();