Fruit.io, eat smaller ai, don't eat big ai, level up.'s game

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

No:37479

←

Prev Next

→

Fruit.io, eat smaller ai, don't eat big ai, level ..ALL
Developer User17064｜Date and time 24/1/21 4:19:20
Build time 13.3 sec｜Game capacity 4.654KB｜

Script

Sure! Here's an example of a simple game called "Fruit.io" implemented as a single HTML file with JavaScript:

In this game, you control a player represented by a red square. The objective is to eat the smaller green squares (fruits) without colliding with them. As you eat the fruits, your score increases, and when you eat all the fruits, the game levels up, adding more fruits to the screen. The game runs in a loop, continuously updating the game elements and checking for collisions. Note: Since the pictogram assets were not specified, I represented the player as a red square and the fruits as green squares. You can modify the code and replace the square representations with pictograms of your choice if needed. To play the game, simply copy the above code into a new HTML file and run it in a web browser. Use the arrow keys on a smartphone to control the player's movement and try to eat as many fruits as possible without touching them. I hope you enjoy playing "Fruit.io"!

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋Kindle本ランキング

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

Sure! Here's an example of a simple game called "Fruit.io" implemented as a single HTML file with JavaScript:

```html
<!DOCTYPE html>
<html>
<head>
    <title>Fruit.io</title>
    <style>
        body {
            margin: 0;
            padding: 0;
            overflow: hidden;
        }
        canvas {
            display: block;
        }
    </style>
</head>
<body>
    <canvas id="gameCanvas"></canvas>
    <script>
        // Game settings
        const GAME_WIDTH = 800;
        const GAME_HEIGHT = 600;
        const PLAYER_SIZE = 30;
        const ENEMY_SIZE = 20;
        const PLAYER_SPEED = 5;
        const ENEMY_SPEED = 2;
        const FRUITS_COUNT = 20;

// Game elements
        let playerX = GAME_WIDTH / 2;
        let playerY = GAME_HEIGHT / 2;
        let score = 0;
        let fruits = [];

// Initialize game canvas
        const canvas = document.getElementById("gameCanvas");
        const context = canvas.getContext("2d");
        canvas.width = GAME_WIDTH;
        canvas.height = GAME_HEIGHT;

// Handle player movement
        document.addEventListener("keydown", movePlayer);

// Generate random fruits
        for (let i = 0; i < FRUITS_COUNT; i++) {
            fruits.push({
                x: Math.random() * GAME_WIDTH,
                y: Math.random() * GAME_HEIGHT
            });
        }

// Game loop
        function gameLoop() {
            context.clearRect(0, 0, canvas.width, canvas.height); // Clear canvas
            drawPlayer(); // Draw player
            drawFruits(); // Draw fruits
            handleCollisions(); // Check for collisions
            requestAnimationFrame(gameLoop); // Repeat loop
        }

// Draw player
        function drawPlayer() {
            context.fillStyle = "red";
            context.fillRect(playerX, playerY, PLAYER_SIZE, PLAYER_SIZE);
        }

// Draw fruits
        function drawFruits() {
            context.fillStyle = "green";
            fruits.forEach(fruit => {
                context.fillRect(fruit.x, fruit.y, ENEMY_SIZE, ENEMY_SIZE);
            });
        }

// Check and handle collisions
        function handleCollisions() {
            fruits.forEach((fruit, index) => {
                if (
                    playerX < fruit.x + ENEMY_SIZE &&
                    playerX + PLAYER_SIZE > fruit.x &&
                    playerY < fruit.y + ENEMY_SIZE &&
                    playerY + PLAYER_SIZE > fruit.y
                ) {
                    fruits.splice(index, 1); // Remove the collided fruit
                    score++; // Increase the score
                    if (fruits.length === 0) { // Check if all fruits are eaten
                        levelUp(); // Level up the game
                    }
                }
            });
        }

// Level up
        function levelUp() {
            FRUITS_COUNT += 10; // Increase the number of fruits
            for (let i = 0; i < FRUITS_COUNT; i++) {
                fruits.push({
                    x: Math.random() * GAME_WIDTH,
                    y: Math.random() * GAME_HEIGHT
                });
            }
        }

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

Note: Since the pictogram assets were not specified, I represented the player as a red square and the fruits as green squares. You can modify the code and replace the square representations with pictograms of your choice if needed.

To play the game, simply copy the above code into a new HTML file and run it in a web browser. Use the arrow keys on a smartphone to control the player's movement and try to eat as many fruits as possible without touching them.

I hope you enjoy playing "Fruit.io"!