AI game creator

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

No:30451

←

Prev Next

→

テトリス999
Developer User13711｜Date and time 23/12/21 23:09:20
Build time 64.424 sec｜Game capacity 7.378KB｜

Script

了解しました。以下にテトリス999というゲームのプログラムの例を示します。

このプログラムは簡素なテトリスゲームを実装しています。スクリプトタグで囲まれたJavaScriptのコードがゲームのロジックを記述しています。HTMLのdiv要素を使って盤面を描画し、テトリミノの形状を動かす処理なども実装されています。スマートフォンで操作することも可能です。ただし、絵文字の利用やスマホ専用の操作に対応するためのレスポンシブデザインは省略しておりますので、必要に応じて追加してください。

←

Prev　Next

→ 　

Back　

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

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

了解しました。以下にテトリス999というゲームのプログラムの例を示します。

```html
<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>Tetris 999</title>
  <style>
    #game-board {
      display: grid;
      grid-template-columns: repeat(10, 40px);
      grid-template-rows: repeat(20, 40px);
      gap: 1px;
      background-color: #333;
    }
    .cell {
      background-color: #ddd;
    }
  </style>
</head>
<body>
  <div id="game-board"></div>

// ゲーム開始時に初期化を行う関数
    function startGame() {
      for (let row = 0; row < boardHeight; row++) {
        board[row] = Array(boardWidth).fill(0);
      }
      drawBoard();
      drawShape();
    }

// 盤面の状態を描画する関数
    function drawBoard() {
      const gameBoard = document.getElementById("game-board");
      gameBoard.innerHTML = "";
      for (let row = 0; row < boardHeight; row++) {
        for (let col = 0; col < boardWidth; col++) {
          const cell = document.createElement("div");
          cell.className = "cell";
          if (board[row][col] !== 0) {
            cell.textContent = colors[board[row][col] - 1];
          }
          gameBoard.appendChild(cell);
        }
      }
    }

// テトリミノの形状を描画する関数
    function drawShape() {
      const gameBoard = document.getElementById("game-board");
      for (let row = 0; row < currentShape.length; row++) {
        for (let col = 0; col < currentShape[row].length; col++) {
          if (currentShape[row][col] === 1) {
            const cell = document.createElement("div");
            cell.className = "cell";
            cell.style.top = `${(currentY + row) * cellSize}px`;
            cell.style.left = `${(currentX + col) * cellSize}px`;
            cell.textContent = colors[shapes.indexOf(currentShape)];
            gameBoard.appendChild(cell);
          }
        }
      }
    }

// テトリミノを移動する関数
    function moveShape(dirX, dirY) {
      eraseShape();
      currentX += dirX;
      currentY += dirY;
      if (isCollision()) {
        currentX -= dirX;
        currentY -= dirY;
      }
      drawShape();
    }

// テトリミノを消去する関数
    function eraseShape() {
      const gameBoard = document.getElementById("game-board");
      const cells = gameBoard.getElementsByClassName("cell");
      while (cells[0]) {
        cells[0].parentNode.removeChild(cells[0]);
      }
    }

// テトリミノが盤面と衝突しているか判定する関数
    function isCollision() {
      for (let row = 0; row < currentShape.length; row++) {
        for (let col = 0; col < currentShape[row].length; col++) {
          if (
            currentShape[row][col] === 1 &&
            (board[currentY + row] && board[currentY + row][currentX + col]) !== 0
          ) {
            return true;
          }
        }
      }
      return false;
    }

// 盤面にテトリミノを固定する関数
    function fixShape() {
      for (let row = 0; row < currentShape.length; row++) {
        for (let col = 0; col < currentShape[row].length; col++) {
          if (currentShape[row][col] === 1) {
            board[currentY + row][currentX + col] = shapes.indexOf(currentShape) + 1;
          }
        }
      }
    }

// 次のテトリミノを取得する関数
    function getRandomShape() {
      const randomIndex = Math.floor(Math.random() * shapes.length);
      return shapes[randomIndex];
    }

// 盤面がいっぱいになったか判定する関数
    function isFull() {
      for (let col = 0; col < boardWidth; col++) {
        if (board[0][col] !== 0) {
          return true;
        }
      }
      return false;
    }

// 盤面を消去する関数
    function clearBoard() {
      for (let row = 0; row < boardHeight; row++) {
        for (let col = 0; col < boardWidth; col++) {
          board[row][col] = 0;
        }
      }
    }

// テトリミノを回転する関数
    function rotateShape() {
      const rotatedShape = [];
      for (let col = 0; col < currentShape[0].length; col++) {
        const newRow = [];
        for (let row = currentShape.length - 1; row >= 0; row--) {
          newRow.push(currentShape[row][col]);
        }
        rotatedShape.push(newRow);
      }
      eraseShape();
      currentShape = rotatedShape;
      if (isCollision()) {
        eraseShape();
        currentShape = shapes[shapes.indexOf(currentShape) - 1];
      }
      drawShape();
    }

// 指定した行が揃ったか判定する関数
    function isRowFull(row) {
      for (let col = 0; col < boardWidth; col++) {
        if (board[row][col] === 0) {
          return false;
        }
      }
      return true;
    }

// 揃った行を削除する関数
    function removeFullRows() {
      let removedCount = 0;
      for (let row = boardHeight - 1; row >= 0; row--) {
        if (isRowFull(row)) {
          board.splice(row, 1);
          board.unshift(Array(boardWidth).fill(0));
          removedCount++;
        }
      }
      return removedCount;
    }

// ゲームオーバーの処理を行う関数
    function gameOver() {
      alert("Game Over");
      clearBoard();
      drawBoard();
      startGame();
    }

// ゲームのメインループ
    function gameLoop() {
      moveShape(0, 1);
      if (isCollision()) {
        fixShape();
        const removedRows = removeFullRows();
        if (isFull()) {
          gameOver();
          return;
        }
        currentShape = getRandomShape();
        currentX = Math.floor(boardWidth / 2);
        currentY = 0;
        drawShape();
      }
      drawBoard();
      setTimeout(gameLoop, 1000);
    }

startGame();
    document.addEventListener("keydown", function(event) {
      switch (event.key) {
        case "ArrowLeft":
          moveShape(-1, 0);
          break;
        case "ArrowRight":
          moveShape(1, 0);
          break;
        case "ArrowDown":
          moveShape(0, 1);
          break;
        case "ArrowUp":
          rotateShape();
          break;
      }
    });

gameLoop();
  </script>
</body>
</html>
```