Juego de friday night funkin's game

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

No:40169

←

Prev Next

→

Juego de friday night funkin
Developer User17930｜Date and time 24/2/1 11:06:49
Build time 10.333 sec｜Game capacity 2.787KB｜

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 Friday Night Funkin'</title>
</head>
<body>
    <canvas id="gameCanvas" width="800" height="600"></canvas>

// Definir constantes para el tamaño del canvas y los pictogramas
        const canvasWidth = canvas.width;
        const canvasHeight = canvas.height;
        const pictogramSize = 100;

// Pictogramas del juego
        const pictogram1 = new Image();
        const pictogram2 = new Image();
        pictogram1.src = "ruta_del_pictograma1.png";
        pictogram2.src = "ruta_del_pictograma2.png";

// Variables para el juego
        let score = 0;
        let isPlaying = false;

// Función principal del juego
        function gameLoop() {
            // Limpiar el canvas
            context.clearRect(0, 0, canvasWidth, canvasHeight);

// Dibujar los pictogramas en posiciones aleatorias
            const x1 = Math.random() * (canvasWidth - pictogramSize);
            const y1 = Math.random() * (canvasHeight - pictogramSize);
            context.drawImage(pictogram1, x1, y1, pictogramSize, pictogramSize);

const x2 = Math.random() * (canvasWidth - pictogramSize);
            const y2 = Math.random() * (canvasHeight - pictogramSize);
            context.drawImage(pictogram2, x2, y2, pictogramSize, pictogramSize);

// Comprobar si el jugador tocó alguno de los pictogramas
            canvas.addEventListener("click", function(event) {
                const rect = canvas.getBoundingClientRect();
                const mouseX = event.clientX - rect.left;
                const mouseY = event.clientY - rect.top;

if (mouseX >= x1 && mouseX <= x1 + pictogramSize &&
                    mouseY >= y1 && mouseY <= y1 + pictogramSize) {
                    score++;
                } else if (mouseX >= x2 && mouseX <= x2 + pictogramSize &&
                    mouseY >= y2 && mouseY <= y2 + pictogramSize) {
                    score--;
                }
            });

// Actualizar la puntuación en el canvas
            context.font = "20px Arial";
            context.fillStyle = "black";
            context.fillText("Puntuación: " + score, 20, 40);

// Repetir el juego en bucle
            if (isPlaying) {
                requestAnimationFrame(gameLoop);
            }
        }

// Iniciar el juego cuando la página cargue completamente
        window.onload = function() {
            isPlaying = true;
            gameLoop();
        };
    </script>
</body>
</html>