Juego de recolectar frutas's game

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

No:23718

←

Prev Next

→

Juego de recolectar frutas
Developer User11128｜Date and time 23/11/3 8:41:51
Build time 94.94 sec｜Game capacity 5.354KB｜

Script

←

Prev　Next

→ 　

Back　

[PR]現在の欲しいものランキング

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

<!DOCTYPE html>
<html>
<head>
    <title>Juego de Recolectar Frutas</title>
</head>
<body>
    <canvas id="gameCanvas" width="400" height="400"></canvas>
    <script>
        // Variables globales
        var canvas;
        var canvasContext;

var jugador; // Jugador
        var frutas = []; // Array de frutas
        var score = 0; // Puntaje inicial

// Inicializar el juego
        window.onload = function() {
            canvas = document.getElementById("gameCanvas");
            canvasContext = canvas.getContext("2d");

jugador = {
                x: canvas.width / 2,
                y: canvas.height - 50,
                width: 50,
                height: 50,
                color: "blue",
                dx: 5, // Velocidad de movimiento horizontal
                dy: 5, // Velocidad de movimiento vertical
                moveLeft: false,
                moveRight: false,
                moveUp: false,
                moveDown: false
            };

// Crear frutas aleatorias
            for (var i = 0; i < 10; i++) {
                var fruta = {
                    x: Math.random() * (canvas.width - 20) + 10,
                    y: Math.random() * (canvas.height - 20) + 10,
                    width: 20,
                    height: 20,
                    color: "red",
                    isVisible: true
                };
                frutas.push(fruta);
            }

// Detectar entrada de teclado en dispositivos móviles
            document.addEventListener("keydown", handleKeyDown);
            document.addEventListener("keyup", handleKeyUp);

// Comenzar el game loop
            setInterval(update, 1000 / 60);
        };

// Actualizar el estado del juego
        function update() {
            moveJugador();
            detectarColision();

// Limpiar el canvas
            canvasContext.clearRect(0, 0, canvas.width, canvas.height);

// Dibujar al jugador
            dibujarRectangulo(jugador.x, jugador.y, jugador.width, jugador.height, jugador.color);

// Dibujar las frutas visibles
            for (var i = 0; i < frutas.length; i++) {
                var fruta = frutas[i];
                if (fruta.isVisible) {
                    dibujarRectangulo(fruta.x, fruta.y, fruta.width, fruta.height, fruta.color);
                }
            }

// Mostrar puntaje
            canvasContext.fillStyle = "black";
            canvasContext.font = "20px Arial";
            canvasContext.fillText("Puntaje: " + score, 10, 30);
        }

// Mover al jugador según la entrada del usuario
        function moveJugador() {
            if (jugador.moveLeft && jugador.x > 0) {
                jugador.x -= jugador.dx;
            }

if (jugador.moveRight && jugador.x < canvas.width - jugador.width) {
                jugador.x += jugador.dx;
            }

if (jugador.moveUp && jugador.y > 0) {
                jugador.y -= jugador.dy;
            }

if (jugador.moveDown && jugador.y < canvas.height - jugador.height) {
                jugador.y += jugador.dy;
            }
        }

// Manejar la tecla presionada
        function handleKeyDown(event) {
            event.preventDefault(); // Evitar el comportamiento predeterminado

if (event.key === "ArrowLeft") {
                jugador.moveLeft = true;
            }

if (event.key === "ArrowRight") {
                jugador.moveRight = true;
            }

if (event.key === "ArrowUp") {
                jugador.moveUp = true;
            }

if (event.key === "ArrowDown") {
                jugador.moveDown = true;
            }
        }

// Manejar la tecla liberada
        function handleKeyUp(event) {
            event.preventDefault(); // Evitar el comportamiento predeterminado

if (event.key === "ArrowLeft") {
                jugador.moveLeft = false;
            }

if (event.key === "ArrowRight") {
                jugador.moveRight = false;
            }

if (event.key === "ArrowUp") {
                jugador.moveUp = false;
            }

if (event.key === "ArrowDown") {
                jugador.moveDown = false;
            }
        }

// Detectar colisiones entre el jugador y las frutas
        function detectarColision() {
            for (var i = 0; i < frutas.length; i++) {
                var fruta = frutas[i];
                if (fruta.isVisible && colisionRectRect(jugador, fruta)) {
                    fruta.isVisible = false; // Esconder la fruta
                    score++; // Aumentar el puntaje
                }
            }
        }

// Dibujar un rectángulo en el canvas
        function dibujarRectangulo(x, y, width, height, color) {
            canvasContext.fillStyle = color;
            canvasContext.fillRect(x, y, width, height);
        }

// Detectar colisión entre dos rectángulos
        function colisionRectRect(rect1, rect2) {
            return rect1.x < rect2.x + rect2.width &&
                   rect1.x + rect1.width > rect2.x &&
                   rect1.y < rect2.y + rect2.height &&
                   rect1.y + rect1.height > rect2.y;
        }
    </script>
</body>
</html>