Shooter game were you have to hit the moving target you get coins then you can buy upgrades to make you get more coins per hit's game

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

No:13225

123

←

Prev Next

→

Shooter game were you have to hit the moving targe..ALL
Developer User5805｜Date and time 23/8/27 10:34:06
Build time 19.775 sec｜Game capacity 5.269KB｜

Script

Sure! Here's an example of a shooter game implemented as a single HTML file using JavaScript, enclosed in script tags:

In this game, you control a blue circle at the bottom of the canvas (representing the player) using arrow keys (left and right) on a computer or touch controls on a smartphone. Your aim is to shoot small black bullets at the red target by clicking anywhere on the canvas. Each time you hit the target, you earn coins. You can then use the coins to buy upgrades to increase the number of coins you earn per hit. The current number of coins and the upgrade cost are displayed on the screen. Additionally, an "Buy Upgrade" button is provided for smartphone operation. Please note that this is a simplified implementation for demonstration purposes and can be further improved and enhanced based on your specific 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 shooter game implemented as a single HTML file using JavaScript, enclosed in script tags:

```html
<!DOCTYPE html>
<html>
<head>
    <title>Shooter Game</title>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <style>
        canvas {
            border: 1px solid black;
        }
    </style>
</head>
<body>
    <canvas id="gameCanvas" width="400" height="300"></canvas>
    <script>
        // Game variables
        var canvas = document.getElementById("gameCanvas");
        var ctx = canvas.getContext("2d");
        var targetX = canvas.width / 2;
        var targetY = canvas.height / 2;
        var targetRadius = 20;
        var bullets = [];
        var coins = 0;
        var hitCoins = 1;
        
        // Player variables
        var playerRadius = 10;
        var playerX = canvas.width / 2;
        var playerY = canvas.height - 30;
        var playerSpeed = 5;
        
        // Upgrade variables
        var upgradeCost = 10;
        var upgradeMultiplier = 2;
        
        // Handling player movement
        function handlePlayerMovement(event) {
            var key = event.keyCode || event.which;
            if (key === 37 && playerX >= playerRadius) { // Left arrow key
                playerX -= playerSpeed;
            } else if (key === 39 && playerX <= canvas.width - playerRadius) { // Right arrow key
                playerX += playerSpeed;
            }
        }
        
        // Shooting bullets
        function shootBullet() {
            bullets.push({ x: playerX, y: playerY });
        }
        
        // Handling bullet movement and collision
        function updateBullets() {
            for (var i = 0; i < bullets.length; i++) {
                bullets[i].y -= playerSpeed;
                if (bullets[i].y < 0) {
                    bullets.splice(i, 1);
                    i--;
                    continue;
                }
                if (isCollision(bullets[i].x, bullets[i].y, targetX, targetY, targetRadius)) {
                    bullets.splice(i, 1);
                    i--;
                    coins += hitCoins;
                }
            }
        }
        
        // Checking collision between two circles
        function isCollision(x1, y1, x2, y2, radius) {
            var dx = x1 - x2;
            var dy = y1 - y2;
            var distance = Math.sqrt(dx * dx + dy * dy);
            return distance < radius * 2;
        }
        
        // Drawing game elements on the canvas
        function draw() {
            ctx.clearRect(0, 0, canvas.width, canvas.height);
            
            ctx.beginPath();
            ctx.arc(targetX, targetY, targetRadius, 0, Math.PI * 2);
            ctx.fillStyle = "red";
            ctx.fill();
            ctx.closePath();
            
            ctx.beginPath();
            ctx.arc(playerX, playerY, playerRadius, 0, Math.PI * 2);
            ctx.fillStyle = "blue";
            ctx.fill();
            ctx.closePath();
            
            for (var i = 0; i < bullets.length; i++) {
                ctx.beginPath();
                ctx.arc(bullets[i].x, bullets[i].y, 2, 0, Math.PI * 2);
                ctx.fillStyle = "black";
                ctx.fill();
                ctx.closePath();
            }
            
            ctx.font = "16px Arial";
            ctx.fillStyle = "black";
            ctx.fillText("Coins: " + coins, 10, 20);
            ctx.fillText("Upgrade Cost: " + upgradeCost, 10, 40);
        }
        
        // Game loop
        function gameLoop() {
            updateBullets();
            draw();
        }
        
        // Starting the game
        setInterval(gameLoop, 10);
        
        // Event listeners
        document.addEventListener("keydown", handlePlayerMovement);
        document.addEventListener("click", shootBullet);
        
        // Handling upgrades
        function buyUpgrade() {
            if (coins >= upgradeCost) {
                coins -= upgradeCost;
                hitCoins *= upgradeMultiplier;
                upgradeCost *= upgradeMultiplier;
            } else {
                alert("Not enough coins!");
            }
        }
        
        // Additional upgrade button for smartphone operation
        var upgradeButton = document.createElement("button");
        upgradeButton.innerHTML = "Buy Upgrade";
        upgradeButton.onclick = buyUpgrade;
        document.body.appendChild(upgradeButton);
    </script>
</body>
</html>
```

Please note that this is a simplified implementation for demonstration purposes and can be further improved and enhanced based on your specific requirements.