AI game creator

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

No:17339

109

←

Prev Next

→

Tetris And lava
Developer User7638｜Date and time 23/9/23 5:42:11
Build time 61.703 sec｜Game capacity 5.863KB｜

Script

Sure! Here's a simple implementation of Tetris game with a lava twist using HTML, JavaScript, and pictograms. Please note that this code is a simplified version and may not include all the features of a complete Tetris game.

This is a basic implementation of Tetris where you control the falling blocks with arrow keys. The objective is to create lines and clear them from the board to score points. If the blocks reach the top of the screen, it's game over. The drop speed of the blocks increases as you clear more lines.

←

Prev　Next

→ 　

Back　

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

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

```html
<!DOCTYPE html>
<html>
<head>
  <title>Tetris & Lava</title>
  <style>
    canvas {
      border: 1px solid black;
    }
  </style>
</head>
<body>
  <canvas id="tetrisCanvas" width="240" height="480"></canvas>
  <script>
    const canvas = document.getElementById('tetrisCanvas');
    const context = canvas.getContext('2d');
    const blockSize = 30;
    const columns = canvas.width / blockSize;
    const rows = canvas.height / blockSize;

const tetrominoes = {
      L: [
        [1, 0],
        [1, 0],
        [1, 1]
      ],
      T: [
        [1, 1, 1],
        [0, 1, 0]
      ],
      S: [
        [0, 1, 1],
        [1, 1, 0]
      ],
      Z: [
        [1, 1, 0],
        [0, 1, 1]
      ],
      I: [
        [1],
        [1],
        [1],
        [1]
      ],
      O: [
        [1, 1],
        [1, 1]
      ],
    };

function createMatrix(width, height) {
      const matrix = [];
      for (let i = 0; i < height; i++) {
        matrix.push(Array(width).fill(0));
      }
      return matrix;
    }

function draw() {
      context.clearRect(0, 0, canvas.width, canvas.height);
      drawMatrix(matrix, 0, 0);
      drawMatrix(currentPiece, pieceX, pieceY);
    }

function rotate(piece) {
      const rotatedPiece = [];
      const pieceWidth = piece[0].length;
      const pieceHeight = piece.length;

for (let rowIndex = 0; rowIndex < pieceWidth; rowIndex++) {
        rotatedPiece.push([]);
        for (let colIndex = 0; colIndex < pieceHeight; colIndex++) {
          rotatedPiece[rowIndex][colIndex] = piece[colIndex][pieceWidth - rowIndex - 1];
        }
      }

return rotatedPiece;
    }

function rotatePiece() {
      const oldPiece = currentPiece;
      currentPiece = rotate(currentPiece);
      if (collide(matrix, currentPiece, pieceX, pieceY)) {
        currentPiece = oldPiece;
      }
    }

function movePiece(moveX) {
      pieceX += moveX;
      if (collide(matrix, currentPiece, pieceX, pieceY)) {
        pieceX -= moveX;
      }
    }

function dropPiece() {
      pieceY++;
      if (collide(matrix, currentPiece, pieceX, pieceY)) {
        pieceY--;
        mergeMatrix(matrix, currentPiece, pieceX, pieceY);
        resetPosition();
        checkForLines();
      }
    }

function resetPosition() {
      currentPiece = randomPiece();
      pieceX = Math.floor(columns / 2) - Math.floor(currentPiece[0].length / 2);
      pieceY = 0;
      if (collide(matrix, currentPiece, pieceX, pieceY)) {
        // Game over handling
        alert('Game Over!');
        matrix.forEach(row => row.fill(0));
      }
    }

function randomPiece() {
      const pieceKeys = Object.keys(tetrominoes);
      const randomKey = pieceKeys[Math.floor(Math.random() * pieceKeys.length)];
      return tetrominoes[randomKey];
    }

// Score update or other additional logic can be added here

return linesCleared;
    }

let lastTime = 0;
    let dropSpeed = 1000;
    let matrix = createMatrix(columns, rows);
    let currentPiece = randomPiece();
    let pieceX = Math.floor(columns / 2) - Math.floor(currentPiece[0].length / 2);
    let pieceY = 0;

function update(time = 0) {
      const deltaTime = time - lastTime;
      lastTime = time;

dropSpeed = Math.max(100, 1000 - (linesCleared * 100)); // Increase drop speed based on lines cleared

if (deltaTime >= dropSpeed) {
        dropPiece();
      }

draw();
      requestAnimationFrame(update);
    }

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