1 $(document
).ready(function(){
3 var canvas
= document
.getElementById('canvas')
4 var c
= canvas
.getContext('2d');
9 var cellWidth
= canvas
.width
/ rows
;
10 var cellHeight
= canvas
.height
/ columns
;
12 function cell(x
, y
, h
, l
) {
18 this.kill = function() {
19 c
.fillStyle
= "rgb(255,255,255)";
20 c
.fillRect(this.x
, this.y
, this.h
, this.l
);
23 this.revive = function() {
24 c
.fillStyle
= "rgb(0,0,0)";
25 c
.fillRect(this.x
, this.y
, this.h
, this.l
);
28 this.redraw = function() {
29 c
.fillStyle
= this.state
== 1 ? "rgb(0,0,0)" : "rgb(255,255,255)";
30 c
.fillRect(this.x
, this.y
, this.h
, this.l
);
32 this.highlight = function() {
33 c
.fillStyle
= "rgb(0,0,100)";
34 c
.fillRect(this.x
, this.y
, this.h
, this.l
);
42 for (var i
= 0; i
< rows
; i
++) {
45 var y
= i
* cellHeight
;
46 for (var ii
= 0; ii
< columns
; ii
++) {
47 world
.push(new cell(x
, y
, cellWidth
, cellHeight
));
49 Math
.random() > .5 ? world
[ii
].revive() : world
[ii
].kill();
51 this.population
.push(world
);
54 this.print = function() {
55 for (var i
= 0; i
< rows
; i
++) {
57 for (var ii
= 0; ii
< columns
; ii
++) {
58 s
+= this.population
[i
][ii
];
63 this.highlight = function() {
64 for (var i
= 0; i
< rows
; i
++) {
65 for (var ii
= 0; ii
< columns
; ii
++) {
66 if (this.population
[i
][ii
].state
== 1) {
67 this.population
[i
][ii
].highlight();
73 this.redraw = function() {
74 for (var i
= 0; i
< rows
; i
++) {
75 for (var ii
= 0; ii
< columns
; ii
++) {
76 if (this.population
[i
][ii
].state
== 1) {
77 this.population
[i
][ii
].redraw();
84 function tick(automaton
) {
85 automaton
.generation
+= 1;
86 var universe
= automaton
.population
;
88 for (var i
= 0; i
< universe
.length
; i
++) {
90 for (var ii
= 0; ii
< universe
[i
].length
; ii
++) {
91 var neighbors
= (universe
[i
][ii
+1] ? universe
[i
][ii
+1].state
: 0) +
92 (universe
[i
][ii
-1] ? universe
[i
][ii
-1].state
: 0) +
94 (universe
[i
+1][ii
] ? universe
[i
+1][ii
].state
: 0) +
95 (universe
[i
+1][ii
+1] ? universe
[i
+1][ii
+1].state
: 0) +
96 (universe
[i
+1][ii
-1] ? universe
[i
+1][ii
-1].state
: 0)
99 (universe
[i
-1][ii
] ? universe
[i
-1][ii
].state
: 0) +
100 (universe
[i
-1][ii
-1] ? universe
[i
-1][ii
-1].state
: 0) +
101 (universe
[i
-1][ii
+1] ? universe
[i
-1][ii
+1].state
: 0)
103 universe
[i
][ii
].neighbors
= neighbors
;
104 if (universe
[i
][ii
].state
== 1) {
105 if (neighbors
< 2 || neighbors
> 3) {
106 newUniverse
[i
][ii
] = 0;
108 newUniverse
[i
][ii
] = 1;
111 newUniverse
[i
][ii
] = (neighbors
== 3 ? 1 : 0);
115 for (var i
in newUniverse
) {
116 for (var ii
in newUniverse
[i
]) {
117 newUniverse
[i
][ii
] ? universe
[i
][ii
].revive() : universe
[i
][ii
].kill();
120 $('#generation')[0].innerHTML
= automaton
.generation
;
123 var automaton
= new universe
;
124 var seed
= $.extend(true, {}, automaton
);
127 $('#controls #start-automaton').click(function(e
){
128 tickID
= setInterval(function(){tick(automaton
)}, 100);
129 $('#controls #start-automaton').hide();
130 $('#controls #stop-automaton').show();
131 $('#controls #highlight-seed').show();
134 $('#controls #stop-automaton').click(function(e
){
135 clearInterval(tickID
);
136 $('#controls #stop-automaton').hide();
137 $('#controls #start-automaton').show();
140 $('#controls #reset-automaton').click(function(e
){
141 clearInterval(tickID
);
142 $('#controls #stop-automaton').hide();
143 $('#controls #start-automaton').show();
144 automaton
= $.extend(true, {}, seed
);
145 $('#generation')[0].innerHTML
= automaton
.generation
;
149 $('#controls #highlight-seed').click(function(e
){