Conways game of life color cell wars's game

Click here for free DL of the app version that can save data.

No:48245

←

Prev Next

→

Conways game of life color cell wars
Developer User18896｜Date and time 24/3/1 20:16:10
Build time 10.771 sec｜Game capacity 2.279KB｜

Script

←

Prev　Next

→ 　

Back　

[PR]現在のゲームギフトランキング

Click here for free DL of the app version that can save data.

<!DOCTYPE html>
<html>
<head>
  <title>Conway's Game of Life: Color Cell Wars</title>
  <style>
    #grid {
      display: grid;
      grid-template-columns: repeat(auto-fill, 10px);
    }
    .cell {
      width: 10px;
      height: 10px;
      border: 1px solid #000;
    }
  </style>
</head>
<body>
  <div id="grid"></div>
  
  <script>
    const rows = 50;
    const cols = 50;
    let grid = createGrid();
    
    function createGrid() {
      let newGrid = new Array(rows);
      for (let i = 0; i < rows; i++) {
        newGrid[i] = new Array(cols).fill(0);
      }
      return newGrid;
    }
    
    function updateGrid() {
      let newGrid = createGrid();
      for (let i = 0; i < rows; i++) {
        for (let j = 0; j < cols; j++) {
          let neighbors = countNeighbors(i, j);
          if (grid[i][j] === 1) {
            if (neighbors < 2 || neighbors > 3) {
              newGrid[i][j] = 0;
            } else {
              newGrid[i][j] = 1;
            }
          } else {
            if (neighbors === 3) {
              newGrid[i][j] = 1;
            }
          }
        }
      }
      grid = newGrid;
    }
    
    function countNeighbors(x, y) {
      let count = 0;
      const neighbors = [
        [-1, -1], [-1, 0], [-1, 1],
        [0, -1], [0, 1],
        [1, -1], [1, 0], [1, 1]
      ];
      
      for (let neighbor of neighbors) {
        let dx = x + neighbor[0];
        let dy = y + neighbor[1];
        if (dx >= 0 && dx < rows && dy >= 0 && dy < cols) {
          count += grid[dx][dy];
        }
      }
      
      return count;
    }
    
    function drawGrid() {
      const gridElement = document.getElementById('grid');
      gridElement.innerHTML = '';
      
      grid.forEach((row, i) => {
        row.forEach((cell, j) => {
          const cellElement = document.createElement('div');
          cellElement.className = cell ? 'cell alive' : 'cell';
          cellElement.addEventListener('click', () => {
            grid[i][j] = grid[i][j] ? 0 : 1;
            drawGrid();
          });
          gridElement.appendChild(cellElement);
        });
      });
    }
    
    function main() {
      updateGrid();
      drawGrid();
      requestAnimationFrame(main);
    }
    
    main();
  </script>
</body>
</html>