AI game creator

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

No:34176

←

Prev Next

→

Shooting Game
Developer User16154｜Date and time 24/1/8 23:12:02
Build time 51.6 sec｜Game capacity 5.904KB｜

Script

Sure! Here's an example of a simple shooting game implemented as a single HTML file:

This game allows you to control a player character (represented by a blue rectangle) using left and right arrow keys. The objective is to shoot down the green enemy rectangles using the spacebar. Your score increases each time you successfully hit an enemy. The game ends when an enemy reaches the bottom of the canvas. Please note that this is just a basic example and can be further enhanced with additional features, levels, and graphics as per your requirements.

←

Prev　Next

→ 　

Back　

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

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

Sure! Here's an example of a simple shooting game implemented as a single HTML file:

```html
<!DOCTYPE html>
<html>
<head>
    <title>Shooting Game</title>
    <style>
        canvas {
          display: block;
          margin: 0 auto;
          border: 1px solid black;
        }
    </style>
</head>
<body>
    <canvas id="gameCanvas" width="400" height="400"></canvas>
    <script>
        const canvas = document.getElementById("gameCanvas");
        const context = canvas.getContext("2d");

// Player
        const player = {
            x: canvas.width / 2,
            y: canvas.height - 30,
            width: 20,
            height: 20,
            speed: 5
        };

// Weapon
        const weapon = {
            x: player.x,
            y: player.y,
            width: 10,
            height: 10,
            speed: 10,
            isFired: false
        };

// Enemies
        let enemies = [];
        const enemyWidth = 20;
        const enemyHeight = 20;
        const enemySpeed = 2;
        const maxEnemies = 5;

// Game state
        let score = 0;
        let gameIsOver = false;

// Event listeners
        document.addEventListener("keydown", keyDownHandler);
        document.addEventListener("keyup", keyUpHandler);

function movePlayer() {
            if (player.isMovingLeft && player.x > 0) {
                player.x -= player.speed;
            }
            if (player.isMovingRight && player.x < canvas.width - player.width) {
                player.x += player.speed;
            }
        }

function moveWeapon() {
            if (weapon.isFired) {
                weapon.y -= weapon.speed;
            }

if (weapon.y < 0) {
                weapon.isFired = false;
            }
        }

function createEnemy() {
            if (enemies.length < maxEnemies) {
                const enemy = {
                    x: Math.random() * (canvas.width - enemyWidth),
                    y: 0,
                    width: enemyWidth,
                    height: enemyHeight,
                    speed: enemySpeed
                };
                
                enemies.push(enemy);
            }
        }

function moveEnemies() {
            enemies.forEach(enemy => {
                enemy.y += enemy.speed;

if (enemy.y > canvas.height) {
                    gameIsOver = true;
                }

if (weapon.isFired && weapon.x > enemy.x && weapon.x < enemy.x + enemy.width && weapon.y > enemy.y && weapon.y < enemy.y + enemy.height) {
                    score++;
                    weapon.isFired = false;
                    enemies = enemies.filter(e => e !== enemy);
                }
            });
        }

function drawPlayer() {
            context.beginPath();
            context.rect(player.x, player.y, player.width, player.height);
            context.fillStyle = "blue";
            context.fill();
            context.closePath();
        }

function drawWeapon() {
            if (weapon.isFired) {
                context.beginPath();
                context.rect(weapon.x, weapon.y, weapon.width, weapon.height);
                context.fillStyle = "red";
                context.fill();
                context.closePath();
            }
        }

function drawEnemies() {
            enemies.forEach(enemy => {
                context.beginPath();
                context.rect(enemy.x, enemy.y, enemy.width, enemy.height);
                context.fillStyle = "green";
                context.fill();
                context.closePath();
            });
        }

function drawScore() {
            context.font = "16px Arial";
            context.fillStyle = "black";
            context.fillText("Score: " + score, 8, 20);
        }

function drawGameOver() {
            context.font = "30px Arial";
            context.fillStyle = "red";
            context.fillText("Game Over", canvas.width / 2 - 80, canvas.height / 2);
        }

function gameLoop() {
            if (!gameIsOver) {
                context.clearRect(0, 0, canvas.width, canvas.height);

movePlayer();
                moveWeapon();
                createEnemy();
                moveEnemies();
                
                drawPlayer();
                drawWeapon();
                drawEnemies();
                drawScore();

requestAnimationFrame(gameLoop);
            } else {
                drawGameOver();
            }
        }

gameLoop();
    </script>
</body>
</html>
```

Please note that this is just a basic example and can be further enhanced with additional features, levels, and graphics as per your requirements.