$(document).ready(function(){
- var canvas = document.getElementById('2d-automaton')
+ var canvas = $('#2d-automaton')[0];
var c = canvas.getContext('2d');
var rows = 50;
c.fillRect(this.x, this.y, this.h, this.l);
this.state = 1;
}
- this.redraw = function() {
- c.fillStyle = this.state == 1 ? "rgb(0,0,0)" : "rgb(255,255,255)";
- c.fillRect(this.x, this.y, this.h, this.l);
- }
- this.highlight = function() {
- c.fillStyle = "rgb(0,0,100)";
- c.fillRect(this.x, this.y, this.h, this.l);
+ this.toggle = function() {
+ this.state ? this.kill() : this.revive();
}
}
this.population.push(world);
}
- this.print = function() {
- for (var i = 0; i < rows; i++) {
- var s = '';
- for (var ii = 0; ii < columns; ii++) {
- s += this.population[i][ii];
- }
- }
- }
-
this.highlight = function() {
for (var i = 0; i < rows; i++) {
for (var ii = 0; ii < columns; ii++) {
}
var automaton = new universe;
- var seed = $.extend(true, {}, automaton);
var tickID = 0;
+ var running = 0;
$('#controls #start-automaton').click(function(e){
tickID = setInterval(function(){tick(automaton)}, 100);
$('#controls #start-automaton').hide();
$('#controls #stop-automaton').show();
- $('#controls #highlight-seed').show();
+ running = 1;
});
$('#controls #stop-automaton').click(function(e){
- clearInterval(tickID);
- $('#controls #stop-automaton').hide();
- $('#controls #start-automaton').show();
- });
-
- $('#controls #reset-automaton').click(function(e){
- clearInterval(tickID);
+ if (running) clearInterval(tickID);
$('#controls #stop-automaton').hide();
$('#controls #start-automaton').show();
- automaton = $.extend(true, {}, seed);
- $('#generation')[0].innerHTML = automaton.generation;
- automaton.redraw();
+ running = 0;
});
- $('#controls #highlight-seed').click(function(e){
- seed.highlight();
+ $('#2d-automaton').click(function(e) {
+ if (!running) {
+ var x = e.pageX - $('#2d-automaton').offset().left;
+ var y = e.pageY - $('#2d-automaton').offset().top;
+ var row = Math.floor(y / cellHeight);
+ var column = Math.floor(x / cellWidth);
+ automaton.population[row][column].toggle();
+ }
});
});