AI game creator

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

No:44847

←

Prev Next

→

Merge Game
Developer User19488｜Date and time 24/2/19 11:21:34
Build time 7.623 sec｜Game capacity 1.845KB｜

Script

←

Prev　Next

→ 　

Back　

[PR]現在の本の売れ筋ランキング

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

<!DOCTYPE html>
<html>
<head>
    <title>Merge Game</title>
</head>
<body>
    <canvas id="gameCanvas" width="400" height="400"></canvas>
    <script>
      const canvas = document.getElementById("gameCanvas");
      const ctx = canvas.getContext("2d");
      
      const tileSize = 100;
      const numRows = 4;
      const numCols = 4;
      const colors = ["red", "blue", "green", "yellow"];
      
      let board = [];
      
      function initializeBoard() {
        for (let i = 0; i < numRows; i++) {
          let row = [];
          for (let j = 0; j < numCols; j++) {
            row.push(getRandomColor());
          }
          board.push(row);
        }
      }
      
      function getRandomColor() {
        return colors[Math.floor(Math.random() * colors.length)];
      }
      
      function drawBoard() {
        for (let i = 0; i < numRows; i++) {
          for (let j = 0; j < numCols; j++) {
            ctx.fillStyle = board[i][j];
            ctx.fillRect(j * tileSize, i * tileSize, tileSize, tileSize);
          }
        }
      }
      
      function mergeTiles() {
        for (let i = 0; i < numRows; i++) {
          for (let j = 0; j < numCols; j++) {
            if (i < numRows - 1 && board[i][j] === board[i + 1][j]) {
              board[i][j] = getRandomColor();
              board[i + 1][j] = getRandomColor();
            }
            if (j < numCols - 1 && board[i][j] === board[i][j + 1]) {
              board[i][j] = getRandomColor();
              board[i][j + 1] = getRandomColor();
            }
          }
        }
      }
      
      function gameLoop() {
        ctx.clearRect(0, 0, canvas.width, canvas.height);
        mergeTiles();
        drawBoard();
        requestAnimationFrame(gameLoop);
      }
      
      initializeBoard();
      gameLoop();
    </script>
</body>
</html>