/* Copyright 2011 The Dominion of Awesome
 * See COPYING for licensing information */
enyo.kind({
	name: "Orbit",
	kind: "Hack",
	pack: "center",
	align: "center",
	style: "background-color: lightgray",
	components: [
		{kind: "Control", nodeTag: "canvas", name: "canvas", width: "700px", height: "700px"}
	],
	rendered: function() {
		var canvas = this.$.canvas.hasNode();
		canvas.width = 700;
		canvas.height = 700;
		this.context = canvas.getContext('2d');
		this.context.fillStyle = 'lightgray';

		this.center_x = canvas.width / 2;
		this.center_y = canvas.height / 2;
		this.radius = 250;
		this.zr = 0;
		this.xr = 0;

		this.chromeball = new Image();
		this.chromeball.onload = this.setReady.bind(this);
		this.chromeball.src = "hacks/Orbit/chrome_ball.png";
	},
	setReady: function() {
		this.ready = true;
		this.engine();
	},
	start: function() {
		if (this.ready && !this.timer)
			this.timer = setInterval(this.engine.bind(this), 20);
	},
	stop: function() {
		clearInterval(this.timer);
		this.timer = null;
	},
	engine: function() {
		this.context.fillRect(0, 0, 700, 700);
		this.zr += 0.1;
		this.xr += 0.05;
		var objects = [];
		for (var i = 0; i < 8; i++) {
			var czr = this.zr + i * Math.PI/4;
			var cxr = this.xr + Math.PI + i * Math.PI/4;
			var cx = this.center_x + this.radius * Math.sin(czr);
			var cy = this.center_y + this.radius * Math.cos(czr) * Math.cos(this.xr);
			var r = 50 + 25 * Math.cos(czr) * Math.cos(this.xr + Math.PI/2);

			objects.push({
				x: cx - r,
				y: cy - r,
				s: r * 2
			});
		}
		// Sort by size to simulate z-ordering
		objects.sort(function(a,b) {
			return a.s - b.s;
		});
		for (var i = 0; i < 8; i++)
			this.context.drawImage(this.chromeball, objects[i].x, objects[i].y, objects[i].s, objects[i].s);
	}
});