1 /* Copyright 2011 The Dominion of Awesome
2 * See COPYING for licensing information */
8 style: "background-color: lightgray",
10 {kind: "Control", nodeTag: "canvas", name: "canvas", width: "250px", height: "250px"}
12 rendered: function() {
13 var canvas = this.$.canvas.hasNode();
16 this.context = canvas.getContext('2d');
18 this.center_x = canvas.width / 2;
19 this.center_y = canvas.height / 2;
24 this.chromeball = new Image();
25 this.chromeball.onload = this.setReady.bind(this);
26 this.chromeball.src = "hacks/orbit/chrome_ball.png";
28 setReady: function() {
33 if (this.ready && !this.timer)
34 this.timer = setInterval(this.engine.bind(this), 20);
37 clearInterval(this.timer);
41 this.context.clearRect(this.center_x - this.radius - 25, this.center_y - this.radius - 25, this.radius * 2 + 50, this.radius * 2 + 50);
45 for (var i = 0; i < 8; i++) {
46 var czr = this.zr + i * Math.PI/4;
47 var cxr = this.xr + Math.PI + i * Math.PI/4;
48 var cx = this.center_x + this.radius * Math.sin(czr);
49 var cy = this.center_y + this.radius * Math.cos(czr) * Math.cos(this.xr);
50 var r = 20 + 10 * Math.cos(czr) * Math.cos(this.xr + Math.PI/2);
58 // Sort by size to simulate z-ordering
59 objects.sort(function(a,b) {
62 for (var i = 0; i < 8; i++)
63 this.context.drawImage(this.chromeball, objects[i].x, objects[i].y, objects[i].s, objects[i].s);