X-Git-Url: https://disinclined.org/git/?a=blobdiff_plain;f=2d.js;h=46ccc756b7a5b3360615592939d7a75930c59dc7;hb=2a2905dab006707832faf48ed505e9b0056c6ae1;hp=a42f1eb2eb8cdfaefe1846cb61d27dcbf6c56eb0;hpb=dffe6fd64e57b88a30725c8b197d29d75c7534c9;p=cellular-automaton.git diff --git a/2d.js b/2d.js index a42f1eb..46ccc75 100644 --- a/2d.js +++ b/2d.js @@ -1,25 +1,13 @@ $(document).ready(function(){ - var cells = 20; - var generations = 10; - - var state = { - '000' : '0', - '001' : '0', - '010' : '0', - '011' : '1', - '100' : '0', - '101' : '1', - '110' : '1', - '111' : '0', - } - - var canvas = document.getElementById('canvas') + var canvas = document.getElementById('2d-automaton') var c = canvas.getContext('2d'); - var cellWidth = Math.floor(canvas.width / cells); - var cellHeight = Math.floor(canvas.height / generations); - var generation = 0; + var rows = 50; + var columns = 50; + + var cellWidth = canvas.width / rows; + var cellHeight = canvas.height / columns; function cell(x, y, h, l) { this.x = x; @@ -28,7 +16,7 @@ $(document).ready(function(){ this.l = l; this.state = 0; this.kill = function() { - c.fillStyle = "rgb(200,0,0)"; + c.fillStyle = "rgb(255,255,255)"; c.fillRect(this.x, this.y, this.h, this.l); this.state = 0; } @@ -37,36 +25,129 @@ $(document).ready(function(){ 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); + } } - function populate_world() { - var world = []; - var x = 0; - var y = 0; - for (var i = 0; i < cells; i++) { - world.push(new cell(x, y, cellHeight, cellWidth)); - x += cellWidth; - Math.random() > .5 ? world[i].revive() : world[i].kill(); + function universe() { + this.population = []; + this.generation = 0; + + for (var i = 0; i < rows; i++) { + var world = []; + var x = 0; + var y = i * cellHeight; + for (var ii = 0; ii < columns; ii++) { + world.push(new cell(x, y, cellWidth, cellHeight)); + x += cellWidth; + Math.random() > .5 ? world[ii].revive() : world[ii].kill(); + } + 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++) { + if (this.population[i][ii].state == 1) { + this.population[i][ii].highlight(); + } + } + } + } + + this.redraw = function() { + for (var i = 0; i < rows; i++) { + for (var ii = 0; ii < columns; ii++) { + if (this.population[i][ii].state == 1) { + this.population[i][ii].redraw(); + } + } + } } - return world; } - function generate() { - generation += 1; - var x = 0; - var y = generation * cellHeight; - var s = '0' + world.map(function(c) { return c.state }).join('') + '0'; - world = []; - for (var i = 0; i < cells; i++) { - world.push(new cell(x, y, cellHeight, cellWidth)); - x += cellWidth; - state[s.substr(i, 3)] == 1 ? world[i].revive() : world[i].kill(); + function tick(automaton) { + automaton.generation += 1; + var universe = automaton.population; + var newUniverse = []; + for (var i = 0; i < universe.length; i++) { + newUniverse[i] = []; + for (var ii = 0; ii < universe[i].length; ii++) { + var neighbors = (universe[i][ii+1] ? universe[i][ii+1].state : 0) + + (universe[i][ii-1] ? universe[i][ii-1].state : 0) + + (universe[i+1] ? + (universe[i+1][ii] ? universe[i+1][ii].state : 0) + + (universe[i+1][ii+1] ? universe[i+1][ii+1].state : 0) + + (universe[i+1][ii-1] ? universe[i+1][ii-1].state : 0) + : 0) + + (universe[i-1] ? + (universe[i-1][ii] ? universe[i-1][ii].state : 0) + + (universe[i-1][ii-1] ? universe[i-1][ii-1].state : 0) + + (universe[i-1][ii+1] ? universe[i-1][ii+1].state : 0) + : 0); + universe[i][ii].neighbors = neighbors; + if (universe[i][ii].state == 1) { + if (neighbors < 2 || neighbors > 3) { + newUniverse[i][ii] = 0; + } else { + newUniverse[i][ii] = 1; + } + } else { + newUniverse[i][ii] = (neighbors == 3 ? 1 : 0); + } + } } - //if (generation == generations) { clearInterval(tick_id) } + for (var i in newUniverse) { + for (var ii in newUniverse[i]) { + newUniverse[i][ii] ? universe[i][ii].revive() : universe[i][ii].kill(); + } + } + $('#generation')[0].innerHTML = automaton.generation; } - var world = populate_world(); - while (generations) { generate(); generations-- } - //var tick_id = setInterval(generate, 100); + var automaton = new universe; + var seed = $.extend(true, {}, automaton); + var tickID = 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(); + }); + + $('#controls #stop-automaton').click(function(e){ + clearInterval(tickID); + $('#controls #stop-automaton').hide(); + $('#controls #start-automaton').show(); + }); + + $('#controls #reset-automaton').click(function(e){ + clearInterval(tickID); + $('#controls #stop-automaton').hide(); + $('#controls #start-automaton').show(); + automaton = $.extend(true, {}, seed); + $('#generation')[0].innerHTML = automaton.generation; + automaton.redraw(); + }); + + $('#controls #highlight-seed').click(function(e){ + seed.highlight(); + }); });