Realiza un juego en el cual eres una webcam esférica, y tienes que pasarte un mundo plataformas para reactivar la electricidad's game

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

No:27672

←

Prev Next

→

Realiza un juego en el cual eres una webcam esféri..ALL
Developer User13749｜Date and time 23/12/8 5:25:12
Build time 17.105 sec｜Game capacity 2.794KB｜

Script

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋アプリランキング

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

<!DOCTYPE html>
<html>
<body>
    <canvas id="gameCanvas" width="480" height="320"></canvas>
    <script>
        // Set up the canvas and context
        var canvas = document.getElementById("gameCanvas");
        var context = canvas.getContext("2d");

// Define the spherical webcam
        var webcam = {
            x: 50,
            y: 250,
            width: 30,
            height: 30,
            speed: 5
        };

// Define the platform
        var platform = {
            x: 200,
            y: 200,
            width: 100,
            height: 30
        };

// Define the game status
        var gameStatus = "play"; // play, win, lose

// Main game loop
        function gameLoop() {
            context.clearRect(0, 0, canvas.width, canvas.height);

// Draw the webcam
            context.fillStyle = "blue";
            context.fillRect(webcam.x, webcam.y, webcam.width, webcam.height);

// Draw the platform
            context.fillStyle = "gray";
            context.fillRect(platform.x, platform.y, platform.width, platform.height);

// Update the game logic
            if (gameStatus === "play") {
                // Move the webcam
                if (webcam.x < canvas.width - webcam.width && webcam.y <= 250) {
                    webcam.x += webcam.speed;
                } else {
                    gameStatus = "win";
                }
            }

// Check for collision
            if (webcam.y + webcam.height >= platform.y &&
                webcam.x + webcam.width >= platform.x &&
                webcam.x <= platform.x + platform.width) {
                webcam.y = platform.y - webcam.height;
            } else {
                webcam.y += 2;
            }

// Check for game over
            if (webcam.y >= canvas.height) {
                gameStatus = "lose";
            }

// Display game status
            context.fillStyle = "black";
            context.font = "20px Arial";
            if (gameStatus === "win") {
                context.fillText("¡Has reactivo la electricidad! ¡Has ganado!", 50, 150);
            } else if (gameStatus === "lose") {
                context.fillText("¡Has perdido! Vuelve a intentarlo.", 100, 150);
            } else {
                requestAnimationFrame(gameLoop);
            }
        }

// Handle keydown event for smartphone operation
        document.addEventListener("keydown", function (event) {
            if (event.key === "ArrowLeft") {
                webcam.x -= webcam.speed;
            } else if (event.key === "ArrowRight") {
                webcam.x += webcam.speed;
            }
        });

// Start the game
        gameLoop();
    </script>
</body>
</html>