AI game creator

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

No:40437

←

Prev Next

→

Old Western shooter
Developer User18110｜Date and time 24/2/2 19:28:03
Build time 22.171 sec｜Game capacity 6.834KB｜

Script

Sure! Here's a simple implementation of an Old Western shooter game using JavaScript, HTML, and pictograms. Please copy the code below and save it as a single HTML file. You can then open it in a web browser, preferably on a smartphone, to play the game.

This implementation provides a basic Old Western shooter game experience. You can control the player using the left and right arrow keys, and shoot bullets using the spacebar. The objective is to shoot down all the enemies while avoiding collisions. If an enemy reaches the bottom of the screen or if the player collides with an enemy, the game ends, and a "Game Over" message is displayed. Please note that this is a very basic implementation and can be further enhanced with additional features and graphics based on your preferences.

←

Prev　Next

→ 　

Back　

[PR]現在の人気グッズランキング

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

```html
<!DOCTYPE html>
<html>
<head>
   <meta charset="UTF-8">
   <title>Old Western Shooter Game</title>
   <style>
      canvas {
         background: #eee;
         display: block;
         margin: 0 auto;
      }
   </style>
</head>
<body>
   <canvas id="game" width="400" height="300"></canvas>

// Player variables
      const playerWidth = 50;
      const playerHeight = 50;
      const playerSpeed = 5;

// Bullet variables
      const bulletSize = 10;
      const bulletSpeed = 10;
      const bulletColor = "#000";
      const maxBullets = 5;

// Enemy variables
      const enemySize = 50;
      const enemySpeed = 2;
      const enemyColor = "#f00";
      const spawnRate = 2000;

// Initialize the game
      function init() {
         canvas = document.getElementById("game");
         context = canvas.getContext("2d");
         player = {
            x: canvas.width / 2 - playerWidth / 2,
            y: canvas.height - playerHeight,
            width: playerWidth,
            height: playerHeight,
            color: "#00f",
            direction: null,
         };
         bullets = [];
         enemies = [];
         gameOver = false;

// Event listeners
         document.addEventListener("keydown", handleKeyDown);
         document.addEventListener("keyup", handleKeyUp);

// Start game loop
         setInterval(gameLoop, 10);

// Spawn enemies
         setInterval(spawnEnemy, spawnRate);
      }

// Update game objects and handle collisions
      function gameLoop() {
         if (!gameOver) {
            updatePlayer();
            updateBullets();
            updateEnemies();
            handleCollisions();
            draw();
         }
      }

// Update player position based on key input
      function updatePlayer() {
         if (player.direction === "left" && player.x > 0) {
            player.x -= playerSpeed;
         } else if (
            player.direction === "right" &&
            player.x < canvas.width - playerWidth
         ) {
            player.x += playerSpeed;
         }
      }

// Update bullet positions and remove off-screen bullets
      function updateBullets() {
         bullets.forEach((bullet, index) => {
            bullet.y -= bulletSpeed;
            if (bullet.y < 0) {
               bullets.splice(index, 1);
            }
         });
      }

// Update enemy positions and remove off-screen enemies
      function updateEnemies() {
         enemies.forEach((enemy, index) => {
            enemy.y += enemySpeed;
            if (enemy.y > canvas.height) {
               enemies.splice(index, 1);
            }
         });
      }

// Handle keydown events to move the player
      function handleKeyDown(event) {
         if (event.key === "ArrowLeft") {
            player.direction = "left";
         } else if (event.key === "ArrowRight") {
            player.direction = "right";
         } else if (event.key === " ") {
            shoot();
         }
      }

// Handle keyup events to stop the player's movement
      function handleKeyUp(event) {
         if (
            event.key === "ArrowLeft" ||
            event.key === "ArrowRight"
         ) {
            player.direction = null;
         }
      }

// Shoot a bullet
      function shoot() {
         if (bullets.length < maxBullets) {
            bullets.push({
               x: player.x + player.width / 2 - bulletSize / 2,
               y: player.y,
               size: bulletSize,
               color: bulletColor,
            });
         }
      }

// Spawn enemies at random positions
      function spawnEnemy() {
         const x = Math.random() * (canvas.width - enemySize);
         enemies.push({
            x: x,
            y: 0,
            width: enemySize,
            height: enemySize,
            color: enemyColor,
         });
      }

// Handle collisions between bullets and enemies
      function handleCollisions() {
         bullets.forEach((bullet, bulletIndex) => {
            enemies.forEach((enemy, enemyIndex) => {
               if (
                  bullet.x < enemy.x + enemy.width &&
                  bullet.x + bullet.size > enemy.x &&
                  bullet.y < enemy.y + enemy.height &&
                  bullet.y + bullet.size > enemy.y
               ) {
                  bullets.splice(bulletIndex, 1);
                  enemies.splice(enemyIndex, 1);
               }
            });
         });

// Check if enemies collide with player
         enemies.forEach((enemy) => {
            if (
               player.x < enemy.x + enemy.width &&
               player.x + player.width > enemy.x &&
               player.y < enemy.y + enemy.height &&
               player.y + player.height > enemy.y
            ) {
               gameOver = true;
            }
         });
      }

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

// Draw player
         context.fillStyle = player.color;
         context.fillRect(player.x, player.y, player.width, player.height);

// Draw bullets
         bullets.forEach((bullet) => {
            context.fillStyle = bullet.color;
            context.fillRect(bullet.x, bullet.y, bullet.size, bullet.size);
         });

// Draw enemies
         enemies.forEach((enemy) => {
            context.fillStyle = enemy.color;
            context.fillRect(enemy.x, enemy.y, enemy.width, enemy.height);
         });

// Show game over message
         if (gameOver) {
            context.font = "30px Arial";
            context.fillStyle = "#000";
            context.fillText("Game Over", canvas.width / 2 - 80, canvas.height / 2);
         }
      }

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

Please note that this is a very basic implementation and can be further enhanced with additional features and graphics based on your preferences.