/hacks/Nimbus/Nimbus.js
/* Copyright 2011 The Dominion of Awesome
 * See COPYING for licensing information */
enyo.kind({
	name: "Drop",
	constructor: function() {
		this.live = false;
	},
	start: function(w, h, perspective) {
		this.x = Math.random() * w;
		this.y = (Math.random() * h) / perspective;
		this.t = (new Date()).getTime();
		this.live = true;
	},
	draw: function(ctx, t) {
		var dt = t - this.t;
		if (dt < 100) {
			ctx.save();
			ctx.globalAlpha = 0.25;
			ctx.beginPath();
			ctx.moveTo(this.x, 0);
			ctx.lineTo(this.x, this.y);
			ctx.stroke();
			ctx.restore();
		} else if (dt < 750) {
			ctx.save();
			ctx.globalAlpha = (1.0 - ((dt - 500) / 250));
			ctx.beginPath();
			ctx.arc(this.x, this.y, Math.sqrt(dt) * 5, 0, 2 * Math.PI, false);
			ctx.stroke();
			ctx.restore();
		} else {
			this.live = false;
		}
	}
});

enyo.kind({
	name: "Nimbus",
	kind: "Hack",
	style: "background-color: white",
	drop_c: 0,
	drops: [],
	perspective: 0.3,
	preferences: [
		{name: "intensity", label: "Intensity", kind: "Slider", maximum: 1, minimum: 0, snap: 0.01},
		{name: "rainColor", label: "Rain Color", kind: "ListSelector", items: colorList},
		{name: "backgroundColor", label: "Background Color", kind: "ListSelector", items: [
			{caption: "white", value: 'rgba(255,255,255,0.7)'},
			{caption: "gray", value: 'rgba(128,128,128,0.7)'},
			{caption: "black", value: 'rgba(0,0,0,0.7)'}
		]}
	],
	intensity: 0.7,
	rainColor: 'gray',
	backgroundColor: 'rgba(255,255,255,0.7)',
	components: [
		{name: "raindrops", nodeTag: "canvas"}
	],
	rendered: function() {
		this.raindrops = this.$.raindrops.hasNode();
		this.ctx = this.raindrops.getContext('2d');
		this.resize(window.innerWidth, window.innerHeight);

		for (var i = 0; i < 100; i++)
			this.drops.push(new Drop());
	},
	start: function() {
		if (!this.timer)
			this.timer = setInterval(this.draw.bind(this), 50);
	},
	stop: function() {
		clearInterval(this.timer);
		this.timer = null;
	},
	resize: function(w, h) {
		this.raindrops.width = this.w = w;
		this.raindrops.height = this.h = h;

		this.ctx.fillStyle = this.backgroundColor;
		this.ctx.strokeStyle = this.rainColor;
		this.ctx.lineWidth = '2';
	},
	preferencesChanged: function() {
		this.ctx.fillStyle = this.backgroundColor;
		this.ctx.strokeStyle = this.rainColor;
	},
	draw: function() {
		if (Math.random() <= this.intensity) {
			this.drops[this.drop_c].start(this.w, this.h, this.perspective);
			this.drop_c = (this.drop_c + 1) % 100;
		}
		var now = (new Date()).getTime();
		this.ctx.fillRect(0, 0, this.w, this.h);
		this.ctx.save();
		this.ctx.scale(1.0, this.perspective);
		for (var i = 0; i < this.drops.length; i++)
			if (this.drops[i].live)
				this.drops[i].draw(this.ctx, now);
		this.ctx.restore();
	}
});