// ゲームに関連する変数と定数を設定
const canvas = document.getElementById('game-board');
const ctx = canvas.getContext('2d');
const blockSize = 50;
const gridWidth = 8;
const gridHeight = 16;
const colors = ['red', 'blue', 'green', 'yellow', 'purple'];

let gameGrid;
let currentPair;
let score;
let chainCount;
let paused;
let lastTime;
let currentSpeed = 1;

// ゲームの初期化
function initializeGame() {
  gameGrid = createEmptyGrid();
  currentPair = createNewPair();
  score = 0;
  chainCount = 0;
  paused = false;
  displayScore();
  drawGameGrid();
  lastTime = performance.now();
  gameLoop();
}

// 空のグリッドを作成
function createEmptyGrid() {
  const grid = [];
  for (let y = 0; y < gridHeight; y++) {
    const row = [];
    for (let x = 0; x < gridWidth; x++) {
      row.push(null);
    }
    grid.push(row);
  }
  return grid;
}

// 新しいブロックペアを作成
function createNewPair() {
  const color1 = colors[Math.floor(Math.random() * colors.length)];
  const color2 = colors[Math.floor(Math.random() * colors.length)];
  const block1 = { x: Math.floor(gridWidth / 2) - 1, y: 0, color: color1 };
  const block2 = { x: Math.floor(gridWidth / 2), y: 0, color: color2 };
  return { block1, block2 };
}

// ゲームのメインループ
function gameLoop() {
  const currentTime = performance.now();
  if (currentTime - lastTime > 1000 / currentSpeed) {
    if (!paused) {
      if (!moveCurrentPair(0, 1)) {
        lockCurrentPair();
        if (gameOver()) {
          displayOverlay("Game Over");
          return;
        }
        checkForClearsAndChains();
        currentPair = createNewPair();
      }
    }
  }
  drawGameGrid();
  requestAnimationFrame(gameLoop);
}


// 現在のブロックペアを移動
function moveCurrentPair(dx, dy) {
  const newBlock1 = {
    x: currentPair.block1.x + dx,
    y: currentPair.block1.y + dy,
  };
  const newBlock2 = {
    x: currentPair.block2.x + dx,
    y: currentPair.block2.y + dy,
  };

  if (isValidMove(newBlock1) && isValidMove(newBlock2)) {
    currentPair.block1 = newBlock1;
    currentPair.block2 = newBlock2;
    return true;
  }
  return false;
}

// 現在のブロックペアを回転
function rotateCurrentPair(clockwise) {
  if (paused) return;

  const centerBlock = currentPair.block1;
  const rotatingBlock = currentPair.block2;
  const dx = rotatingBlock.x - centerBlock.x;
  const dy = rotatingBlock.y - centerBlock.y;
  const newDx = clockwise ? dy : -dy;
  const newDy = clockwise ? -dx : dx;
  const newRotatingBlock = {
    x: centerBlock.x + newDx,
    y: centerBlock.y + newDy,
    color: rotatingBlock.color,
  };

  if (isValidMove(newRotatingBlock)) {
    currentPair.block2 = newRotatingBlock;
  }
}

// 移動が有効かどうかを判断
function isValidMove(block) {
  return (
    block.x >= 0 &&
    block.x < gridWidth &&
    block.y >= 0 &&
    block.y < gridHeight &&
    gameGrid[block.y][block.x] === null
  );
}

// 現在のブロックペアを固定
function lockCurrentPair() {
  gameGrid[currentPair.block1.y][currentPair.block1.x] =
    currentPair.block1.color;
  gameGrid[currentPair.block2.y][currentPair.block2.x] =
    currentPair.block2.color;
}

// ゲームオーバー判定
function gameOver() {
  return (
    gameGrid[currentPair.block1.y][currentPair.block1.x] !== null ||
    gameGrid[currentPair.block2.y][currentPair.block2.x] !== null
  );
}

// クリアと連鎖のチェック
function checkForClearsAndChains() {
  const cleared = clearConnectedBlocks();
  if (cleared > 0) {
    score +=
      Math.floor((cleared / 4) * 100) * (1 + chainCount * 0.25);
    chainCount++;
    displayScore();
    setTimeout(() => {
      checkForClearsAndChains();
    }, 1000);
  } else {
    chainCount = 0;
  }
}

// 接続されたブロックをクリア
function clearConnectedBlocks() {
  const visited = createEmptyGrid();
  let cleared = 0;

  for (let y = 0; y < gridHeight; y++) {
    for (let x = 0; x < gridWidth; x++) {
      if (!visited[y][x] && gameGrid[y][x] !== null) {
        const connectedBlocks = [];
        const color = gameGrid[y][x];
        findConnectedBlocks(x, y, visited, connectedBlocks, color);

        if (connectedBlocks.length >= 4) {
          clearBlocks(connectedBlocks);
          cleared += connectedBlocks.length;
        }
      }
    }
  }

  return cleared;
}

// 接続されたブロックを見つける
function findConnectedBlocks(x, y, visited, connectedBlocks, color) {
  if (
    x < 0 ||
    x >= gridWidth ||
    y < 0 ||
    y >= gridHeight ||
    visited[y][x] ||
    gameGrid[y][x] !== color
  ) {
    return;
  }

  visited[y][x] = true;
  connectedBlocks.push({ x, y });
  findConnectedBlocks(x - 1, y, visited, connectedBlocks, color);
  findConnectedBlocks(x + 1, y, visited, connectedBlocks, color);
  findConnectedBlocks(x, y - 1, visited, connectedBlocks, color);
  findConnectedBlocks(x, y + 1, visited, connectedBlocks, color);
}

// ブロックをクリアする
function clearBlocks(blocks) {
  for (const block of blocks) {
    gameGrid[block.y][block.x] = null;
  }
}

// ゲームの描画
function drawGameGrid() {
  ctx.fillStyle = "black";
  ctx.fillRect(0, 0, canvas.width, canvas.height);
  drawGridLines();

  for (let y = 0; y < gridHeight; y++) {
    for (let x = 0; x < gridWidth; x++) {
      const color = gameGrid[y][x];
      if (color) {
        drawBlock(x, y, color);
      }
    }
  }

  drawBlock(currentPair.block1.x, currentPair.block1.y, currentPair.block1.color);
  drawBlock(currentPair.block2.x, currentPair.block2.y, currentPair.block2.color);
}

// グリッドラインの描画
function drawGridLines() {
  ctx.strokeStyle = "black";
  ctx.lineWidth = 1;
  for (let x = 1; x < gridWidth; x++) {
    ctx.beginPath();
    ctx.moveTo(x * blockSize, 0);
    ctx.lineTo(x * blockSize, gridHeight * blockSize);
    ctx.stroke();
  }
  for (let y = 1; y < gridHeight; y++) {
    ctx.beginPath();
    ctx.moveTo(0, y * blockSize);
    ctx.lineTo(gridWidth * blockSize, y * blockSize);
    ctx.stroke();
  }
}

// ブロックの描画
function drawBlock(x, y, color) {
  ctx.fillStyle = color;
  ctx.beginPath();
  ctx.arc(
    x * blockSize + blockSize / 2,
    y * blockSize + blockSize / 2,
    blockSize / 2 - 1,
    0,
    2 * Math.PI
  );
  ctx.fill();
}

// ゲームの初期化
function initGame() {
  gameGrid = createEmptyGrid();
  score = 0;
  chainCount = 0;
  displayScore();
  spawnNextPair();
}

// ゲームのメインループ
function gameLoop() {
  currentTime = performance.now();
  if (currentTime - lastTime > 1000 / currentSpeed) {
    if (!paused) {
      if (!moveCurrentPair(0, 1)) {
        lockCurrentPair();
        if (gameOver()) {
          displayOverlay("Game Over");
          return;
        }
        checkForClearsAndChains();
        spawnNextPair();
      }
    }
    lastTime = currentTime;
  }
  drawGameGrid();
  requestAnimationFrame(gameLoop);
}

initializeGame(); 

'''
上記コードを実行しても、ページ表示直後に落下ブロックが表示されず、ゲームが進行しません。根本的な問題の可能性がある点について考慮して改修を実施し、改修部分が分かるように修正コードの前後を含め表示してください