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

No:12956

107

←

Prev Next

→

real life
Developer User5659｜Date and time 23/8/25 13:18:41
Build time 22.65 sec｜Game capacity 3.281KB｜

Script

Emoji Game

Match the emojis to earn points!

Score: 0

←

Prev　Next

→ 　

Back　

[PR]現在のプレゼントランキング

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

<html>
<head>
<title>Emoji Game</title>
<style>
    body {
        text-align: center;
    }
    #display {
        font-size: 60px;
    }
    #score {
        font-size: 24px;
        margin-top: 20px;
    }
</style>
</head>
<body>
    <h1>Emoji Game</h1>
    <p>Match the emojis to earn points!</p>
    <canvas id="gameCanvas" width="400" height="400"></canvas>
    <p id="display"></p>
    <p id="score">Score: <span id="scoreValue">0</span></p>

// Initialize game variables
        let canvas, ctx, score;
        let emojisOnScreen = [];
        let currentEmoji, currentPosX, currentPosY;

// Set up the game
        function setup() {
            canvas = document.getElementById("gameCanvas");
            ctx = canvas.getContext("2d");
            score = 0;
            emojisOnScreen = [];
            currentEmoji = getRandomEmoji();
            currentPosX = canvas.width / 2;
            currentPosY = canvas.height / 2;

// Generate emojis on the screen
            setInterval(generateEmojis, 1000);

// Update the display
            setInterval(update, 10);
        }

// Generate random emojis on the screen
        function generateEmojis() {
            const emoji = getRandomEmoji();
            const posX = Math.random() * (canvas.width - 100) + 50;
            const posY = Math.random() * (canvas.height - 100) + 50;
            emojisOnScreen.push({ emoji, posX, posY });
        }

// Update the game state
        function update() {
            ctx.clearRect(0, 0, canvas.width, canvas.height);
            drawCurrentEmoji();
            drawEmojisOnScreen();
            checkCollision();
            updateScore();
        }

// Draw the current emoji
        function drawCurrentEmoji() {
            ctx.font = "60px Arial";
            ctx.fillText(currentEmoji, currentPosX, currentPosY);
        }

// Draw emojis on the screen
        function drawEmojisOnScreen() {
            ctx.font = "40px Arial";
            emojisOnScreen.forEach(({ emoji, posX, posY }) => {
                ctx.fillText(emoji, posX, posY);
            });
        }

// Check if the current emoji collided with any emoji on the screen
        function checkCollision() {
            emojisOnScreen.forEach(({ emoji, posX, posY }, index) => {
                const distance = Math.sqrt(
                    (posX - currentPosX) ** 2 + (posY - currentPosY) ** 2
                );
                if (distance < 50) {
                    emojisOnScreen.splice(index, 1);
                    score++;
                    currentEmoji = getRandomEmoji();
                }
            });
        }

// Update the score display
        function updateScore() {
            document.getElementById("scoreValue").textContent = score;
        }

// Get a random emoji from the available emojis
        function getRandomEmoji() {
            return emojis[Math.floor(Math.random() * emojis.length)];
        }

// Start the game on page load
        window.onload = function () {
            setup();
        };
    </script>
</body>
</html>