AI game creator

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

No:15960

←

Prev Next

→

Un tetris con dados
Developer User3408｜Date and time 23/9/14 6:34:33
Build time 87.182 sec｜Game capacity 9.845KB｜

Script

←

Prev　Next

→ 　

Back　

[PR]現在のプレゼントランキング

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

<!DOCTYPE html>
<html>
<head>
    <title>Tetris con Dados</title>
    <style>
        body {
            font-family: Arial, sans-serif;
            text-align: center;
            margin-top: 20px;
        }
        
        canvas {
            border: 1px solid black;
            margin: 0 auto;
        }
    </style>
</head>
<body>
    <canvas id="tetrisCanvas" width="240" height="400"></canvas>

// Piezas de Tetris
        var pieces = [
            {
                shape: [
                    [1, 1, 1, 1]
                ],
                color: "#FF0000"
            },
            {
                shape: [
                    [1, 1],
                    [1, 1]
                ],
                color: "#00FF00"
            },
            {
                shape: [
                    [1, 1, 0],
                    [0, 1, 1]
                ],
                color: "#0000FF"
            },
            {
                shape: [
                    [0, 1, 1],
                    [1, 1, 0]
                ],
                color: "#FFFF00"
            },
            {
                shape: [
                    [1, 1, 1],
                    [0, 1, 0]
                ],
                color: "#FF00FF"
            }
        ];

// Inicializar el juego
        function initialize() {
            canvas = document.getElementById("tetrisCanvas");
            context = canvas.getContext("2d");
            blockSize = canvas.width / 10;

// Crear el tablero
            board = [];
            for (var row = 0; row < 20; row++) {
                board[row] = [];
                for (var col = 0; col < 10; col++) {
                    board[row][col] = "white";
                }
            }

drawBoard();
            generateNewPiece();
            intervalId = setInterval(movePieceDown, 1000);
        }

// Dibujar el tablero
        function drawBoard() {
            for (var row = 0; row < 20; row++) {
                for (var col = 0; col < 10; col++) {
                    context.fillStyle = board[row][col];
                    context.fillRect(col * blockSize, row * blockSize, blockSize, blockSize);
                }
            }
        }

// Generar nueva pieza de Tetris
        function generateNewPiece() {
            var randomPiece = pieces[Math.floor(Math.random() * pieces.length)];
            var randomX = Math.floor(Math.random() * (10 - randomPiece.shape[0].length + 1));

currentPiece = {
                shape: randomPiece.shape,
                color: randomPiece.color,
                x: randomX,
                y: 0
            };

drawPiece(currentPiece);
        }

// Dibujar una pieza en el tablero
        function drawPiece(piece) {
            for (var row = 0; row < piece.shape.length; row++) {
                for (var col = 0; col < piece.shape[row].length; col++) {
                    if (piece.shape[row][col]) {
                        context.fillStyle = piece.color;
                        context.fillRect((piece.x + col) * blockSize, (piece.y + row) * blockSize, blockSize, blockSize);
                    }
                }
            }
        }

// Mover la pieza hacia abajo
        function movePieceDown() {
            if (canMoveDown()) {
                erasePiece(currentPiece);
                currentPiece.y++;
                drawPiece(currentPiece);
            } else {
                placePieceOnBoard();
                checkLines();
                generateNewPiece();
            }
        }

// Mover la pieza hacia la izquierda
        function movePieceLeft() {
            if (canMoveLeft()) {
                erasePiece(currentPiece);
                currentPiece.x--;
                drawPiece(currentPiece);
            }
        }

// Mover la pieza hacia la derecha
        function movePieceRight() {
            if (canMoveRight()) {
                erasePiece(currentPiece);
                currentPiece.x++;
                drawPiece(currentPiece);
            }
        }

// Rotar la pieza
        function rotatePiece() {
            var newShape = [];
            var oldShape = currentPiece.shape;
            var size = oldShape.length;

for (var row = 0; row < size; row++) {
                newShape[row] = [];
                for (var col = 0; col < size; col++) {
                    newShape[row][col] = oldShape[size - col - 1][row];
                }
            }

if (isValidMove(currentPiece.x, currentPiece.y, newShape)) {
                erasePiece(currentPiece);
                currentPiece.shape = newShape;
                drawPiece(currentPiece);
            }
        }

// Verificar si la pieza puede moverse hacia abajo
        function canMoveDown() {
            for (var row = 0; row < currentPiece.shape.length; row++) {
                for (var col = 0; col < currentPiece.shape[row].length; col++) {
                    if (currentPiece.shape[row][col]) {
                        if (currentPiece.y + row === 19 || board[currentPiece.y + row + 1][currentPiece.x + col] !== "white") {
                            return false;
                        }
                    }
                }
            }
            return true;
        }

// Verificar si la pieza puede moverse hacia la izquierda
        function canMoveLeft() {
            for (var row = 0; row < currentPiece.shape.length; row++) {
                for (var col = 0; col < currentPiece.shape[row].length; col++) {
                    if (currentPiece.shape[row][col]) {
                        if (currentPiece.x + col === 0 || board[currentPiece.y + row][currentPiece.x + col - 1] !== "white") {
                            return false;
                        }
                    }
                }
            }
            return true;
        }

// Verificar si la pieza puede moverse hacia la derecha
        function canMoveRight() {
            for (var row = 0; row < currentPiece.shape.length; row++) {
                for (var col = 0; col < currentPiece.shape[row].length; col++) {
                    if (currentPiece.shape[row][col]) {
                        if (currentPiece.x + col === 9 || board[currentPiece.y + row][currentPiece.x + col + 1] !== "white") {
                            return false;
                        }
                    }
                }
            }
            return true;
        }

// Verificar si el movimiento es válido
        function isValidMove(x, y, shape) {
            for (var row = 0; row < shape.length; row++) {
                for (var col = 0; col < shape[row].length; col++) {
                    if (shape[row][col]) {
                        if (
                            y + row < 0 || y + row >= 20 ||
                            x + col < 0 || x + col >= 10 ||
                            board[y + row][x + col] !== "white"
                        ) {
                            return false;
                        }
                    }
                }
            }
            return true;
        }

// Borrar una pieza del tablero
        function erasePiece(piece) {
            for (var row = 0; row < piece.shape.length; row++) {
                for (var col = 0; col < piece.shape[row].length; col++) {
                    if (piece.shape[row][col]) {
                        context.clearRect((piece.x + col) * blockSize, (piece.y + row) * blockSize, blockSize, blockSize);
                    }
                }
            }
        }

// Colocar una pieza en el tablero
        function placePieceOnBoard() {
            for (var row = 0; row < currentPiece.shape.length; row++) {
                for (var col = 0; col < currentPiece.shape[row].length; col++) {
                    if (currentPiece.shape[row][col]) {
                        board[currentPiece.y + row][currentPiece.x + col] = currentPiece.color;
                    }
                }
            }
        }

// Verificar si hay líneas completadas y borrarlas
        function checkLines() {
            var linesCleared = 0;

for (var row = 19; row >= 0; row--) {
                var lineIsComplete = true;
                for (var col = 0; col < 10; col++) {
                    if (board[row][col] === "white") {
                        lineIsComplete = false;
                        break;
                    }
                }

if (lineIsComplete) {
                    linesCleared++;
                    board.splice(row, 1);
                    board.unshift([]);
                    for (var i = 0; i < 10; i++) {
                        board[0][i] = "white";
                    }
                }
            }

if (linesCleared > 0) {
                clearInterval(intervalId);
                intervalId = setInterval(movePieceDown, 1000 - (linesCleared * 100));
            }
        }

// Manejar las teclas presionadas
        document.addEventListener("keydown", function (event) {
            if (event.keyCode === 37) { // Flecha izquierda
                movePieceLeft();
            } else if (event.keyCode === 39) { // Flecha derecha
                movePieceRight();
            } else if (event.keyCode === 40) { // Flecha abajo
                movePieceDown();
            } else if (event.keyCode === 38) { // Flecha arriba
                rotatePiece();
            }
        });

// Ejecutar el juego al cargar la página
        initialize();
    </script>
</body>
</html>