AI game creator

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

No:43238

←

Prev Next

→

Doom
Developer User19158｜Date and time 24/2/15 3:39:46
Build time 13.332 sec｜Game capacity 4.55KB｜

Script

This is a simple "Doom" game implemented as a single HTML file using JavaScript. The game involves a player (red rectangle) moving around on the screen using either keyboard arrow keys or touch controls on a smartphone. The objective is to avoid collision with monsters (blue rectangles) moving across the screen. The score increases by 1 every time the player avoids a monster, and a new monster is created every 100 points. The game ends when the player collides with a monster, and the "Game Over" message is displayed on the screen.

←

Prev　Next

→ 　

Back　

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

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

```
<!DOCTYPE html>
<html>
<head>
    <title>Doom Game</title>
    <style>
        body { margin: 0; }
        canvas { display: block; }
    </style>
</head>
<body>

// Set the canvas size to fit the screen
        canvas.width = window.innerWidth;
        canvas.height = window.innerHeight;

// Append the canvas to the body
        document.body.appendChild(canvas);

// Game variables
        var player = { x: canvas.width / 2, y: canvas.height / 2, size: 20, speed: 10 };
        var monsters = [];
        var score = 0;
        var gameOver = false;

// Create a monster object
        function createMonster() {
            var monster = {
                x: Math.random() * (canvas.width - 50),
                y: Math.random() * (canvas.height - 50),
                size: 50,
                speed: Math.random() * 5 + 1
            };
            monsters.push(monster);
        }

// Game updates
        function update() {
            // Clear the canvas
            context.clearRect(0, 0, canvas.width, canvas.height);

// Move the player based on user input (keyboard or touch)
            document.onkeydown = function(event) {
                if (event.keyCode === 37) { // Left arrow key
                    player.x -= player.speed;
                } else if (event.keyCode === 38) { // Up arrow key
                    player.y -= player.speed;
                } else if (event.keyCode === 39) { // Right arrow key
                    player.x += player.speed;
                } else if (event.keyCode === 40) { // Down arrow key
                    player.y += player.speed;
                }
            };

canvas.addEventListener("touchstart", function(event) {
                var touchX = event.changedTouches[0].clientX;
                var touchY = event.changedTouches[0].clientY;
                player.x = touchX;
                player.y = touchY;
            });

// Draw the player
            context.fillStyle = "red";
            context.fillRect(player.x - player.size / 2, player.y - player.size / 2, player.size, player.size);

// Move and draw the monsters
            for (var i = 0; i < monsters.length; i++) {
                var monster = monsters[i];
                monster.x += monster.speed;
                context.fillStyle = "blue";
                context.fillRect(monster.x - monster.size / 2, monster.y - monster.size / 2, monster.size, monster.size);

// Check collision with the player
                if (Math.abs(monster.x - player.x) < (monster.size + player.size) / 2 &&
                    Math.abs(monster.y - player.y) < (monster.size + player.size) / 2) {
                    gameOver = true;
                }

// Check if monster is off the screen and remove
                if (monster.x > canvas.width) {
                    monsters.splice(i, 1);
                    score++;
                }
            }

// Increment score and create new monster every 100 points
            if (score % 100 === 0) {
                createMonster();
            }

// Display the score on the screen
            context.font = "20px Arial";
            context.fillStyle = "black";
            context.fillText("Score: " + score, 10, 30);

// Game over condition
            if (gameOver) {
                context.font = "50px Arial";
                context.fillStyle = "black";
                context.fillText("Game Over", canvas.width / 2 - 120, canvas.height / 2);
                return;
            }

// Call update function again
            requestAnimationFrame(update);
        }

// Start the game
        update();
    };
</script>

</body>
</html>
```