AI game creator

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

No:41098

←

Prev Next

→

Shooting Game
Developer User18458｜Date and time 24/2/6 1:51:57
Build time 15.585 sec｜Game capacity 4.155KB｜

Script

←

Prev　Next

→ 　

Back　

[PR]現在の人気ゲームランキング

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

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>Juego de Disparos</title>
    <style>
      canvas {
        border: 1px solid black;
      }
    </style>
  </head>
  <body>
    <canvas id="gameCanvas" width="400" height="400"></canvas>

var canvas = document.getElementById("gameCanvas");
      var ctx = canvas.getContext("2d");

var player = {
        x: canvas.width / 2,
        y: canvas.height - 30,
        width: 20,
        height: 20,
        speed: 5,
        isMovingLeft: false,
        isMovingRight: false
      };

var bullets = [];
      var bulletSpeed = 8;

var enemies = [
        createEnemy(50, 50),
        createEnemy(150, 50),
        createEnemy(250, 50)
      ];

function createEnemy(x, y) {
        return {
          x: x,
          y: y,
          width: 30,
          height: 30,
          speed: 2
        };
      }

function keyUpHandler(event) {
        if (event.key === "ArrowLeft") {
          player.isMovingLeft = false;
        } else if (event.key === "ArrowRight") {
          player.isMovingRight = false;
        }
      }

function movePlayer() {
        if (player.isMovingLeft && player.x > player.width / 2) {
          player.x -= player.speed;
        } else if (
          player.isMovingRight &&
          player.x < canvas.width - player.width / 2
        ) {
          player.x += player.speed;
        }
      }

function moveBullets() {
        bullets = bullets.filter(function(bullet) {
          bullet.y -= bulletSpeed;
          return bullet.y > 0;
        });
      }

function resetEnemy(enemy) {
        enemy.y = -enemy.height;
        enemy.x = Math.random() * (canvas.width - enemy.width);
      }

function drawPlayer() {
        ctx.beginPath();
        ctx.rect(
          player.x - player.width / 2,
          player.y - player.height / 2,
          player.width,
          player.height
        );
        ctx.fillStyle = "blue";
        ctx.fill();
        ctx.closePath();
      }

function drawBullets() {
        bullets.forEach(function(bullet) {
          ctx.beginPath();
          ctx.rect(bullet.x, bullet.y, bullet.width, bullet.height);
          ctx.fillStyle = "red";
          ctx.fill();
          ctx.closePath();
        });
      }

function drawEnemies() {
        enemies.forEach(function(enemy) {
          ctx.beginPath();
          ctx.rect(enemy.x, enemy.y, enemy.width, enemy.height);
          ctx.fillStyle = "green";
          ctx.fill();
          ctx.closePath();
        });
      }

function draw() {
        ctx.clearRect(0, 0, canvas.width, canvas.height);
        movePlayer();
        moveBullets();
        moveEnemies();
        detectCollisions();
        drawPlayer();
        drawBullets();
        drawEnemies();
      }

setInterval(draw, 10);
    </script>
  </body>
</html>