AI game creator

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

No:20543

←

Prev Next

→

Rainbow racers
Developer User9091｜Date and time 23/10/10 4:38:13
Build time 16.689 sec｜Game capacity 4.497KB｜

Script

Sure! Here's a simple game called "Rainbow Racers" implemented as a single HTML file using JavaScript:

To play the game, simply copy the above code and save it as a ".html" file. Open the HTML file in a web browser on your smartphone, and you should see the game "Rainbow Racers" with touch controls. The objective is to move the purple player rectangle left or right to avoid the yellow obstacles falling from the top. If the player collides with an obstacle, it's game over. Enjoy!

←

Prev　Next

→ 　

Back　

[PR]現在の人気グッズランキング

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

Sure! Here's a simple game called "Rainbow Racers" implemented as a single HTML file using JavaScript:

```html
<!DOCTYPE html>
<html>
<head>
    <title>Rainbow Racers</title>
</head>
<body>
    <canvas id="gameCanvas"></canvas>

// Game variables
        let canvas;
        let context;
        let player;
        let obstacles = [];
        let gameLoopId;

// Player object
        class Player {
            constructor() {
                this.x = CANVAS_WIDTH / 2;
                this.y = CANVAS_HEIGHT - 50;
                this.width = 40;
                this.height = 60;
                this.speed = 5;
            }

moveLeft() {
                this.x -= this.speed;
            }

moveRight() {
                this.x += this.speed;
            }

draw() {
                context.fillStyle = 'purple';
                context.fillRect(this.x, this.y, this.width, this.height);
            }
        }

// Obstacle object
        class Obstacle {
            constructor(x, y) {
                this.x = x;
                this.y = y;
                this.width = Math.floor(Math.random() * 80) + 20;
                this.height = 20;
                this.speed = Math.floor(Math.random() * 4) + 1;
            }

move() {
                this.y += this.speed;
            }

draw() {
                context.fillStyle = 'yellow';
                context.fillRect(this.x, this.y, this.width, this.height);
            }
        }

function init() {
            canvas = document.getElementById('gameCanvas');
            context = canvas.getContext('2d');
            canvas.width = CANVAS_WIDTH;
            canvas.height = CANVAS_HEIGHT;

player = new Player();

// Event listeners for touch controls
            canvas.addEventListener('touchstart', (event) => {
                const touchX = event.touches[0].clientX;
                if (touchX < CANVAS_WIDTH / 2) {
                    player.moveLeft();
                } else {
                    player.moveRight();
                }
            });

gameLoop();
        }

function spawnObstacle() {
            const x = Math.floor(Math.random() * (CANVAS_WIDTH - 80));
            const y = -20;
            obstacles.push(new Obstacle(x, y));
        }

function updateGame() {
            // Move player
            if (player.x < 0) {
                player.x = 0;
            } else if (player.x > CANVAS_WIDTH - player.width) {
                player.x = CANVAS_WIDTH - player.width;
            }

// Move and draw obstacles
            for (let i = 0; i < obstacles.length; i++) {
                const obstacle = obstacles[i];
                obstacle.move();
                obstacle.draw();

// Collision detection
                if (
                    player.x < obstacle.x + obstacle.width &&
                    player.x + player.width > obstacle.x &&
                    player.y < obstacle.y + obstacle.height &&
                    player.y + player.height > obstacle.y
                ) {
                    gameover();
                    return;
                }

// Remove obstacles that move out of the canvas
                if (obstacle.y > CANVAS_HEIGHT) {
                    obstacles.splice(i, 1);
                    i--;
                }
            }
        }

function gameLoop() {
            context.clearRect(0, 0, CANVAS_WIDTH, CANVAS_HEIGHT);

player.draw();
            updateGame();

if (Math.random() < 0.02) {
                spawnObstacle();
            }

gameLoopId = requestAnimationFrame(gameLoop);
        }

function gameover() {
            cancelAnimationFrame(gameLoopId);
            alert('Game Over! Try again.');
            location.reload();
        }

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