Numbers Falling In The Sky's game

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

No:14290

111

←

Prev Next

→

Numbers Falling In The Sky
Developer User6030｜Date and time 23/8/31 18:39:40
Build time 21.513 sec｜Game capacity 3.467KB｜

Script

←

Prev　Next

→ 　

Back　

[PR]現在の人気ゲームランキング

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

<!DOCTYPE html>
<html>

<head>
    <title>Numbers Falling In The Sky</title>
</head>

// Define the size of the canvas and the falling speed of the numbers
        const canvasWidth = canvas.width;
        const canvasHeight = canvas.height;
        const fallingSpeed = 3;

// Array to store the falling numbers
        let fallingNumbers = [];

// Generate a random number between a given range
        function getRandomNumber(min, max) {
            return Math.floor(Math.random() * (max - min + 1) + min);
        }

// Function to create a new falling number object
        function createFallingNumber() {
            const randomNumber = getRandomNumber(1, 9); // Generate a random number between 1 and 9
            const posX = getRandomNumber(0, canvasWidth - 20); // Random x position for the falling number
            const posY = 0; // Start the number from the top of the canvas

return {
                number: randomNumber,
                x: posX,
                y: posY
            };
        }

// Function to draw the falling numbers on the canvas
        function drawFallingNumbers() {
            ctx.clearRect(0, 0, canvasWidth, canvasHeight); // Clear the canvas

for (let i = 0; i < fallingNumbers.length; i++) {
                const numberObj = fallingNumbers[i];
                
                ctx.font = "25px Arial"; // Set the font style
                ctx.fillText(numberObj.number, numberObj.x, numberObj.y); // Draw the number

// Update the y position to simulate the falling effect
                numberObj.y += fallingSpeed;

// Check if the number has reached the bottom of the canvas
                if (numberObj.y > canvasHeight) {
                    fallingNumbers.splice(i, 1); // Remove the number from the array
                }
            }

requestAnimationFrame(drawFallingNumbers); // Continuously redraw the canvas
        }

// Function to initialize the game
        function startGame() {
            // Start the game loop
            requestAnimationFrame(drawFallingNumbers);

// Listen for touch events on the canvas
            canvas.addEventListener("touchend", function(event) {
                const touchX = event.changedTouches[0].clientX;
                const touchY = event.changedTouches[0].clientY;

// Iterate through the fallingNumbers array and check if the touch event is inside the bounding box of any number
                for (let i = 0; i < fallingNumbers.length; i++) {
                    const numberObj = fallingNumbers[i];

if (touchX > numberObj.x && touchX < numberObj.x + 20 && touchY > numberObj.y && touchY < numberObj.y + 25) {
                        fallingNumbers.splice(i, 1); // Remove the number from the array if it is touched
                    }
                }
            });

// Generate new falling numbers at regular intervals
            setInterval(function() {
                const newNumber = createFallingNumber();
                fallingNumbers.push(newNumber);
            }, 2000);
        }

// Start the game
        startGame();

</script>
</body>

</html>