AI game creator

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

No:10264

233

←

Prev Next

→

Avoid the asteroids
Developer User4464｜Date and time 23/7/29 19:23:58
Build time 19.052 sec｜Game capacity 3.645KB｜

Script

Sure! Below is an example of a simple game implementation using JavaScript embedded in a single HTML file. The game is called "Avoid the Asteroids" and can be played on a smartphone. Pictograms are used to represent the player and the asteroids.

To play the game, you would open the HTML file in a web browser on a smartphone. The player is represented by a filled rectangle, and the goal is to avoid the falling filled rectangles (representing asteroids) by moving the player left or right using the arrow keys on a smartphone keyboard. If the player collides with an asteroid, an alert will pop up saying "Game Over!" indicating the end of the game. The game continuously generates new asteroids to keep the gameplay dynamic.

←

Prev　Next

→ 　

Back　

[PR]現在の欲しいゲームランキング

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

```html
<!DOCTYPE html>
<html>
<head>
    <style>
        canvas {
            border: 1px solid black;
        }
    </style>
</head>
<body>
    <canvas id="gameCanvas" width="400" height="400"></canvas>

// Set up the player
        const playerSize = 40;
        const player = {
            x: canvas.width / 2 - playerSize / 2,
            y: canvas.height - playerSize - 10,
            size: playerSize,
            speed: 5
        };

// Set up the asteroids
        const asteroidSize = 30;
        const asteroids = [];

// Event listener for player movement
        document.addEventListener("keydown", (event) => {
            if (event.key === "ArrowLeft" && player.x > 0) {
                player.x -= player.speed;
            } else if (event.key === "ArrowRight" && player.x < canvas.width - player.size) {
                player.x += player.speed;
            }
        });

// Function to create new asteroids
        function createAsteroid() {
            const asteroid = {
                x: Math.random() * (canvas.width - asteroidSize),
                y: 0,
                size: asteroidSize,
                speed: Math.random() * 2 + 1
            };
            asteroids.push(asteroid);
        }

// Function to update the game state
        function updateGame() {
            // Clear the canvas
            ctx.clearRect(0, 0, canvas.width, canvas.height);

// Draw the player
            ctx.fillRect(player.x, player.y, player.size, player.size);

// Draw the asteroids
            asteroids.forEach((asteroid) => {
                ctx.fillRect(asteroid.x, asteroid.y, asteroid.size, asteroid.size);

// Check for collision with player
                if (
                    player.x < asteroid.x + asteroid.size &&
                    player.x + player.size > asteroid.x &&
                    player.y < asteroid.y + asteroid.size &&
                    player.y + player.size > asteroid.y
                ) {
                    alert("Game Over!");
                }

// Update asteroid position
                asteroid.y += asteroid.speed;
            });

// Remove asteroids that go offscreen
            asteroids.forEach((asteroid, index) => {
                if (asteroid.y > canvas.height) {
                    asteroids.splice(index, 1);
                }
            });

// Generate new asteroids periodically
            if (Math.random() < 0.02) {
                createAsteroid();
            }

// Request next frame
            requestAnimationFrame(updateGame);
        }

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