Shoot small amounts of alien spacecraft while in a fighter jet's game | AI game creator

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

No:14883

87

Shoot small amounts of alien spacecraft while in a..ALL
Developer User6373｜Date and time 23/9/4 14:25:18
Build time 41.638 sec｜Game capacity 5.483KB｜

Sure! Here's an example of a simple game where you can shoot small amounts of alien spacecraft while controlling a fighter jet. The game will be implemented as a single HTML file containing JavaScript code enclosed in script tags:

This HTML file sets up the game canvas, controls the fighter jet's movement using `keydown` and `keyup` events, allows the player to shoot bullets by pressing the spacebar, and handles collision detection between bullets and aliens. The game runs in a loop using `requestAnimationFrame` to continuously update and redraw the game elements. The fighter jet is controlled using the left and right arrow keys, and bullets are fired upwards to hit the randomly spawned aliens. The game loop continually updates the positions of the bullets and aliens, checks for collisions, and redraws the canvas accordingly. Please note that this is a basic implementation to demonstrate the concept. You can modify and enhance the game with additional features like levels, scoring, different alien types, power-ups, and more.

→ 　

0　

0　

　

　

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

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

(C)2023 HisashiApp

Sure! Here's an example of a simple game where you can shoot small amounts of alien spacecraft while controlling a fighter jet. The game will be implemented as a single HTML file containing JavaScript code enclosed in script tags:

```html
<!DOCTYPE html>
<html>
  <head>
    <title>Alien Shooter Game</title>
    <style>
      body {
        background-color: #000;
        margin: 0;
        overflow: hidden;
      }
      #gameCanvas {
        border: 1px solid #fff;
      }
    </style>
  </head>
  <body>
    <canvas id="gameCanvas" width="500" height="500"></canvas>

<script>
      // Game canvas setup
      const canvas = document.getElementById('gameCanvas');
      const context = canvas.getContext('2d');

// Fighter jet setup
      const fighterJet = { x: canvas.width / 2, y: canvas.height - 50, width: 50, height: 50 };
      let isLeftPressed = false;
      let isRightPressed = false;

// Bullets setup
      const bullets = [];
      const bulletSpeed = 5;

// Aliens setup
      const aliens = [];
      const alienSpeed = 2;
      const alienSpawnInterval = 1000;
      let lastAlienSpawnTime = Date.now();

// Game loop
      function update() {
        clearCanvas();
        updateFighterJet();
        updateBullets();
        updateAliens();
        requestAnimationFrame(update);
      }

// Clear canvas
      function clearCanvas() {
        context.clearRect(0, 0, canvas.width, canvas.height);
      }

// Update fighter jet position
      function updateFighterJet() {
        if (isLeftPressed && fighterJet.x > 0) {
          fighterJet.x -= 5;
        } else if (isRightPressed && fighterJet.x < canvas.width - fighterJet.width) {
          fighterJet.x += 5;
        }
        drawFighterJet();
      }

// Draw fighter jet
      function drawFighterJet() {
        context.fillStyle = '#00ff00';
        context.fillRect(fighterJet.x, fighterJet.y, fighterJet.width, fighterJet.height);
      }

// Handle keyboard controls
      document.addEventListener('keydown', keyDownHandler);
      document.addEventListener('keyup', keyUpHandler);

function keyDownHandler(event) {
        if (event.key === 'ArrowLeft') {
          isLeftPressed = true;
        } else if (event.key === 'ArrowRight') {
          isRightPressed = true;
        } else if (event.key === ' ' || event.key === 'Spacebar') {
          shootBullet();
        }
      }

function keyUpHandler(event) {
        if (event.key === 'ArrowLeft') {
          isLeftPressed = false;
        } else if (event.key === 'ArrowRight') {
          isRightPressed = false;
        }
      }

// Shoot a bullet
      function shootBullet() {
        const bullet = { x: fighterJet.x + fighterJet.width / 2, y: fighterJet.y, width: 2, height: 10 };
        bullets.push(bullet);
      }

// Update bullets position
      function updateBullets() {
        bullets.forEach((bullet, index) => {
          bullet.y -= bulletSpeed;
          if (bullet.y < 0) {
            bullets.splice(index, 1);
          } else {
            drawBullet(bullet);
          }
        });
      }

// Draw bullet
      function drawBullet(bullet) {
        context.fillStyle = '#ff0000';
        context.fillRect(bullet.x, bullet.y, bullet.width, bullet.height);
      }

// Update aliens position
      function updateAliens() {
        if (Date.now() - lastAlienSpawnTime > alienSpawnInterval) {
          const alien = { x: Math.random() * (canvas.width - 20) + 10, y: -20, width: 20, height: 20 };
          aliens.push(alien);
          lastAlienSpawnTime = Date.now();
        }

aliens.forEach((alien, index) => {
          alien.y += alienSpeed;
          if (alien.y > canvas.height) {
            aliens.splice(index, 1);
          } else {
            drawAlien(alien);
            detectCollision(alien, index);
          }
        });
      }

// Draw alien
      function drawAlien(alien) {
        context.fillStyle = '#ffffff';
        context.fillRect(alien.x, alien.y, alien.width, alien.height);
      }

// Detect collision between bullet and alien
      function detectCollision(alien, alienIndex) {
        bullets.forEach((bullet, bulletIndex) => {
          if (
            bullet.x < alien.x + alien.width &&
            bullet.x + bullet.width > alien.x &&
            bullet.y < alien.y + alien.height &&
            bullet.y + bullet.height > alien.y
          ) {
            bullets.splice(bulletIndex, 1);
            aliens.splice(alienIndex, 1);
          }
        });
      }

// Start the game
      update();
    </script>
  </body>
</html>
```

This HTML file sets up the game canvas, controls the fighter jet's movement using `keydown` and `keyup` events, allows the player to shoot bullets by pressing the spacebar, and handles collision detection between bullets and aliens. The game runs in a loop using `requestAnimationFrame` to continuously update and redraw the game elements.

The fighter jet is controlled using the left and right arrow keys, and bullets are fired upwards to hit the randomly spawned aliens. The game loop continually updates the positions of the bullets and aliens, checks for collisions, and redraws the canvas accordingly.

Please note that this is a basic implementation to demonstrate the concept. You can modify and enhance the game with additional features like levels, scoring, different alien types, power-ups, and more.