AI game creator

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

No:30452

←

Prev Next

→

テトリス9
Developer User13711｜Date and time 23/12/21 23:11:06
Build time 50.2 sec｜Game capacity 6.625KB｜

Script

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋アプリランキング

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

<!DOCTYPE html>
<html>
  <head>
    <title>Tetris</title>
    <style>
      body {
        display: flex;
        justify-content: center;
        align-items: center;
        height: 100vh;
        margin: 0;
        background-color: #f1f1f1;
      }
      
      #game-board {
        width: 300px;
        height: 600px;
        border: 2px solid #333;
        background-color: #fff;
        display: grid;
        grid-template-columns: repeat(10, 1fr);
        grid-template-rows: repeat(20, 1fr);
      }
    </style>
  </head>
  <body>
    <div id="game-board"></div>

// Game state variables
      let board = [];
      let currentPiece = {
        shape: [[]],
        row: 0,
        col: 0,
        color: 0
      };

// Initialize the game board
      function initGameBoard() {
        for (let row = 0; row < ROWS; row++) {
          board[row] = [];
          for (let col = 0; col < COLS; col++) {
            board[row][col] = 0;
          }
        }
      }

// Render the game board
      function renderGameBoard() {
        const gameBoard = document.getElementById("game-board");
        gameBoard.innerHTML = "";

for (let row = 0; row < ROWS; row++) {
          for (let col = 0; col < COLS; col++) {
            const square = document.createElement("div");
            square.style.backgroundColor = COLORS[board[row][col]];
            gameBoard.appendChild(square);
          }
        }
      }

// Initialize the current piece
      function initCurrentPiece() {
        currentPiece.shape = [
          [1, 1],
          [1, 1]
        ];
        currentPiece.row = 0;
        currentPiece.col = Math.floor(COLS / 2) - 1;
        currentPiece.color = Math.floor(Math.random() * (COLORS.length - 1)) + 1;
      }

// Check if the current piece can move down
      function canMoveDown() {
        for (let row = currentPiece.row + 2; row >= currentPiece.row; row--) {
          for (let col = currentPiece.col; col < currentPiece.col + 2; col++) {
            if (currentPiece.shape[row - currentPiece.row][col - currentPiece.col] &&
                (row === ROWS || board[row][col])) {
              return false;
            }
          }
        }

return true;
      }

// Move the current piece down
      function moveDown() {
        if (canMoveDown()) {
          currentPiece.row++;
          renderGameBoard();
        }
      }

// Check if the current piece can move left
      function canMoveLeft() {
        for (let row = currentPiece.row; row < currentPiece.row + 2; row++) {
          for (let col = currentPiece.col - 1; col <= currentPiece.col; col++) {
            if (currentPiece.shape[row - currentPiece.row][col - currentPiece.col] &&
                (col < 0 || board[row][col])) {
              return false;
            }
          }
        }

return true;
      }

// Move the current piece left
      function moveLeft() {
        if (canMoveLeft()) {
          currentPiece.col--;
          renderGameBoard();
        }
      }

// Check if the current piece can move right
      function canMoveRight() {
        for (let row = currentPiece.row; row < currentPiece.row + 2; row++) {
          for (let col = currentPiece.col + 2; col <= currentPiece.col + 3; col++) {
            if (currentPiece.shape[row - currentPiece.row][col - currentPiece.col] &&
                (col >= COLS || board[row][col])) {
              return false;
            }
          }
        }

return true;
      }

// Move the current piece right
      function moveRight() {
        if (canMoveRight()) {
          currentPiece.col++;
          renderGameBoard();
        }
      }

// Rotate the current piece
      function rotate() {
        const rotatedShape = [
          [currentPiece.shape[1][0], currentPiece.shape[0][0]],
          [currentPiece.shape[1][1], currentPiece.shape[0][1]]
        ];

if (!collides(currentPiece.row, currentPiece.col, rotatedShape)) {
          currentPiece.shape = rotatedShape;
          renderGameBoard();
        }
      }

// Check if the current piece collides with anything at specified position
      function collides(row, col, shape) {
        for (let r = row; r < row + 2; r++) {
          for (let c = col; c < col + 2; c++) {
            if (shape[r - row][c - col] && (r >= ROWS || c < 0 || c >= COLS || board[r][c])) {
              return true;
            }
          }
        }

return false;
      }

// Place the current piece on the board
      function placePiece() {
        for (let row = currentPiece.row; row < currentPiece.row + 2; row++) {
          for (let col = currentPiece.col; col < currentPiece.col + 2; col++) {
            if (currentPiece.shape[row - currentPiece.row][col - currentPiece.col]) {
              board[row][col] = currentPiece.color;
            }
          }
        }
      }

// Clear the lines that are full
      function clearLines() {
        for (let row = ROWS - 1; row >= 0; row--) {
          if (board[row].every(square => square !== 0)) {
            board.splice(row, 1);
            board.unshift(new Array(COLS).fill(0));
          }
        }
      }

// Game loop
      function gameLoop() {
        if (canMoveDown()) {
          moveDown();
        } else {
          placePiece();
          clearLines();
          initCurrentPiece();
          if (collides(currentPiece.row, currentPiece.col, currentPiece.shape)) {
            alert("Game Over");
            initGameBoard();
          }
        }
      }

// Handle keyboard events
      function handleKeyDown(event) {
        switch (event.key) {
          case "ArrowDown":
            moveDown();
            break;
          case "ArrowLeft":
            moveLeft();
            break;
          case "ArrowRight":
            moveRight();
            break;
          case "ArrowUp":
            rotate();
            break;
        }
      }

// Initialize the game
      function initGame() {
        initGameBoard();
        initCurrentPiece();
        setInterval(gameLoop, 500);
        document.addEventListener("keydown", handleKeyDown);
      }

// Start the game
      initGame();
    </script>
  </body>
</html>