Shooting Game Steampunk Style's game

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

No:10742

←

Prev Next

→

Shooting Game Steampunk Style
Developer User4625｜Date and time 23/8/2 19:18:26
Build time 47.487 sec｜Game capacity 4.883KB｜

Script

←

Prev　Next

→ 　

Back　

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

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

<!DOCTYPE html>
<html>
<head>
  <title>スチームパンク風シューティングゲーム</title>
  <style>
    body {
      background-color: #000000;
      margin: 0;
      padding: 0;
      overflow: hidden;
      display: flex;
      justify-content: center;
      align-items: center;
      height: 100vh;
      font-family: 'Courier New', Courier, monospace;
      color: #ffffff;
    }
  </style>
</head>
<body>
  <script>
    // ゲームの幅と高さ
    const gameWidth = 800;
    const gameHeight = 600;

// プレイヤーの幅と高さ
    const playerWidth = 50;
    const playerHeight = 50;

// プレイヤーの初期位置
    let playerX = gameWidth / 2 - playerWidth / 2;
    let playerY = gameHeight - playerHeight - 10;

// 弾の速度
    const bulletSpeed = 10;

// 敵の数
    const enemyCount = 10;

// 敵のリスト
    let enemies = [];

// 弾のリスト
    let bullets = [];

// スコア
    let score = 0;

// ゲームオーバーフラグ
    let gameOver = false;

// ゲーム画面キャンバス
    let canvas = document.createElement('canvas');
    canvas.width = gameWidth;
    canvas.height = gameHeight;
    document.body.appendChild(canvas);
    let ctx = canvas.getContext('2d');

// プレイヤーの描画
    function drawPlayer() {
      ctx.fillStyle = '#ffffff';
      ctx.fillRect(playerX, playerY, playerWidth, playerHeight);
    }

// 弾の描画
    function drawBullets() {
      ctx.fillStyle = '#ff0000';
      for (let i = 0; i < bullets.length; i++) {
        let bullet = bullets[i];
        ctx.fillRect(bullet.x, bullet.y, bullet.width, bullet.height);
      }
    }

// 敵の描画
    function drawEnemies() {
      ctx.fillStyle = '#00ff00';
      for (let i = 0; i < enemies.length; i++) {
        let enemy = enemies[i];
        ctx.fillRect(enemy.x, enemy.y, enemy.width, enemy.height);
      }
    }

// スコアの描画
    function drawScore() {
      ctx.font = '20px Courier New';
      ctx.fillText('Score: ' + score, 10, 30);
    }

// ゲームオーバーの描画
    function drawGameOver() {
      ctx.font = '40px Courier New';
      ctx.fillText('Game Over', gameWidth / 2 - 100, gameHeight / 2);
    }

// プレイヤーの移動
    function movePlayer(event) {
      switch (event.keyCode) {
        case 37: // 左
          playerX -= 10;
          break;
        case 39: // 右
          playerX += 10;
          break;
        case 32: // スペースキー
          bullets.push({ x: playerX + playerWidth / 2, y: playerY, width: 3, height: 10 });
          break;
      }
    }

// 弾の移動
    function moveBullets() {
      for (let i = 0; i < bullets.length; i++) {
        let bullet = bullets[i];
        bullet.y -= bulletSpeed;
        if (bullet.y < 0) {
          bullets.splice(i, 1);
          i--;
        }
      }
    }

// 敵の移動
    function moveEnemies() {
      for (let i = 0; i < enemies.length; i++) {
        let enemy = enemies[i];
        enemy.y += 2;
        if (enemy.y > gameHeight) {
          enemies.splice(i, 1);
          i--;
        }
      }
    }

// 当たり判定
    function checkCollision() {
      for (let i = 0; i < bullets.length; i++) {
        let bullet = bullets[i];
        for (let j = 0; j < enemies.length; j++) {
          let enemy = enemies[j];
          if (
            bullet.x < enemy.x + enemy.width &&
            bullet.x + bullet.width > enemy.x &&
            bullet.y < enemy.y + enemy.height &&
            bullet.y + bullet.height > enemy.y
          ) {
            bullets.splice(i, 1);
            i--;
            enemies.splice(j, 1);
            j--;
            score++;
          }
        }
      }

for (let i = 0; i < enemies.length; i++) {
        let enemy = enemies[i];
        if (
          playerX < enemy.x + enemy.width &&
          playerX + playerWidth > enemy.x &&
          playerY < enemy.y + enemy.height &&
          playerY + playerHeight > enemy.y
        ) {
          gameOver = true;
        }
      }
    }

// ゲームのメインループ
    function gameLoop() {
      if (!gameOver) {
        ctx.clearRect(0, 0, gameWidth, gameHeight);

drawPlayer();
        drawBullets();
        drawEnemies();
        drawScore();

moveBullets();
        moveEnemies();
        checkCollision();

requestAnimationFrame(gameLoop);
      } else {
        drawGameOver();
      }
    }

// 初期化
    function init() {
      for (let i = 0; i < enemyCount; i++) {
        enemies.push({
          x: Math.random() * (gameWidth - 50),
          y: Math.random() * -200,
          width: 50,
          height: 50
        });
      }

document.addEventListener('keydown', movePlayer);

gameLoop();
    }

init();
  </script>
</body>
</html>