// Utility Functions
function getObj(id) {
    if (document.getElementById)
        var returnVar = document.getElementById(id);
    else if (document.all)
        var returnVar = document.all[id];
    else if (document.layers)
        var returnVar = document.layers[id];
    return returnVar;
}

// Code
var count=500;
var canvas;
var ctx;
var mouseX=0;
var mouseY=0;
var focal=200;
var dots=new Array();
var color=new Array();
var rotation=0;
var gradient;
function init() {
	canvas = getObj('drawTo');
	canvas.width = window.innerWidth;
	canvas.height = window.innerHeight;
	ctx = getObj('drawTo').getContext('2d');
	createDots();
	gradient = ctx.createLinearGradient(0,0,0,canvas.height);
	gradient.addColorStop(0,'#333333');
	gradient.addColorStop(1,'#000000');
	setInterval(draw, 33);
}
function move(e) {
	mouseX = e.clientX;
	mouseY = e.clientY;
}
function createDots() {
	for (var i=0; i<count; i++) {
		var x = Math.random()*canvas.width-canvas.width/2;
		var y = Math.random()*canvas.height-canvas.height/2;
		var z = Math.random()*1000;
		var angle = Math.random()*360;
		dots.push(new Array(x,y,z,angle));
		color.push(new Array(Math.round(Math.random()*255),Math.round(Math.random()*255),Math.round(Math.random()*255)));
	}
}
function draw() {
	rotation+=0.15*((mouseX-canvas.width/2)/canvas.width);
	ctx.translate(0,0);
	ctx.save();
	ctx.fillStyle = gradient;
	ctx.fillRect(0,0,canvas.width,canvas.height);
	var rad = rotation * (Math.PI/180);
	for (var i=0; i<dots.length; i++) {
		var radius = Math.sqrt(dots[i][0]*dots[i][0] + dots[i][2]*dots[i][2]);
		dots[i][0] = Math.cos(rotation+dots[i][3])*radius;
		dots[i][2] = Math.sin(rotation+dots[i][3])*radius;
		var scale = focal / (focal + dots[i][2] + 1000);
		var x = dots[i][0]*scale +canvas.width/2;
		var y = dots[i][1]*scale +canvas.height/2;
		if (x>0 && x < canvas.width && y>0 && y<canvas.height) 	{
			ctx.fillStyle = 'rgba('+color[i][0]+','+color[i][1]+','+color[i][2]+','+(Math.min(1,scale))+')';
			ctx.beginPath();
			ctx.arc(x, y, (10*scale), 0, Math.PI*2, true);
			ctx.closePath();
			ctx.fill();
		}
	}
	ctx.restore();
}
window.onload = init;
window.onmousemove = move;
