AI game creator

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

No:13781

104

←

Prev Next

→

Tetris
Developer User6025｜Date and time 23/8/30 0:49:58
Build time 50.677 sec｜Game capacity 6.769KB｜

Script

Sure! Here's a single HTML file implementation of the classic game Tetris using JavaScript and pictograms:

To play the game, simply copy the code into a new HTML file and open it in a web browser on your smartphone. Use the arrow keys to move the Tetris pieces, and try to clear as many rows as possible. Enjoy your game of Tetris!

←

Prev　Next

→ 　

Back　

[PR]現在の人気グッズランキング

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

Sure! Here's a single HTML file implementation of the classic game Tetris using JavaScript and pictograms:

```html
<!DOCTYPE html>
<html>
  <head>
    <title>Tetris</title>
    <style>
      body {
        text-align: center;
        overflow: hidden;
      }

canvas {
        border: 1px solid #000;
        background: #000;
      }
    </style>
  </head>

// Create the Tetris grid
      const grid = [];
      const gridSize = 20;
      const rows = 20;
      const columns = 10;

for (let row = 0; row < rows; row++) {
        grid[row] = [];
        for (let col = 0; col < columns; col++) {
          grid[row][col] = 0;
        }
      }

// Tetris game state
      let currentShape;
      let currentX;
      let currentY;
      let score = 0;
      let gameSpeed = 500;
      let gameInterval;

// Get random Tetris shape
      function getRandomShape() {
        const shapeId = Math.floor(Math.random() * shapes.length);
        return shapes[shapeId];
      }

// Rotate a Tetris shape
      function rotateShape(shape) {
        const rotatedShape = [];
        const shapeWidth = shape[0].length;
        const shapeHeight = shape.length;

for (let col = 0; col < shapeWidth; col++) {
          rotatedShape[col] = [];
          for (let row = 0; row < shapeHeight; row++) {
            rotatedShape[col][row] = shape[row][col];
          }
        }

return rotatedShape.reverse();
      }

// Check if a position is valid for the current Tetris shape
      function isValidPosition(newShape, newX, newY) {
        for (let row = 0; row < newShape.length; row++) {
          for (let col = 0; col < newShape[row].length; col++) {
            if (newShape[row][col] && (newX + col >= columns || newX + col < 0 || newY + row >= rows || grid[newY + row][newX + col])) {
              return false;
            }
          }
        }

return true;
      }

// Place the current Tetris shape onto the grid
      function placeShape() {
        for (let row = 0; row < currentShape.length; row++) {
          for (let col = 0; col < currentShape[row].length; col++) {
            if (currentShape[row][col]) {
              grid[currentY + row][currentX + col] = 1;
            }
          }
        }
      }

// Clear completed rows and update score
      function clearRowsAndUpdateScore() {
        let rowCount = 0;

for (let row = rows - 1; row >= 0; row--) {
          if (grid[row].every((cell) => cell)) {
            grid.splice(row, 1);
            grid.unshift(Array(columns).fill(0));
            rowCount++;
          }
        }

// Update score
        const points = [0, 40, 100, 300, 1200];
        score += points[rowCount];
      }

// Move the Tetris shape down
      function moveDown() {
        if (isValidPosition(currentShape, currentX, currentY + 1)) {
          currentY++;
        } else {
          placeShape();
          clearRowsAndUpdateScore();
          if (gameOver()) {
            clearInterval(gameInterval);
            alert(`Game Over!\nYour Score: ${score}`);
            location.reload();
          } else {
            spawnShape();
          }
        }
      }

// Move the Tetris shape left
      function moveLeft() {
        if (isValidPosition(currentShape, currentX - 1, currentY)) {
          currentX--;
        }
      }

// Move the Tetris shape right
      function moveRight() {
        if (isValidPosition(currentShape, currentX + 1, currentY)) {
          currentX++;
        }
      }

// Rotate the Tetris shape
      function rotate() {
        const rotatedShape = rotateShape(currentShape);
        if (isValidPosition(rotatedShape, currentX, currentY)) {
          currentShape = rotatedShape;
        }
      }

// Spawn a new Tetris shape
      function spawnShape() {
        currentShape = getRandomShape();
        currentX = Math.floor(columns / 2) - Math.floor(currentShape[0].length / 2);
        currentY = 0;

if (!isValidPosition(currentShape, currentX, currentY)) {
          clearInterval(gameInterval);
          alert(`Game Over!\nYour Score: ${score}`);
          location.reload();
        }
      }

// Check if game is over
      function gameOver() {
        return grid[0].some((cell) => cell);
      }

// Draw the Tetris grid
      function drawGrid() {
        const canvas = document.getElementById('tetris');
        const ctx = canvas.getContext('2d');
        ctx.clearRect(0, 0, canvas.width, canvas.height);

for (let row = 0; row < rows; row++) {
          for (let col = 0; col < columns; col++) {
            if (grid[row][col]) {
              const x = col * gridSize;
              const y = row * gridSize;
              ctx.fillStyle = '#FF0000'; // Pictogram color
              ctx.fillRect(x, y, gridSize, gridSize);
            }
          }
        }

// Draw the current shape
        for (let row = 0; row < currentShape.length; row++) {
          for (let col = 0; col < currentShape[row].length; col++) {
            if (currentShape[row][col]) {
              const x = (currentX + col) * gridSize;
              const y = (currentY + row) * gridSize;
              ctx.fillStyle = '#FFFF00'; // Pictogram color
              ctx.fillRect(x, y, gridSize, gridSize);
            }
          }
        }
      }

// Initialize and start the game
      function startGame() {
        spawnShape();
        drawGrid();
        gameInterval = setInterval(() => {
          moveDown();
          drawGrid();
        }, gameSpeed);
      }

// Start the game when the page loads
      window.onload = startGame();
    </script>
  </body>
</html>
```