A game tycoon about build a bunker in beach's game

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

No:17354

128

←

Prev Next

→

A game tycoon about build a bunker in beach
Developer User3879｜Date and time 23/9/23 6:00:06
Build time 26.319 sec｜Game capacity 2.574KB｜

Script

←

Prev　Next

→ 　

Back　

[PR]現在の新着人気ランキング

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

<!DOCTYPE html>
<html>
<head>
  <title>Game Tycoon - Construction d'un bunker sur la plage</title>
  <style>
    body {
      margin: 0;
      padding: 0;
      overflow: hidden;
    }
    canvas {
      display: block;
    }
  </style>
</head>
<body>
  <canvas id="gameCanvas"></canvas>

// Chargement des pictogrammes
    var beachImg = new Image();
    beachImg.src = "beach_pictogram.png";

var bunkerImg = new Image();
    bunkerImg.src = "bunker_pictogram.png";

var cursorImg = new Image();
    cursorImg.src = "cursor_pictogram.png";

// Initialisation du jeu
    function startGame() {
      canvas = document.getElementById("gameCanvas");
      context = canvas.getContext("2d");

canvas.width = window.innerWidth;
      canvas.height = window.innerHeight;

beach = {
        x: canvas.width / 2 - beachImg.width / 2,
        y: canvas.height / 2 - beachImg.height / 2,
        image: beachImg
      };

bunker = {
        x: canvas.width / 2 - bunkerImg.width / 2,
        y: canvas.height / 2 - bunkerImg.height / 2,
        image: bunkerImg,
        built: false
      };

cursor = {
        x: 0,
        y: 0,
        image: cursorImg
      };

canvas.addEventListener("mousemove", updateCursor);
      canvas.addEventListener("click", buildBunker);

// Démarrage de la boucle de jeu
      setInterval(updateGame, 20);
    }

// Mettre à jour la position du curseur
    function updateCursor(event) {
      var rect = canvas.getBoundingClientRect();
      cursor.x = event.clientX - rect.left;
      cursor.y = event.clientY - rect.top;
    }

// Construction du bunker au clic
    function buildBunker() {
      if (!bunker.built) {
        var distanceFromCenter = Math.sqrt(
          Math.pow(cursor.x - canvas.width / 2, 2) +
          Math.pow(cursor.y - canvas.height / 2, 2)
        );

if (distanceFromCenter <= 100) {
          bunker.built = true;
          console.log("Bunker construit avec succès !");
        }
      }
    }

// Mettre à jour le jeu
    function updateGame() {
      context.clearRect(0, 0, canvas.width, canvas.height);

context.drawImage(beach.image, beach.x, beach.y);
      context.drawImage(cursor.image, cursor.x, cursor.y);

if (bunker.built) {
        context.drawImage(bunker.image, bunker.x, bunker.y);
      }
    }

// Démarrer le jeu lorsque la page est chargée
    window.onload = startGame;
  </script>
</body>
</html>