Created
January 28, 2014 22:57
-
-
Save boboluu/8678400 to your computer and use it in GitHub Desktop.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
canvas { | |
border: 1px solid black; | |
width:100%; | |
height:100%; | |
} | |
body{ | |
width:100%; | |
margin:0; | |
padding:0; | |
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<html> | |
<head> | |
<script src="http://code.jquery.com/jquery-git2.js"></script> | |
<meta charset=utf-8 /> | |
<title>JS Bin</title> | |
</head> | |
<body> | |
<h1>game of life</h1> | |
<button>Start/Stop</button> | |
<canvas id="myCanvas" height=1720></canvas> | |
</body> | |
</html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
var c = document.getElementById("myCanvas"); | |
var ctx = c.getContext("2d"); | |
GRID_WIDTH = 100; | |
GRID_HEIGHT = 100; | |
CELL_SIZE = 10; | |
var state = {}; | |
state ["1,1"] = true; | |
state ["1,2"] = true; | |
state ["1,3"] = true; | |
var dying = []; | |
var spawning = []; | |
var itsRunning = false; | |
var drawSquare = function(x,y){ | |
ctx.strokeStyle="#000000"; | |
ctx.strokeRect(x*CELL_SIZE,y*CELL_SIZE,CELL_SIZE,CELL_SIZE); | |
}; | |
var liveCell = function(x,y){ | |
ctx.fillStyle="#ffffff"; | |
ctx.fillRect(x*CELL_SIZE,y*CELL_SIZE,CELL_SIZE,CELL_SIZE); | |
}; | |
var deadCell = function(x,y){ | |
ctx.fillStyle="#ff0000"; | |
ctx.fillRect(x*CELL_SIZE,y*CELL_SIZE,CELL_SIZE,CELL_SIZE); | |
}; | |
function setCellDead(x,y){ | |
//console.log("killing",x,y,numNeighbors(x,y)); | |
var cell_id = ""+x+","+y; | |
dying.push(cell_id); | |
} | |
function setCellAlive(x,y){ | |
var cell_id = ""+x+","+y; | |
spawning.push(cell_id); | |
} | |
var getCellState = function(x,y){ | |
var cell_id = ""+x+","+y; | |
//console.log(cell_id, state[cell_id]); | |
if (state[cell_id]){ | |
return true | |
} | |
} | |
var draw_grid = function(){ | |
for (var i=0; i<GRID_WIDTH; i++){ | |
for (var j=0; j<GRID_HEIGHT; j++){ | |
if (getCellState(i,j)){ | |
liveCell(i,j); | |
} | |
else deadCell(i,j); | |
drawSquare(i, j); | |
} | |
} | |
} | |
function render(){ | |
draw_grid(); | |
setTimeout(render, 1000/60); | |
} | |
render(); | |
function numNeighbors(x,y){ | |
var i = 0; | |
if (getCellState(x-1,y-1) == true) i++; | |
if (getCellState(x,y-1) == true) i++; | |
if (getCellState(x+1,y-1) == true) i++; | |
if (getCellState(x-1,y) == true) i++; | |
if (getCellState(x+1,y) == true) i++; | |
if (getCellState(x-1,y+1) == true) i++; | |
if (getCellState(x,y+1) == true) i++; | |
if (getCellState(x+1,y+1) == true) i++; | |
return i; | |
} | |
var killCell = function(x,y){ | |
if (numNeighbors(x,y) < 2) | |
setCellDead(x,y); | |
if (numNeighbors(x,y) > 3) | |
setCellDead(x,y); | |
} | |
var spawnCell = function(x,y){ | |
if (numNeighbors(x,y) == 3) | |
setCellAlive(x,y); | |
} | |
var life = function(){ | |
itsRunning=true; | |
for (var i=0; i<GRID_WIDTH; i++){ | |
for (var j=0; j<GRID_HEIGHT; j++){ | |
if (getCellState(i,j) == true) | |
killCell(i,j); | |
else | |
spawnCell(i,j); | |
} | |
} | |
for (var i=0; i<dying.length; i++) | |
state[dying[i]] = false; | |
for (var i=0; i<spawning.length; i++) | |
state[spawning[i]] = true; | |
dying = []; | |
spawning = []; | |
if(itsRunning){setTimeout(life, 1000)}; | |
} | |
//setTimeout(life, 1000); | |
var toggleGame = function(){ | |
if(itsRunning) | |
itsRunning=false; | |
else life(); | |
}; | |
$("button").on("click", toggleGame) | |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment