Snow

Snow.js

var Snow = (function() {
  var requestAnimationFrame =
      window.requestAnimationFrame ||
      window.webkitRequestAnimationFrame ||
      window.mozRequestAnimationFrame ||
      function(callback) {
        return setTimeout(function() {
          callback(performance.now());
        }, 16);
      };
  
  var performance = window.performance || {};
  performance.now =
      performance.now ||
      performance.webkitNow ||
      function() {
        return Date.now();
      };
  
  var Snow = {
    count: 0,
    canvas: null,
    ctx: null,
    dimensions: null,
    snowflakes: null,
    running: false,
    last_time: null
  };
  
  Snow.init = function(container) {
    Snow.container = container || document.body;
    Snow.canvas = document.createElement('canvas');
    Snow.ctx = (Snow.canvas.getContext && Snow.canvas.getContext('2d')) || undefined;
    
    if(!Snow.ctx) {
      console.log('2D Canvas not supported');
      return;
    }
    
    Snow.canvas.style.position = 'fixed';
    Snow.canvas.style.left = 0;
    Snow.canvas.style.top = 0;
    Snow.canvas.style['z-index'] = 1000;
    Snow.canvas.style['pointer-events'] = 'none';
    
    Snow.container.appendChild(Snow.canvas);
    
    window.addEventListener('resize', function() {
      Snow.reset();
    }, false);
    
    Snow.reset();
    Snow.running = true;
    Snow.last_time = performance.now();
    requestAnimationFrame(Snow.update);
  };
  Snow.remove = function() {
    if(!Snow.canvas)
        return;
    Snow.container.removeChild(Snow.canvas);
    Snow.canvas = null;
    Snow.ctx = null;
    Snow.running = false;
  };
  
  Snow.reset = function() {
    if(!Snow.canvas)
      return;
    
    Snow.dimensions = {
        width: Snow.container.clientWidth,
        height: Math.min(window.innerHeight, Snow.container.clientHeight)
//       width: window.innerWidth),
//       height: window.innerHeight
    };
    count = parseInt(Snow.dimensions.width / 4, 10);
    Snow.snowflakes = new Array(count);
    
    Snow.canvas.width = Snow.dimensions.width;
    Snow.canvas.height = Snow.dimensions.height;
  
    for(var i = 0; i < count; i++) {
      Snow.snowflakes[i] = new Snowflake(Snow.dimensions);
    }
  };
  
  Snow.update = function(time) {
    if(!Snow.running)
      return;
    
    time = time || performance.now();
    
    var elapsed = 0.016;// (time - last_time) / 1000.0;
    Snow.last_time = time;
    
    Snow.ctx.clearRect(0,0,Snow.dimensions.width,Snow.dimensions.height);
    
    for(var i = 0; i < count; i++) {
      Snow.snowflakes[i].update(elapsed);
      Snow.snowflakes[i].draw(Snow.ctx);
    }
    
    requestAnimationFrame(Snow.update);
  };
  
  
  function Snowflake(dimensions){
    this.containerWidth = dimensions.width;
    this.containerHeight = dimensions.height;
    this.reset();
    // Start with random y-value
    this.y = Math.random() * this.containerHeight;
  }
  Snowflake.TWOPIE = Math.PI * 2;
  Snowflake.prototype.reset = function() {
    this.x = Math.random() * this.containerWidth;
    this.y = -10;
    this.xVel = (Math.random() * 60) - 30;
    this.yVel = (Math.random() * 150) + 80;
    this.alpha = (Math.random() * 0.3) + 0.7;
    this.radius = (Math.random() * 3) + 1;
    var val = parseInt((Math.random() * (255-240)) + 240, 10);
    this.color = 'rgb('+val+','+val+','+val+')';
  };
  Snowflake.prototype.update = function(t) {
    this.x += this.xVel * t;
    this.y += this.yVel * t;
    if(this.y > this.containerHeight + 20)
      this.reset();
  };
  Snowflake.prototype.draw = function(ctx) {
    ctx.save();
  
    ctx.beginPath();
    ctx.globalAlpha = this.alpha;
    ctx.fillStyle = this.color;
    ctx.arc(this.x, this.y, this.radius, Snowflake.TWOPIE, 0, false);
    ctx.fill();
  
    ctx.restore();
  };
  
  return Snow;
}());


//Snow.init();