AI game creator

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

No:44092

←

Prev Next

→

Shooting Game
Developer User19085｜Date and time 24/2/17 4:34:27
Build time 17.742 sec｜Game capacity 5.699KB｜

Script

Sure! Here's a simple shooting game implemented as a single HTML file using JavaScript. It is designed for smartphone operation and uses pictograms for elements in the game.

To play the game, save the above code as a `.html` file, and ensure you have three image files: `emozi_all/play.png`, `emozi_chicken.png`, and `emozi_all/enemy.png` in the same directory as the HTML file. Open the HTML file in a web browser on your smartphone, and you should be able to play the shooting game using touch controls. Please note that the image files are not provided here, so you need to replace the image paths with your own image files in the `
` section.

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋ゲームアプリランキング

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. It is designed for smartphone operation and uses pictograms for elements in the game.

```html
<!DOCTYPE html>
<html>

<head>
    <title>Shooting Game</title>
    <style>
        body {
            margin: 0;
            padding: 0;
        }

#gameCanvas {
            background-color: #f0f0f0;
            display: flex;
            align-items: center;
            justify-content: center;
            height: 100vh;
        }
    </style>
</head>

// Player object
        class Player {
            constructor() {
                this.x = 180;
                this.y = 550;
                this.width = 40;
                this.height = 40;
                this.image = new Image();
                this.image.src = "player.png";
            }
        }

// Bullet object
        class Bullet {
            constructor(x, y) {
                this.x = x;
                this.y = y;
                this.width = 10;
                this.height = 10;
                this.image = new Image();
                this.image.src = "bullet.png";
            }
            update() {
                this.y -= 5; // bullet speed
            }
        }

// Enemy object
        class Enemy {
            constructor() {
                this.x = Math.random() * 360;
                this.y = -40;
                this.width = 40;
                this.height = 40;
                this.image = new Image();
                this.image.src = "enemy.png";
            }
            update() {
                this.y += 2; // enemy speed
            }
        }

// Helper function to check collision between two rectangular 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;
        }

// Game initialization
        function init() {
            canvas = document.getElementById("game");
            context = canvas.getContext("2d");

player = new Player();
            bullets = [];
            enemies = [];
            gameOver = false;

document.addEventListener("keydown", handleKeyDown);
            canvas.addEventListener("mousedown", handleMouseDown);

loop();
        }

// Game loop
        function loop() {
            requestAnimationFrame(loop);
            context.clearRect(0, 0, canvas.width, canvas.height);

// Draw player
            context.drawImage(player.image, player.x, player.y, player.width, player.height);

// Draw bullets
            for (let i = 0; i < bullets.length; i++) {
                let bullet = bullets[i];
                bullet.update();
                context.drawImage(bullet.image, bullet.x, bullet.y, bullet.width, bullet.height);

if (bullet.y < 0) {
                    bullets.splice(i, 1);
                    i--;
                }
            }

// Draw enemies
            for (let i = 0; i < enemies.length; i++) {
                let enemy = enemies[i];
                enemy.update();
                context.drawImage(enemy.image, enemy.x, enemy.y, enemy.width, enemy.height);

if (enemy.y > canvas.height) {
                    enemies.splice(i, 1);
                    i--;
                }
            }

// Collision detection between bullets and enemies
            for (let i = 0; i < bullets.length; i++) {
                for (let j = 0; j < enemies.length; j++) {
                    if (checkCollision(bullets[i], enemies[j])) {
                        bullets.splice(i, 1);
                        i--;
                        enemies.splice(j, 1);
                        j--;
                    }
                }
            }

// Collision detection between player and enemies
            for (let i = 0; i < enemies.length; i++) {
                if (checkCollision(player, enemies[i])) {
                    gameOver = true;
                }
            }

// Game over
            if (gameOver) {
                context.font = "30px Arial";
                context.fillStyle = "red";
                context.fillText("Game Over", 140, 300);
                return;
            }
        }

// Event handlers
        function handleKeyDown(event) {
            if (event.keyCode === 37) { // left arrow key
                player.x -= 10;
            } else if (event.keyCode === 39) { // right arrow key
                player.x += 10;
            }
        }

function handleMouseDown(event) {
            if (!gameOver) {
                let bullet = new Bullet(player.x + 15, player.y);
                bullets.push(bullet);
            }
        }

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

</html>
```

To play the game, save the above code as a `.html` file, and ensure you have three image files: `player.png`, `bullet.png`, and `enemy.png` in the same directory as the HTML file. Open the HTML file in a web browser on your smartphone, and you should be able to play the shooting game using touch controls.

Please note that the image files are not provided here, so you need to replace the image paths with your own image files in the `<script>` section.