AI game creator

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

No:2922

6242

←

Prev Next

→

cattle mutilation
Developer anonymous｜Date and time 70/1/1 9:55:37
Build time unknown sec｜Game capacity 3.337KB｜

Script

というゲームを作ってみました！

このゲームは、画面上にランダムに動く牛をクリックしていくゲームです。スタートボタンを押すと、3匹の牛が画面上で動き始め、2秒ごとに新しい牛が追加されます。ストップボタンを押すと、牛の動きが止まり、得点がリセットされます。牛をクリックすると10点獲得できます。楽しんで遊んでください！ 🐮

←

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>キャトルミューティレーション</title>
    <style>
      canvas {
        border: solid 1px black;
      }
    </style>
  </head>
  <body>
    <div>
      <canvas id="canvas" width="600" height="400"></canvas>
    </div>
    <div>
      <button id="startBtn">スタート</button>
      <button id="stopBtn">ストップ</button>
    </div>
    <script>
      const canvas = document.getElementById("canvas");
      const ctx = canvas.getContext("2d");
      const startBtn = document.getElementById("startBtn");
      const stopBtn = document.getElementById("stopBtn");
      
      let cows = [];
      let timerId;
      let score = 0;
      
      class Cow {
        constructor(x, y) {
          this.x = x;
          this.y = y;
          this.size = 40;
          this.dx = Math.random() * 2;
          this.dy = Math.random() * 2;
        }
        
        draw() {
          ctx.fillStyle = "🐄";
          ctx.fillRect(this.x, this.y, this.size, this.size);
        }
        
        update() {
          if (this.x + this.size > canvas.width || this.x < 0) {
            this.dx = -this.dx;
          }
          if (this.y + this.size > canvas.height || this.y < 0) {
            this.dy = -this.dy;
          }
          this.x += this.dx;
          this.y += this.dy;
        }
        
        isClicked(mouseX, mouseY) {
          if (mouseX >= this.x && mouseX <= this.x + this.size &&
             mouseY >= this.y && mouseY <= this.y + this.size) {
            return true;
          }
          return false;
        }
      }
      
      function update() {
        ctx.clearRect(0, 0, canvas.width, canvas.height);
        
        for (let cow of cows) {
          cow.draw();
          cow.update();
        }
        
        requestAnimationFrame(update);
      }
      
      function startGame() {
        cows.push(new Cow(100, 100));
        cows.push(new Cow(300, 200));
        cows.push(new Cow(500, 300));
        
        canvas.addEventListener("mousedown", function(event) {
          let mouseX = event.clientX;
          let mouseY = event.clientY;
          for (let cow of cows) {
            if (cow.isClicked(mouseX, mouseY)) {
              cows.splice(cows.indexOf(cow), 1);
              score += 10;
            }
          }
        });
        
        timerId = setInterval(function() {
          cows.push(new Cow(Math.random() * (canvas.width - 40), 
                             Math.random() * (canvas.height - 40)));
        }, 2000);
        
        update();
      }
      
      function stopGame() {
        clearInterval(timerId);
        cows = [];
        score = 0;
      }
      
      startBtn.addEventListener("click", startGame);
      stopBtn.addEventListener("click", stopGame);
    </script>
  </body>
</html>