##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();