AI game creator

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

No:17555

←

Prev Next

→

テトリス
Developer User7716｜Date and time 23/9/23 22:14:50
Build time 82.81 sec｜Game capacity 7.779KB｜

Script

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋ゲームランキング

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

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

canvas {
            border: 2px solid #FFF;
        }
    </style>
</head>
<body>
    <canvas id="tetris" width="240" height="400"></canvas>

function rotate(matrix, dir) {
            for (let y = 0; y < matrix.length; ++y) {
                for (let x = 0; x < y; ++x) {
                    [
                        matrix[x][y],
                        matrix[y][x],
                    ] = [
                        matrix[y][x],
                        matrix[x][y],
                    ];
                }
            }

if (dir > 0) {
                matrix.forEach(row => row.reverse());
            } else {
                matrix.reverse();
            }
        }

function playerDrop() {
            player.pos.y++;
            if (collide(matrix, player)) {
                player.pos.y--;
                merge(matrix, player);
                playerReset();
                arenaSweep();
                updateScore();
            }
            dropCounter = 0;
        }

function playerMove(dir) {
            player.pos.x += dir;
            if (collide(matrix, player)) {
                player.pos.x -= dir;
            }
        }

function playerReset() {
            const pieces = 'ILJOTSZ';
            player.matrix = createPiece(pieces[pieces.length * Math.random() | 0]);
            player.pos.y = 0;
            player.pos.x = (matrix[0].length / 2 | 0) -
                            (player.matrix[0].length / 2 | 0);
            if (collide(matrix, player)) {
                matrix.forEach(row => row.fill(0));
                player.score = 0;
                updateScore();
            }
        }

function updateScore() {
            document.getElementById('score').innerText = player.score;
        }

let dropCounter = 0;
        let dropInterval = 1000;
        let lastTime = 0;

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

dropCounter += deltaTime;
            if (dropCounter > dropInterval) {
                playerDrop();
            }

draw();
            requestAnimationFrame(update);
        }

function draw() {
            context.fillStyle = '#000';
            context.fillRect(0, 0, canvas.width, canvas.height);

drawMatrix(matrix, {x: 0, y: 0}, context);
            drawMatrix(player.matrix, player.pos, context);
        }

const canvas = document.getElementById('tetris');
        const context = canvas.getContext('2d');

const matrix = createMatrix(12, 20);

const player = {
            pos: {x: 0, y: 0},
            matrix: null,
            score: 0,
        };

playerReset();
        updateScore();
        update();
    </script>
</body>
</html>