AI game creator

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

No:36896

←

Prev Next

→

Tetris
Developer User16914｜Date and time 24/1/19 6:06:16
Build time 22.482 sec｜Game capacity 5.635KB｜

Script

Sure, here's a simplified version of Tetris implemented as a single HTML file using JavaScript:

To play the game, open the HTML file in a web browser, and you'll be able to control the Tetromino using the left, right, and down arrow keys on your smartphone's virtual keyboard. Enjoy!

←

Prev　Next

→ 　

Back　

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

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

Sure, here's a simplified version of Tetris implemented as a single HTML file using JavaScript:

```html
<!DOCTYPE html>
<html>
<head>
  <title>Tetris</title>
  <style>
    body {
      background-color: #000;
      display: flex;
      justify-content: center;
      align-items: center;
      height: 100vh;
      margin: 0;
    }

#game-board {
      background-color: #222;
      border: 2px solid #666;
      width: 220px;
      height: 440px;
      display: grid;
      grid-template-columns: repeat(10, 1fr);
      grid-template-rows: repeat(20, 1fr);
    }

.block {
      width: 100%;
      height: 100%;
      background-color: #444;
      border: 1px solid #666;
    }

.active {
      background-color: #777;
    }

.filled {
      background-color: #ccc;
    }
  </style>
</head>
<body>
  <div id="game-board"></div>

function createTetromino() {
        const tetrominos = [
          [
            [1, 1, 1, 1],
          ],
          [
            [1, 1],
            [1, 1],
          ],
          [
            [1, 1, 0],
            [0, 1, 1],
          ],
          [
            [0, 1, 1],
            [1, 1, 0],
          ],
          [
            [1, 0, 0],
            [1, 1, 1],
          ],
          [
            [0, 0, 1],
            [1, 1, 1],
          ],
          [
            [1, 1, 1],
            [0, 0, 1],
          ],
        ];
        const randomTetromino = tetrominos[Math.floor(Math.random() * tetrominos.length)];
        currentPosition = { x: 4, y: 0 };
        tetromino = randomTetromino;
      }

function draw() {
        board.innerHTML = '';

for (let y = 0; y < blockCount; y++) {
          for (let x = 0; x < blockWidth; x++) {
            const block = document.createElement('div');
            block.classList.add('block');
            if (
              tetromino &&
              y >= currentPosition.y &&
              y < currentPosition.y + tetromino.length &&
              x >= currentPosition.x &&
              x < currentPosition.x + tetromino[0].length &&
              tetromino[y - currentPosition.y][x - currentPosition.x] === 1
            ) {
              block.classList.add('active');
            }
            board.appendChild(block);
          }
        }
      }

function removeRows() {
        let rowCount = 0;
        for (let y = blockCount - 1; y >= 0; y--) {
          let rowComplete = true;
          for (let x = 0; x < blockWidth; x++) {
            if (!board.children[y * blockWidth + x].classList.contains('filled')) {
              rowComplete = false;
              break;
            }
          }

if (rowComplete) {
            rowCount++;
            for (let i = y * blockWidth; i < (y + 1) * blockWidth; i++) {
              board.children[i].classList.remove('filled');
            }
          } else if (rowCount > 0) {
            for (let i = y * blockWidth; i < (y + 1) * blockWidth; i++) {
              if (board.children[i].classList.contains('filled')) {
                board.children[i].classList.remove('filled');
                board.children[i + rowCount * blockWidth].classList.add('filled');
              }
            }
          }
        }
      }

createTetromino();
      draw();
      timer = setInterval(moveDown, 1000);
    });
  </script>
</body>
</html>
```

To play the game, open the HTML file in a web browser, and you'll be able to control the Tetromino using the left, right, and down arrow keys on your smartphone's virtual keyboard. Enjoy!