JS1k: The JavaScript code golfing competition

var c=document,i=Math,k=i.PI; function n(u,a,q,l,r,s){var t=[["#255255","#FFFFFF"],["#6d140d","#FFFFFF"],["#0d6c6d","#FFFFFF"],["#6d0d48","#FFFFFF"]],e=0,j=0;this.f=function(){j++;for(var f=0;f<l;f++){var b=f*(k/180)*(!e||s==2?j:e);if(e&&s==1)b+=k/180*j;else if(b==2*k/l*(l-1))e=j;var g=q.y+a.y*i.sin(b*r),m=u;b=q.x+a.x*i.cos(b*r);g=g;var v=t[f%4][1],x=t[f%4][0],d=m.createRadialGradient(b-2,g-2,0.5,b,g,10);d.c=d.addColorStop;d.c(0,v);d.c(0.9,x);d.c(1,"rgba(0,0,0,0)");m.fillStyle=d;m.fillRect(b-10,g-10,20,20)}if(e){if(a.x<=-a.d|| a.x>a.d)a.a=-a.a;if(a.y<=-a.e||a.y>a.e)a.b=-a.b;a.x+=1*a.a;a.y+=1*a.b}}}c.body.setAttribute("style","width:100%;height:100%;overflow:hidden;background:black;");var o=($c=c.getElementById("c")).getContext("2d");$c.width=w=innerWidth;$c.height=h=innerHeight;var p=i.min(w,h)/2-15,y=new n(o,{x:p-100,y:p-100,d:p,e:p,a:1,b:1},{x:w/2,y:h/2},10,1,1),z=new n(o,{x:p,y:p,d:p,e:p,a:1,b:1},{x:w/2,y:h/2},10,-1,2);setInterval(function(){o.clearRect(0,0,$c.width,$c.height);y.f();z.f()},30);

dmFyIGM9ZG9jdW1lbnQsaT1NYXRoLGs9aS5QSTsgZnVuY3Rpb24gbih1LGEscSxsLHIscyl7dmFyIHQ9W1siIzI1NTI1NSIsIiNGRkZGRkYiXSxbIiM2ZDE0MGQiLCIjRkZGRkZGIl0sWyIjMGQ2YzZkIiwiI0ZGRkZGRiJdLFsiIzZkMGQ0OCIsIiNGRkZGRkYiXV0sZT0wLGo9MDt0aGlzLmY9ZnVuY3Rpb24oKXtqKys7Zm9yKHZhciBmPTA7ZjxsO2YrKyl7dmFyIGI9Ziooay8xODApKighZXx8cz09Mj9qOmUpO2lmKGUmJnM9PTEpYis9ay8xODAqajtlbHNlIGlmKGI9PTIqay9sKihsLTEpKWU9ajt2YXIgZz1xLnkrYS55Kmkuc2luKGIqciksbT11O2I9cS54K2EueCppLmNvcyhiKnIpO2c9Zzt2YXIgdj10W2YlNF1bMV0seD10W2YlNF1bMF0sZD1tLmNyZWF0ZVJhZGlhbEdyYWRpZW50KGItMixnLTIsMC41LGIsZywxMCk7ZC5jPWQuYWRkQ29sb3JTdG9wO2QuYygwLHYpO2QuYygwLjkseCk7ZC5jKDEsInJnYmEoMCwwLDAsMCkiKTttLmZpbGxTdHlsZT1kO20uZmlsbFJlY3QoYi0xMCxnLTEwLDIwLDIwKX1pZihlKXtpZihhLng8PS1hLmR8fCBhLng+YS5kKWEuYT0tYS5hO2lmKGEueTw9LWEuZXx8YS55PmEuZSlhLmI9LWEuYjthLngrPTEqYS5hO2EueSs9MSphLmJ9fX1jLmJvZHkuc2V0QXR0cmlidXRlKCJzdHlsZSIsIndpZHRoOjEwMCU7aGVpZ2h0OjEwMCU7b3ZlcmZsb3c6aGlkZGVuO2JhY2tncm91bmQ6YmxhY2s7Iik7dmFyIG89KCRjPWMuZ2V0RWxlbWVudEJ5SWQoImMiKSkuZ2V0Q29udGV4dCgiMmQiKTskYy53aWR0aD13PWlubmVyV2lkdGg7JGMuaGVpZ2h0PWg9aW5uZXJIZWlnaHQ7dmFyIHA9aS5taW4odyxoKS8yLTE1LHk9bmV3IG4obyx7eDpwLTEwMCx5OnAtMTAwLGQ6cCxlOnAsYToxLGI6MX0se3g6dy8yLHk6aC8yfSwxMCwxLDEpLHo9bmV3IG4obyx7eDpwLHk6cCxkOnAsZTpwLGE6MSxiOjF9LHt4OncvMix5OmgvMn0sMTAsLTEsMik7c2V0SW50ZXJ2YWwoZnVuY3Rpb24oKXtvLmNsZWFyUmVjdCgwLDAsJGMud2lkdGgsJGMuaGVpZ2h0KTt5LmYoKTt6LmYoKX0sMzApOw==

var $=document,m=Math,pi=m.PI;

function drawBall(ctx, x, y, c1, c2){
	var fs=ctx.createRadialGradient(x-2, y-2, .5, x, y, 10);
	fs.a=fs.addColorStop;
	fs.a(0, c1);
	fs.a(0.9, c2);
	fs.a(1, 'rgba(0,0,0,0)');

	ctx.fillStyle=fs;
	ctx.fillRect(x-10, y-10, 20, 20);
}

/**
 * @constructor 
 *
 */
function Circle(ctx, radius, center, numBalls, dir, type){
	var grads=[
		['#255255', '#FFFFFF'],
		['#6d140d', '#FFFFFF'],
		['#0d6c6d', '#FFFFFF'],
		['#6d0d48', '#FFFFFF']
	];

	var evenCount=0;
	var loopNumber=0;
	this.nextFrame=function(){
		loopNumber++;
		for (var i=0; i<numBalls; i++){	
			var d = i*(pi/180)*(!evenCount || type==2?loopNumber:evenCount);
			if (evenCount && type==1){
				d+=pi/180*loopNumber;
			}
			else if (d==(2*pi/numBalls)*(numBalls-1)){
				evenCount = loopNumber;
			}

			var y=center.y+radius.y*m.sin(d*dir);
			var x=center.x+radius.x*m.cos(d*dir);
			drawBall(ctx, x, y, grads[i%4][1], grads[i%4][0]);
		}

		if (evenCount)
		{
			if (radius.x <= -radius.mx || radius.x > radius.mx){
				radius.dx = -radius.dx;
			}
			if (radius.y <= -radius.my || radius.y > radius.my){
				radius.dy = -radius.dy;
			}

			radius.x += 1 * radius.dx; radius.y += 1 * radius.dy;			
		}
	};
}


$.body.setAttribute('style', 'width:100%;height:100%;overflow:hidden;background:black;');
var $2d = ($c=$.getElementById('c')).getContext('2d');
$c.width=w=innerWidth;
$c.height=h=innerHeight;
var radiusMax=m.min(w, h)/2-15;
var c1=new Circle($2d, {x: radiusMax-100, y: radiusMax-100, mx: radiusMax, my: radiusMax, dx: 1, dy: 1}, {x: w/2, y: h/2}, 10,  1, 1);
var c2=new Circle($2d, {x: radiusMax, y: radiusMax, mx: radiusMax, my: radiusMax, dx: 1, dy: 1}, {x: w/2, y: h/2}, 10, -1, 2);
setInterval(function(){ 
	$2d.clearRect(0, 0, $c.width, $c.height); 
	c1.nextFrame(); 
	c2.nextFrame(); 
}, 30);