User:Tommyaweosme/tommylife/source

data:text/html,<title>tommylife - conways game of life emulation</title> <h1>tommylife</h1> <canvas id="myCanvas"></canvas> <script>const canvas = document.getElementById('myCanvas'); const ctx = canvas.getContext('2d'); function tile(x, y, color) { const canvas = document.getElementById('myCanvas'); const ctx = canvas.getContext('2d'); ctx.fillStyle = color; ctx.fillRect(7 * x, 7 * y, 7, 7); } let tiles = [[0,0,0,0,0,0,0,0,1,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,1,1,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,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,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,0,0,0,0,0,0,0],[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0]]; let newtiles = [[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,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,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,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]]; function dogrid(){ for (let i = 0; i < tiles.length; i++) { for (let j = 0; j < tiles[i].length; j++) { if (tiles[i][j] == 0) { tile(i, j, 'black'); } else { tile(i, j, 'blue'); } } }} dogrid(); function generation() { if (document.getElementById('toggle').value == 1){ for (let i = 0; i < tiles.length; i++) { for (let j = 0; j < tiles[i].length; j++) { let liveNeighbors = 0; for (let x = -1; x <= 1; x++) { for (let y = -1; y <= 1; y++) { if (x === 0 && y === 0) continue; const newX = i + x; const newY = j + y; if (newX >= 0 && newX < tiles.length && newY >= 0 && newY < tiles[i].length) { if (tiles[newX][newY] === 1) { liveNeighbors++; } } } } if (tiles[i][j] === 0 && (document.getElementById('births').value.includes(String(liveNeighbors)))) { newtiles[i][j] = 1; } else if (tiles[i][j] === 1 && (document.getElementById('survivals').value.includes(String(liveNeighbors)))) { newtiles[i][j] = tiles[i][j]; } else { newtiles[i][j] = 0; } } }      for (let i = 0; i < tiles.length; i++) { for (let j = 0; j < tiles[i].length; j++) { tiles[i][j] = newtiles[i][j]; } } dogrid() }} const intervalId = setInterval(generation, 500); const div = document.getElementById('myCanvas'); div.addEventListener('mousedown', (event) => { const x = event.clientX; const y = event.clientY; tiles[String(Math.floor(x/7) - 1)][String(Math.floor(y/7) - 9)] = (tiles[String(Math.floor(x/7) - 1)][String(Math.floor(y/7) - 9)] + 1)%2; dogrid(); }); </script> <input type="range" min=0 max=1 id="toggle">running?<br>b<input id="births" value="3">s<input id="survivals" value="23"><button onclick="document.getElementById('births').value = Math.floor(Math.random() * 1000); document.getElementById('survivals').value = Math.floor(Math.random() * 1000)">randomize</button>