click on cells to toggle while 2d automaton stopped

diff --git a/1d.js b/1d.js
index 5ead70f..8ce01bd 100644 (file)
--- a/1d.js
+++ b/1d.js
@@ -14,11 +14,11 @@ $(document).ready(function(){
         '111' : '0',
     }
 
-    var canvas = document.getElementById('1d-automaton')
+    var canvas = $('#1d-automaton')[0];
     var c = canvas.getContext('2d');
 
-    var cellWidth = Math.floor(canvas.width / cells);
-    var cellHeight = Math.floor(canvas.height / generations);
+    var cellWidth = canvas.width / cells;
+    var cellHeight = canvas.height / generations;
     var generation = 0;
 
     function cell(x, y, h, l) {

diff --git a/2d.js b/2d.js
index 9460aa7..f0e5f1e 100644 (file)
--- a/2d.js
+++ b/2d.js
@@ -1,6 +1,6 @@
 $(document).ready(function(){
     
-    var canvas = document.getElementById('2d-automaton')
+    var canvas = $('#2d-automaton')[0];
     var c = canvas.getContext('2d');
 
     var rows = 50;
@@ -25,6 +25,9 @@ $(document).ready(function(){
             c.fillRect(this.x, this.y, this.h, this.l);
             this.state = 1;
         }
+        this.toggle = function() {
+            this.state ? this.kill() : this.revive();
+        }
     }
 
     function universe() {
@@ -105,17 +108,30 @@ $(document).ready(function(){
 
     var automaton = new universe;
     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();
+        running = 1;
     });
 
     $('#controls #stop-automaton').click(function(e){
-        clearInterval(tickID);
+        if (running) clearInterval(tickID);
         $('#controls #stop-automaton').hide();
         $('#controls #start-automaton').show();
+        running = 0;
+    });
+
+    $('#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();
+        }
     });
 
 });