// globals

var maxBalls = 100;
var balls = [];
var WIDTH = 800;
var HEIGHT = 600;


// Lorenz shit
var dx = 10;
var dy = 10;
var dz = 10;
var xt = 1;
var	yt = 1;
var	zt = 1;
var	a = 10;
var	b = 28;
var	c = 8/3;	
var	dt = 0.01;

// ball class
function Ball(x, y, rad) {
	
	this.x = x;
	this.y = y;
	this.rad = rad;
	
	this.r = 255;
	this.g = 23;
	this.b = 0;
	this.a = 255;
	
	this.update = function() {
		this.a -= .25;
		this.rad -= .20;
		this.r -= 5;
		this.b += 5;
	}
}


// Begin
window.onload = function() {
	var p = Processing(document.getElementsByTagName("canvas")[0], document.getElementsByTagName("canvas")[0].previousSibling.textContent);
	
	p.setup = function() {
		this.size(WIDTH, HEIGHT);
		this.background(0);
	}
	
	p.draw = function() {
		// update lorenz
		dx = a * (yt - xt) * dt;
		dy = (xt * (b - zt) - yt) * dt;
		dz = (xt * yt -c * zt) * dt;
		xt += dx;
		yt += dy;
		zt += dz;
		
		// clear the canvas
		this.background(0);
		
		// in with a new ball - out with the old
		balls.push(new Ball(WIDTH / 60 * ( xt + 30), HEIGHT / 60 * (-zt + 60), zt * 1.5));
		if (balls.length > maxBalls) balls.shift();
		
		// draw on the canvas
		this.noStroke();
		var len = balls.length;
		for (i = 0; i < len; i++) {
			balls[i].update();
			this.fill(balls[i].r, balls[i].g, balls[i].b, balls[i].a);
			this.ellipse(balls[i].x, balls[i].y, balls[i].rad * 2, balls[i].rad * 2);
		}
	}
	
	p.init();
}