Coonway's Game of Life

by Andrew Dunai

HTML

<div><b>Controls:</b> <a href="#" id="startstop">Start/stop</a> | <a href="#" id="clear">Clear</a></div>
<div><b>Examples:</b> <a href="#" id="test1">Queen bee shuttle</a> | <a href="#" id="test2">Glider gun!</a> | <a href="#" id="test3">Orion</a></div>
<div><b>Speed:</b> <a href="#" id="speed-3000">very slow</a> | <a href="#" id="speed-1000">normal</a> | <a href="#" id="speed-250">fast</a> | <a href="#" id="speed-50">very fast</a> | <a href="#" id="speed-5">ultra fast</a></div>
<canvas id="canvas" width="600" height="400"></canvas>

CSS

canvas {
    border: 1px solid #06A;
}

JavaScript

var canvas = document.getElementById('canvas');
var ctx = canvas.getContext('2d');
var iHandle = 0;
var year = 0;
var world = null;
var speed = 1000;
canvas.onclick = function(e){
    var x = Math.floor((e.pageX - canvas.offsetLeft) / 10);
    var y = Math.floor((e.pageY - canvas.offsetTop) / 10);
    world[y][x] = !world[y][x];
    repaint();
};
document.getElementById('startstop').onclick = function(){
    toggleGame();
};
document.getElementById('clear').onclick = function(){
    clear();
    repaint();
};

document.getElementById('test1').onclick = function(){
    putWorld([
        [0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0],
        [0,0,0,0,0,0,0,0,0,0,1,0,0,0,0,0,0,0,0,0,0,0,0,0],
        [0,0,0,0,0,0,0,0,1,0,1,0,0,0,0,0,0,0,0,0,0,0,0,0],
        [0,0,0,0,0,0,0,1,0,1,0,0,0,0,0,0,0,0,0,0,0,1,1,0],
        [0,1,1,0,0,0,1,0,0,1,0,0,0,0,0,0,0,0,0,0,0,1,1,0],
        [0,1,1,0,0,0,0,1,0,1,0,0,0,0,0,0,0,0,0,0,0,0,0,0],
        [0,0,0,0,0,0,0,0,1,0,1,0,0,0,0,0,0,0,0,0,0,0,0,0],
        [0,0,0,0,0,0,0,0,0,0,1,0,0,0,0,0,0,0,0,0,0,0,0,0],
        [0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0],
    ], 15, 15);
};

document.getElementById('test2').onclick = function(){
    putWorld([
        [0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0],
        [0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1,0,0,0,0,0,0,0,0,0,0,0,0],
        [0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1,0,1,0,0,0,0,0,0,0,0,0,0,0,0],
        [0,0,0,0,0,0,0,0,0,0,0,0,0,1,1,0,0,0,0,0,0,1,1,0,0,0,0,0,0,0,0,0,0,0,0,1,1,0],
        [0,0,0,0,0,0,0,0,0,0,0,0,1,0,0,0,1,0,0,0,0,1,1,0,0,0,0,0,0,0,0,0,0,0,0,1,1,0],
        [0,1,1,0,0,0,0,0,0,0,0,1,0,0,0,0,0,1,0,0,0,1,1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0],
        [0,1,1,0,0,0,0,0,0,0,0,1,0,0,0,1,0,1,1,0,0,0,0,1,0,1,0,0,0,0,0,0,0,0,0,0,0,0],
        [0,0,0,0,0,0,0,0,0,0,0,1,0,0,0,0,0,1,0,0,0,0,0,0,0,1,0,0,0,0,0,0,0,0,0,0,0,0],
        [0,0,0,0,0,0,0,0,0,0,0,0,1,0,0,0,1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0],
       ...