Shooter but snake with alples's game

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

No:36584

←

Prev Next

→

Shooter but snake with alples
Developer User16829｜Date and time 24/1/17 23:53:12
Build time 18.219 sec｜Game capacity 3.758KB｜

Script

Sure! Here's an example of a simple shooter game implemented using JavaScript and enclosed in a single HTML file. The game is similar to the classic game Snake, but instead of a snake, you control a shooter trying to shoot apples falling from the top of the screen.

You can copy and paste the above code into a text editor and save it as a ".html" file. Then, you can open the file with a web browser on your smartphone and play the shooter game. Use the left and right arrow keys to move the shooter and try to shoot the falling apples. The game will end when you reach a score of 100 or more.

←

Prev　Next

→ 　

Back　

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

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

```html
<!DOCTYPE html>
<html>
<head>
  <title>Shooter Game</title>
  <style>
    canvas {
      border: 1px solid #000;
      display: block;
      margin: 0 auto;
    }
  </style>
</head>
<body>
  <canvas id="game"></canvas>

const shooterWidth = 50;
    const shooterHeight = 50;
    const shooterSpeed = 5;

const appleWidth = 30;
    const appleHeight = 30;
    const appleSpeed = 3;

const scoreIncrement = 10;
    const gameOverScore = 100;

// Game state
    let shooterX = (canvas.width - shooterWidth) / 2;
    let shooterY = canvas.height - shooterHeight;

let apples = [];

let score = 0;
    let isGameOver = false;

// Event listeners
    document.addEventListener('keydown', moveShooter);

// Main game loop
    function gameLoop() {
      if (!isGameOver) {
        update();
        draw();
      }

requestAnimationFrame(gameLoop);
    }

// Update game state
    function update() {
      moveApples();
      detectCollision();
      checkGameOver();
    }

// Move shooter with arrow keys
    function moveShooter(event) {
      switch (event.keyCode) {
        case 37:
          shooterX -= shooterSpeed;
          break;
        case 39:
          shooterX += shooterSpeed;
          break;
      }
    }

// Move apples vertically
    function moveApples() {
      for (let i = 0; i < apples.length; i++) {
        apples[i].y += appleSpeed;
      }
    }

// Detect collision between shooter and apples
    function detectCollision() {
      for (let i = 0; i < apples.length; i++) {
        if (
          shooterX < apples[i].x + appleWidth &&
          shooterX + shooterWidth > apples[i].x &&
          shooterY < apples[i].y + appleHeight &&
          shooterY + shooterHeight > apples[i].y
        ) {
          apples.splice(i, 1);
          score += scoreIncrement;
        }
      }
    }

// Check if game is over
    function checkGameOver() {
      if (score >= gameOverScore) {
        isGameOver = true;
      }
    }

// Draw game objects on canvas
    function draw() {
      context.clearRect(0, 0, canvas.width, canvas.height);

context.fillStyle = 'blue';
      context.fillRect(shooterX, shooterY, shooterWidth, shooterHeight);

context.fillStyle = 'red';
      for (let i = 0; i < apples.length; i++) {
        context.fillRect(apples[i].x, apples[i].y, appleWidth, appleHeight);
      }

context.font = '20px Arial';
      context.fillStyle = 'black';
      context.fillText('Score: ' + score, 20, 30);

if (isGameOver) {
        context.font = '30px Arial';
        context.fillText('Game Over', canvas.width / 2 - 80, canvas.height / 2);
      }
    }

// Generate new apple
    function generateApple() {
      const x = Math.floor(Math.random() * (canvas.width - appleWidth));
      apples.push({ x: x, y: 0 });
    }

// Start the game
    generateApple();
    gameLoop();
    setInterval(generateApple, 2000); // Generate new apple every 2 seconds
  </script>
</body>
</html>
```