Report abuse

SnowMaker Class


			
//script requires prototypejs.org
if (Object.isUndefined(TMC) || !TMC) { var TMC = {}; }
if (Object.isUndefined(TMC.widget) || !TMC.widget) { TMC.widget = {}; }

TMC.widget.Snow = Class.create({
  initialize: function(options) {
    this.options = {
      flakes: 35, // number of snowflakes (more than 30 - 40 not recommended)
      color: ['#aaaacc','#ddddFF','#ccccDD'], // colors for the snow. Add as many colors as you like
      font: ['Arial Black','Arial Narrow','Times','Comic Sans MS'], // fonts that create the snowflakes. Add as many fonts as you like
      text: '*', // letter that creates your snowflake (recommended:*)
      speed: 0.6, // speed of sinking (recommended values range from 0.3 to 2)
      size: { // minimum & maximun size of the snowflake
        max: 22,
        min: 8
      }
    };
    Object.extend(this.options, options || {});
    this.container = new Element('div');
    this.elements = [];
    for (var i = 0; i <= this.options.flakes; i++) {
      this.elements[i] = new Element('span').update(this.options.text);
      this.elements[i].size = (this.randomer((this.options.size.max - this.options.size.min)) + this.options.size.min)
      Object.extend(this.elements[i],{
        cords: 0,
        across: (Math.random() * 15),
        horizontal: (0.03 + Math.random()/10),
        sink:(this.options.speed * this.elements[i].size / 5)
      }).setStyle({
        position: 'absolute',
        top: this.options.size.max + 'px',
        fontFamily: this.options.font[this.randomer(this.options.font.length)],
        fontSize: this.elements[i].size,
        color: this.options.color[this.randomer(this.options.color.length)]
      });
      this.container.appendChild(this.elements[i]);
    }
    document.observe('dom:loaded',this.onDomLoad.bindAsEventListener(this));
  },
  onDomLoad: function() {
    var viewport = document.viewport.getDimensions();
    (document.getElementsByTagName('body')[0]).appendChild(this.container);
    this.elements.each(function(item){
      Object.extend(item,{
        posx: (this.randomer(viewport.width - item.size)),
        posy: (this.randomer(2 * viewport.height - viewport.height - 2 * item.size))
      }).setStyle({
        left: item.posx + 'px',
        top: item.posy + 'px'
      });
    }, this);
    this.start();
  },
  move: function() {
    var viewport = document.viewport.getDimensions();
    this.elements.each(function(item){
      item.cords += item.horizontal;
      item.posy += item.sink;
      item.setStyle({
        top: item.posy + 'px',
        left: (item.posx + item.across * Math.sin(item.cords)) + 'px'
      });
      if (item.posy >= viewport.height - 2 * item.size || parseInt(item.getStyle('left')) > (viewport.width - 3 * item.across)){
        item.posx = this.randomer(viewport.width - item.size);
        item.posy = 0;
      }
    }, this);
  },
  randomer: function(range) {
    return Math.floor(range * Math.random());
  },
  start: function(){
    this.timer = setInterval(this.move.bind(this), 50);
  },
  stop: function() {
    clearInterval(this.timer);
    this.timer = null;
  },
  hide: function() {
    this.container.hide();
  },
  show: function() {
    this.container.show();
  }
});

Instantiation


			
var snow = new TMC.widget.Snow();

//for options look into that the classes options and supply as the only argument
new TMC.widget.Snow({
  flakes: 39,
  speed: 0.8,
  font: ['Arial Black',Comic Sans MS']
});

Utility Methods


			
snow.stop();
snow.start();
snow.hide();
snow.show();