document.addEventListener("DOMContentLoaded", function() {
  var grid = document.querySelector(".grid");
  var cells = grid.getElementsByClassName("cell");

  var bombs = []; // 存儲炸彈位置

  // 隨機生成炸彈位置
  function generateBombs() {
    while (bombs.length < 10) {
      var randomCell = Math.floor(Math.random() * 100);
      if (!bombs.includes(randomCell)) {
        bombs.push(randomCell);
      }
    }
  }

  // 檢查是否為炸彈格子
  function isBombCell(cellIndex) {
    return bombs.includes(cellIndex);
  }

  // 計算相鄰格子的炸彈數量
  function countAdjacentBombs(cellIndex) {
    var adjacentIndices = [
      cellIndex - 11, cellIndex - 10, cellIndex - 9,
      cellIndex - 1,                  cellIndex + 1,
      cellIndex + 9, cellIndex + 10, cellIndex + 11
    ];

    var count = 0;
    for (var i = 0; i < adjacentIndices.length; i++) {
      if (adjacentIndices[i] >= 0 && adjacentIndices[i] < 100) {
        if (isBombCell(adjacentIndices[i])) {
          count++;
        }
      }
    }

    return count;
  }

  // 顯示格子的數字
  function revealNumber(cellIndex) {
    var cell = cells[cellIndex];
    if (!cell.classList.contains("revealed")) {
      cell.classList.add("revealed");

      if (isBombCell(cellIndex)) {
        cell.style.backgroundColor = "red";
      } else {
        var bombCount = countAdjacentBombs(cellIndex);
        if (bombCount > 0) {
          cell.textContent = bombCount;
        }
      }
    }
  }

  // 點擊格子事件處理程序
  function cellClickHandler() {
    var cellIndex = Array.prototype.indexOf.call(cells, this);
    revealNumber(cellIndex);
  }

  // 生成踩地雷遊戲
  function generateGame() {
    generateBombs();

    for (var i = 0; i < cells.length; i++) {
      cells[i].addEventListener("click", cellClickHandler);
    }
  }

  generateGame();
});