AI game creator

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

No:34045

←

Prev Next

→

Shooting Game
Developer User16013｜Date and time 24/1/7 22:53:10
Build time 46.574 sec｜Game capacity 6.675KB｜

Script

Sure! Here's a simple shooting game implemented as a single HTML file using JavaScript:

To play the game, you can save the above code into an HTML file (e.g., `shooting_game.html`) and open it in a web browser on a smartphone. The game involves controlling a player character (represented by a blue square) to move left and right using the left and right arrow keys respectively. To shoot bullets, press the spacebar. The objective is to shoot down the enemies (green squares) as they descend from the top of the screen. If an enemy collides with the player, the game ends and an alert message is displayed. You can then reload the page to play again.

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋Kindle本ランキング

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

Sure! Here's a simple shooting game implemented as a single HTML file using JavaScript:

```html
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Shooting Game</title>
    <style>
        canvas {
            border: 1px solid black;
        }
    </style>
</head>
<body>
    <canvas id="gameCanvas" width="300" height="400"></canvas>

// Player attributes
            var player = {
                x: 130,
                y: canvas.height - 40,
                width: 40,
                height: 40,
                color: "blue",
                speed: 5
            };

// Bullet attributes
            var bullets = [];
            var bulletSpeed = 10;
            var bulletWidth = 5;
            var bulletHeight = 20;
            var bulletColor = "red";

// Enemy attributes
            var enemies = [];
            var enemySpeed = 2;
            var enemyWidth = 30;
            var enemyHeight = 30;
            var enemyColor = "green";

// Input tracking
            var keys = {};

// Game loop function
            function gameLoop() {
                clearCanvas();
                updatePlayer();
                updateBullets();
                updateEnemies();
                drawPlayer();
                drawBullets();
                drawEnemies();
                requestAnimationFrame(gameLoop);
            }

// Function to clear the canvas
            function clearCanvas() {
                context.clearRect(0, 0, canvas.width, canvas.height);
            }

// Function to update player position based on input
            function updatePlayer() {
                if (keys[37]) {
                    player.x -= player.speed;
                }

if (keys[39]) {
                    player.x += player.speed;
                }

if (keys[32]) {
                    // Shoot bullet
                    bullets.push({
                        x: player.x + (player.width / 2) - (bulletWidth / 2),
                        y: player.y - bulletHeight,
                        width: bulletWidth,
                        height: bulletHeight,
                        color: bulletColor
                    });
                }

// Prevent player from moving out of bounds
                if (player.x < 0) {
                    player.x = 0;
                }

if (player.x > canvas.width - player.width) {
                    player.x = canvas.width - player.width;
                }
            }

// Function to update bullet positions
            function updateBullets() {
                for (var i = 0; i < bullets.length; i++) {
                    var bullet = bullets[i];
                    bullet.y -= bulletSpeed;

// Remove bullet if it goes off screen
                    if (bullet.y < 0) {
                        bullets.splice(i, 1);
                        i--;
                    }
                }
            }

// Function to update enemy positions
            function updateEnemies() {
                for (var i = 0; i < enemies.length; i++) {
                    var enemy = enemies[i];
                    enemy.y += enemySpeed;

// Remove enemy if it goes off screen
                    if (enemy.y > canvas.height) {
                        enemies.splice(i, 1);
                        i--;
                    }

// Check for collision with player
                    if (checkCollision(player, enemy)) {
                        alert("Game Over");
                        location.reload();
                    }
                }
            }

// Function to draw the player
            function drawPlayer() {
                context.fillStyle = player.color;
                context.fillRect(player.x, player.y, player.width, player.height);
            }

// Function to draw the bullets
            function drawBullets() {
                for (var i = 0; i < bullets.length; i++) {
                    var bullet = bullets[i];
                    context.fillStyle = bullet.color;
                    context.fillRect(bullet.x, bullet.y, bullet.width, bullet.height);
                }
            }

// Function to draw the enemies
            function drawEnemies() {
                for (var i = 0; i < enemies.length; i++) {
                    var enemy = enemies[i];
                    context.fillStyle = enemy.color;
                    context.fillRect(enemy.x, enemy.y, enemy.width, enemy.height);
                }
            }

// Function to check collision between two objects
            function checkCollision(obj1, obj2) {
                return obj1.x < obj2.x + obj2.width &&
                       obj1.x + obj1.width > obj2.x &&
                       obj1.y < obj2.y + obj2.height &&
                       obj1.y + obj1.height > obj2.y;
            }

// Event listeners for keydown and keyup events to track player input
            document.addEventListener("keydown", function(event) {
                keys[event.keyCode] = true;
            });

document.addEventListener("keyup", function(event) {
                delete keys[event.keyCode];
            });

// Spawn a new enemy every second
            setInterval(function() {
                enemies.push({
                    x: Math.random() * (canvas.width - enemyWidth),
                    y: 0,
                    width: enemyWidth,
                    height: enemyHeight,
                    color: enemyColor
                });
            }, 1000);

// Start the game loop
            gameLoop();
        });
    </script>
</body>
</html>
```