AI game creator

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

No:26807

←

Prev Next

→

A shooting game
Developer User13249｜Date and time 23/12/2 13:32:21
Build time 76.644 sec｜Game capacity 4.416KB｜

Script

Sure! Here's an example of a shooting game implemented as a single HTML file using JavaScript. Please note that the game mechanics and design are simplified for the purpose of demonstration.

This game features a simple shooting game where the player needs to click on randomly appearing targets to shoot them. The game ends after 30 seconds and displays the final score. Pictograms are loaded as images to represent the targets and bullets.

←

Prev　Next

→ 　

Back　

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

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

Sure! Here's an example of a shooting game implemented as a single HTML file using JavaScript. Please note that the game mechanics and design are simplified for the purpose of demonstration.

```html
<!DOCTYPE html>
<html>
<head>
    <title>Shooting Game</title>
    <style>
        canvas {
            border: 1px solid black;
            display: block;
            margin: 20px auto;
        }
    </style>
</head>
<body>
    <canvas id="gameCanvas" width="400" height="400"></canvas>

// Load pictogram images
        var targetImage = new Image();
        targetImage.src = "target.png";
        var bulletImage = new Image();
        bulletImage.src = "bullet.png";

// Event listeners for shooting
        canvas.addEventListener("mousedown", shoot);

// Main game loop
        gameInterval = setInterval(update, 10);

// Update game state
        function update() {
            if (time <= 0) {
                endGame();
            } else {
                time -= 0.01;
                drawGame();
            }
        }

// Draw game objects on canvas
        function drawGame() {
            ctx.clearRect(0, 0, canvas.width, canvas.height);
            
            // Draw targets
            for (var i = 0; i < targets.length; i++) {
                var target = targets[i];
                ctx.drawImage(targetImage, target.x, target.y, targetSize, targetSize);
            }
            
            // Draw bullets
            for (var i = 0; i < bullets.length; i++) {
                var bullet = bullets[i];
                ctx.drawImage(bulletImage, bullet.x, bullet.y, 10, 10);
            }
            
            // Draw score and time
            ctx.font = "20px Arial";
            ctx.fillText("Score: " + score, 10, 30);
            ctx.fillText("Time: " + time.toFixed(1), 10, 60);
        }

// Shoot bullets on mouse click
        function shoot(event) {
            if (!isGameOver) {
                var bullet = {
                    x: event.clientX - canvas.offsetLeft,
                    y: event.clientY - canvas.offsetTop,
                };
                bullets.push(bullet);
            }
        }

// Spawn new target at regular interval
        function spawnTarget() {
            var target = {
                x: Math.random() * (canvas.width - targetSize),
                y: Math.random() * (canvas.height - targetSize),
            };
            targets.push(target);
            setTimeout(spawnTarget, targetInterval);
        }
        spawnTarget();

// Check bullet collisions and update score
        function checkCollisions() {
            for (var i = 0; i < bullets.length; i++) {
                var bullet = bullets[i];
                for (var j = 0; j < targets.length; j++) {
                    var target = targets[j];
                    if (
                        bullet.x < target.x + targetSize &&
                        bullet.x + 10 > target.x &&
                        bullet.y < target.y + targetSize &&
                        bullet.y + 10 > target.y
                    ) {
                        targets.splice(j, 1);
                        bullets.splice(i, 1);
                        score++;
                        break;
                    }
                }
            }
        }

// Game over, stop the game and display score
        function endGame() {
            clearInterval(gameInterval);
            isGameOver = true;
            ctx.font = "30px Arial";
            ctx.fillText("Game Over!", canvas.width / 2 - 75, canvas.height / 2);
            ctx.fillText("Final Score: " + score, canvas.width / 2 - 100, canvas.height / 2 + 40);
        }
    </script>
</body>
</html>
```