AI game creator

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

No:43175

←

Prev Next

→

Tetris
Developer User19127｜Date and time 24/2/14 18:51:13
Build time 19.668 sec｜Game capacity 6.958KB｜

Script

Sure! Here's a simple implementation of the Tetris game in a single HTML file using JavaScript:

To play the game, simply open the HTML file in a web browser (preferably on a smartphone for a better user experience). The game will start automatically, and you can control the falling Tetris shape using the arrow keys on your keyboard or on-screen controls on your smartphone. The objective is to complete lines by filling them with blocks and clearing them to earn points. The game ends when the blocks stack reaches the top. Enjoy playing Tetris!

←

Prev　Next

→ 　

Back　

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

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

Sure! Here's a simple implementation of the Tetris game in a single HTML file using JavaScript:

```html
<!DOCTYPE html>
<html>
<head>
    <title>Tetris</title>
    <style>
        #game-board {
            width: 200px;
            height: 400px;
            border: 2px solid black;
            position: relative;
        }
        .block {
            width: 19.6px;
            height: 19.6px;
            border: 1px solid lightgray;
            background-color: white;
            position: absolute;
        }
    </style>
</head>
<body>
    <div id="game-board"></div>

const shapes = [
            // List of Tetris shapes and their rotations
            [[1, 1, 1, 1]],                                 // I
            [[1, 1], [1, 1]],                               // O
            [[1, 1, 1], [0, 1, 0]],                         // T
            [[1, 1, 0], [0, 1, 1]],                         // S
            [[0, 1, 1], [1, 1, 0]],                         // Z
            [[1, 1, 1], [0, 0, 1]],                         // J
            [[1, 1, 1], [1, 0, 0]],                         // L
        ];

let gameBoard = [];
        let currentShape;
        let currentX;
        let currentY;

initializeGameBoard();

function createNewShape() {
            const randomShape = Math.floor(Math.random() * shapes.length);
            const randomRotation = Math.floor(Math.random() * shapes[randomShape].length);

currentShape = shapes[randomShape][randomRotation];
            currentX = Math.floor(boardWidth / 2) - Math.floor(currentShape[0].length / 2);
            currentY = 0;
        }

function draw() {
            const gameBoardElement = document.getElementById("game-board");
            gameBoardElement.innerHTML = "";

for (let y = 0; y < boardHeight; y++) {
                for (let x = 0; x < boardWidth; x++) {
                    if (gameBoard[y][x] === 1) {
                        const blockElement = document.createElement("div");
                        blockElement.className = "block";
                        blockElement.style.left = x * blockSize + "px";
                        blockElement.style.top = y * blockSize + "px";
                        gameBoardElement.appendChild(blockElement);
                    }
                }
            }
        }

for (let i = linesToRemove.length - 1; i >= 0; i--) {
                const lineToRemove = linesToRemove[i];
                gameBoard.splice(lineToRemove, 1);
                gameBoard.unshift(new Array(boardWidth).fill(0));
            }
        }

document.addEventListener("keydown", handleKeyDown);

draw();
        }

function rotateShape(shape) {
            const newRowLength = shape[0].length;
            const newColLength = shape.length;
            const rotatedShape = Array.from({ length: newColLength }, () => Array(newRowLength).fill(0));

for (let row = 0; row < shape.length; row++) {
                for (let col = 0; col < shape[row].length; col++) {
                    rotatedShape[col][shape.length - 1 - row] = shape[row][col];
                }
            }

return rotatedShape;
        }

setInterval(function () {
            moveDown();
            draw();
        }, 1000);

</script>
</body>
</html>
```