Files
havox/projects/game_of_life.html
2026-03-16 18:03:17 +00:00

113 lines
2.9 KiB
HTML

<!DOCTYPE html>
<html>
<head>
<link rel="shortcut icon" type"image/ico" href"/Media/iconImage.ico">
<meta name="viewport" width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0>
<style>
body {
padding: 0;
margin: 0;
}
</style>
<script src="https://cdn.jsdelivr.net/npm/p5@1.4.0/lib/p5.min.js"></script>
<title>Game of Life</title>
<script>
function MakeArray(cols, rows) {
let arr = new Array(cols);
for (let i = 0; i < arr.length; i++) {
arr[i] = new Array(rows);
}
return arr;
}
let grid;
let cols;
let rows;
let resolution = 5;
function setup() {
createCanvas(800, 600);
//frameRate(3);
cols = floor(width / resolution);
rows = floor(height / resolution);
grid = MakeArray(cols, rows);
for (let i = 0; i < cols; i++) {
for (let j = 0; j < rows; j++) {
grid[i][j] = floor(random(2));
}
}
}
function draw() {
background(0);
for (let i = 0; i < cols; i++) {
for (let j = 0; j < rows; j++) {
//grid[i][j] = floor(random(2));
let x = i * resolution;
let y = j * resolution;
stroke(0);
if (grid[i][j] == 1) {
fill(255);
} else {
fill(0);
}
rect(x, y, resolution - 0.5, resolution - 0.5);
}
}
let next = MakeArray(cols, rows);
// Compute next based on grid
for (let i = 0; i < cols; i++) {
for (let j = 0; j < rows; j++) {
let state = grid[i][j];
// Count live neighbors!
let sum = 0;
let neighbors = CountNeighbors(grid, i, j);
if (state == 0 && neighbors == 3) {
next[i][j] = 1;
} else if (state == 1 && (neighbors < 2 || neighbors > 3)) {
next[i][j] = 0;
} else {
next[i][j] = state;
}
}
}
grid = next;
}
function CountNeighbors(grid, x, y) {
let sum = 0;
for (let i = -1; i < 2; i++) {
for (let j = -1; j < 2; j++) {
let col = (x + i + cols) % cols;
let row = (y + j + rows) % rows;
sum += grid[col][row];
}
}
sum -= grid[x][y];
return sum;
}
</script>
</head>
<body>
</body>
</html>