Space game where you collide random planets's game

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

No:11960

106

←

Prev Next

→

Space game where you collide random planets
Developer User4131｜Date and time 23/8/13 6:55:07
Build time 30.756 sec｜Game capacity 4.136KB｜

Script

Sure! Here's an example of a simple space game where you navigate a spacecraft and try to avoid colliding with randomly generated planets. It's implemented as a single HTML file enclosed in script tags:

To play the game, you can copy the code into an empty HTML file and open it in a web browser. Use the arrow keys to navigate your spacecraft and try to avoid colliding with the randomly generated planets. Your score will increase as you avoid collisions. If you collide with a planet, the game will end and display your final score.

←

Prev　Next

→ 　

Back　

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

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

```html
<!DOCTYPE html>
<html>
<head>
  <title>Space Game</title>
  <style>
    canvas {
      border: 1px solid black;
    }
  </style>
</head>
<body>
  <canvas id="gameCanvas" width="400" height="400"></canvas>

// Initialize game
    function init() {
      canvas = document.getElementById("gameCanvas");
      context = canvas.getContext("2d");
      shipX = canvas.width / 2;
      shipY = canvas.height / 2;
      shipSize = 20;
      planets = [];
      planetSpeed = 2;
      planetSize = 30;
      score = 0;

document.addEventListener("keydown", handleKeyDown);

setInterval(gameLoop, 30);
    }

// Game loop
    function gameLoop() {
      update();
      draw();
    }

// Update game state
    function update() {
      moveShip();
      checkCollision();
      movePlanets();
      spawnPlanet();
    }

// Draw game objects
    function draw() {
      context.clearRect(0, 0, canvas.width, canvas.height);
      drawShip();
      drawPlanets();
      drawScore();
    }

// Move the ship based on arrow key inputs
    function moveShip() {
      if (shipX >= shipSize && shipX <= canvas.width - shipSize) {
        if (shipY >= shipSize && shipY <= canvas.height - shipSize) {
          if (keys.ArrowUp) shipY -= 5;
          if (keys.ArrowDown) shipY += 5;
          if (keys.ArrowLeft) shipX -= 5;
          if (keys.ArrowRight) shipX += 5;
        }
      }
    }

// Draw the ship
    function drawShip() {
      context.beginPath();
      context.arc(shipX, shipY, shipSize, 0, Math.PI * 2);
      context.fillStyle = "blue";
      context.fill();
      context.closePath();
    }

// Move the planets
    function movePlanets() {
      for (var i = 0; i < planets.length; i++) {
        planets[i].x -= planetSpeed;
      }
      planets = planets.filter(function(planet) {
        return planet.x + planetSize > 0;
      });
    }

// Spawn a new planet
    function spawnPlanet() {
      if (Math.random() < 0.05) {
        var planet = { x: canvas.width, y: Math.random() * canvas.height };
        planets.push(planet);
      }
    }

// Handle collision detection
    function checkCollision() {
      for (var i = 0; i < planets.length; i++) {
        var planet = planets[i];
        if (
          shipX + shipSize > planet.x &&
          shipX - shipSize < planet.x + planetSize &&
          shipY + shipSize > planet.y &&
          shipY - shipSize < planet.y + planetSize
        ) {
          clearInterval(gameLoop);
          alert("Game Over! Final Score: " + score);
          init();
          return;
        }
      }
    }

// Draw the planets
    function drawPlanets() {
      for (var i = 0; i < planets.length; i++) {
        var planet = planets[i];
        context.beginPath();
        context.arc(planet.x, planet.y, planetSize, 0, Math.PI * 2);
        context.fillStyle = "red";
        context.fill();
        context.closePath();
      }
    }

// Draw the score
    function drawScore() {
      context.font = "16px Arial";
      context.fillStyle = "black";
      context.fillText("Score: " + score, 10, 20);
    }

// Key input handling
    var keys = {};
    function handleKeyDown(event) {
      keys[event.code] = true;
    }
    function handleKeyUp(event) {
      keys[event.code] = false;
    }

// Start the game
    window.onload = function() {
      init();
    };
  </script>
</body>
</html>
```