<canvas id="cnv"></canvas>
<input type="button" value="reset" id="reset" />

html,body{
	padding: 0;
	margin: 0;
	height: 100%;
	width: 100%;
	background: url(http://www.hdwallpapersplus.com/wp-content/uploads/2012/10/cool-black-background3.jpg);
	overflow: hidden;
}
#cnv{
	overflow: hidden;
}
#reset{
	position: absolute;
	right: 0;
	top: 0;
}

var cnv = document.getElementById('cnv');
var context = cnv.getContext('2d');
cnv.width  = window.innerWidth;
cnv.height = window.innerHeight;

var atoms = [];
var natoms = 250;
var atomspeed = 1.7;
function atom(x,y,rx,ry){
	this.x = x;
	this.y = y;
	this.sx = 0;
	this.sy = 0;
	this.rx = rx;
	this.ry = ry;
	this.color = {r:0,g:0,b:0};
	this.draw = function(context){
		context.beginPath();
		context.fillStyle="rgba("+this.color.r+","+this.color.g+","+this.color.b+",0.45)";
		context.arc(this.x+3,this.y+3,this.rx,0,2*Math.PI);
		context.fill();
	}
}

function update(){
    for (var i = 0; i < natoms; i++) {
		atoms[i].x+=atoms[i].sx;
		atoms[i].y+=atoms[i].sy;
		if(atoms[i].x>cnv.width) 
			atoms[i].x=0;
		else if(atoms[i].x<0) 
			atoms[i].x=cnv.width;
		if(atoms[i].y>cnv.height) 
			atoms[i].y=0;
		else if(atoms[i].y<0) //never happens but check anyway
			atoms[i].y=cnv.height;
    };
}

function render(){
var oldArray = context.getImageData(0,0,cnv.width,cnv.height);
for(var d=3;d<oldArray.data.length;d+=4){
    oldArray.data[d] = Math.floor(oldArray.data[d]*.6);
}
context.putImageData(oldArray,0,0);
    for (var i = 0; i < natoms; i++) {
    	atoms[i].draw(context);
    };
}

function loop(){
	update();
	render();
	requestAnimationFrame(loop, cnv);
};

function initialize(){
	for (var i = 0; i < natoms; i++) {
		var t = new atom(Math.random()*cnv.width,Math.random()*cnv.height,1+Math.random()*5,1+Math.random()*5);
		t.sx = Math.random()*atomspeed*2-atomspeed;
		t.sy = Math.random()*atomspeed+atomspeed;
		t.color = {r:parseInt(Math.random()*70+120),
					g:parseInt(Math.random()*70+120),
					b:parseInt(Math.random()*70+120)}
		atoms[i]=t;
	};
}
document.getElementById("reset").onclick = function(){
	initialize();
}

function main(){
	initialize();
	loop();
}

main();