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

No:39453

Juego de el piso es lava de un fantasma
Developer User17653｜Date and time 24/1/28 14:26:31
Build time 18.163 sec｜Game capacity 5.536KB｜

Script

Juego de "El piso es lava" con un fantasma

←

Prev　Next

→ 　

Back　

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

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

<!DOCTYPE html>
<html>
<head>
    <title>Juego de "El piso es lava" con un fantasma</title>
</head>
<body>
    <h1>Juego de "El piso es lava" con un fantasma</h1>
    
    <canvas id="gameCanvas" width="400" height="400"></canvas>
    
    <script>
        // Obtener el canvas y el contexto del juego
        var canvas = document.getElementById("gameCanvas");
        var context = canvas.getContext("2d");
        
        // Crear el objeto del jugador (fantasma)
        var player = {
            x: canvas.width / 2,
            y: canvas.height / 2,
            radius: 20,
            color: "blue"
        };
        
        // Variable para indicar si el jugador está en el piso o no
        var isOnLava = false;
        
        // Función para dibujar el jugador en el canvas
        function drawPlayer() {
            context.beginPath();
            context.arc(player.x, player.y, player.radius, 0, Math.PI * 2);
            context.fillStyle = player.color;
            context.fill();
            context.closePath();
        }
        
        // Función para dibujar el piso
        function drawLava() {
            context.fillStyle = "red";
            context.fillRect(0, canvas.height - 50, canvas.width, 50);
        }
        
        // Función para verificar si el jugador está en el piso o no
        function checkPlayerPosition() {
            if (player.y + player.radius >= canvas.height - 50) {
                isOnLava = true;
            } else {
                isOnLava = false;
            }
        }
        
        // Función para mover al jugador hacia arriba
        function moveUp() {
            player.y -= 10;
        }
        
        // Función para mover al jugador hacia abajo
        function moveDown() {
            player.y += 10;
        }
        
        // Función para mover al jugador hacia la izquierda
        function moveLeft() {
            player.x -= 10;
        }
        
        // Función para mover al jugador hacia la derecha
        function moveRight() {
            player.x += 10;
        }
        
        // Función para dibujar en el canvas y actualizar el juego
        function draw() {
            // Limpiar el canvas
            context.clearRect(0, 0, canvas.width, canvas.height);
            
            // Dibujar el piso
            drawLava();
            
            // Dibujar el jugador
            drawPlayer();
            
            // Verificar la posición del jugador
            checkPlayerPosition();
            
            // Si el jugador está en el piso, mostrar mensaje de victoria
            if (isOnLava) {
                context.font = "30px Arial";
                context.fillStyle = "white";
                context.fillText("¡Ganaste!", canvas.width / 2 - 70, canvas.height / 2);
            }
            
            // Solicitar animación
            requestAnimationFrame(draw);
        }
        
        // Event listeners para las teclas
        document.addEventListener("keydown", keyDownHandler, false);
        document.addEventListener("keyup", keyUpHandler, false);
        
        // Variables para mantener el estado de las teclas
        var upKeyPressed = false;
        var downKeyPressed = false;
        var leftKeyPressed = false;
        var rightKeyPressed = false;
        
        // Función para detectar cuando se presiona una tecla
        function keyDownHandler(event) {
            if (event.keyCode === 38) { // Tecla de flecha hacia arriba
                upKeyPressed = true;
            } else if (event.keyCode === 40) { // Tecla de flecha hacia abajo
                downKeyPressed = true;
            } else if (event.keyCode === 37) { // Tecla de flecha hacia la izquierda
                leftKeyPressed = true;
            } else if (event.keyCode === 39) { // Tecla de flecha hacia la derecha
                rightKeyPressed = true;
            }
        }
        
        // Función para detectar cuando se suelta una tecla
        function keyUpHandler(event) {
            if (event.keyCode === 38) { // Tecla de flecha hacia arriba
                upKeyPressed = false;
            } else if (event.keyCode === 40) { // Tecla de flecha hacia abajo
                downKeyPressed = false;
            } else if (event.keyCode === 37) { // Tecla de flecha hacia la izquierda
                leftKeyPressed = false;
            } else if (event.keyCode === 39) { // Tecla de flecha hacia la derecha
                rightKeyPressed = false;
            }
        }
        
        // Función para mover al jugador según las teclas presionadas
        function movePlayer() {
            if (upKeyPressed) {
                moveUp();
            }
            
            if (downKeyPressed) {
                moveDown();
            }
            
            if (leftKeyPressed) {
                moveLeft();
            }
            
            if (rightKeyPressed) {
                moveRight();
            }
        }
        
        // Función principal del juego
        function startGame() {
            // Solicitar animación
            requestAnimationFrame(draw);
            
            // Mover al jugador según las teclas presionadas
            movePlayer();
        }
        
        // Iniciar el juego
        startGame();
    </script>
</body>
</html>