AI game creator

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

No:11189

145

←

Prev Next

→

Mining simulator
Developer User4832｜Date and time 23/8/8 5:46:42
Build time 21.782 sec｜Game capacity 2.377KB｜

Script

Score: 0

Tap or click to mine the rock!

←

Prev　Next

→ 　

Back　

[PR]現在の欲しいものランキング

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

<!DOCTYPE html>
<html>

<head>
  <title>Mining Simulator Game</title>
  <style>
    body {
      font-family: Arial, sans-serif;
      margin: 0;
      padding: 0;
      text-align: center;
    }
    
    canvas {
      background-color: #f0f0f0;
      display: block;
      margin: 0 auto;
      border: 1px solid #ccc;
    }
    
    #score {
      font-size: 24px;
    }
    
    #instruction {
      font-size: 18px;
      margin-top: 10px;
    }
  </style>
  <script>
    window.onload = function () {
      var canvas = document.getElementById("canvas");
      var ctx = canvas.getContext("2d");

var score = 0;
      var miningSpeed = 1;
      var rockPos = {
        x: canvas.width / 2 - 25,
        y: canvas.height / 2 - 25
      };
      var pickaxePos = {
        x: 50,
        y: canvas.height / 2 - 25
      };

function drawRock() {
        ctx.fillStyle = "#444";
        ctx.fillRect(rockPos.x, rockPos.y, 50, 50);
      }

function drawPickaxe() {
        ctx.fillStyle = "#999";
        ctx.fillRect(pickaxePos.x, pickaxePos.y, 50, 50);
      }

function drawScore() {
        ctx.fillStyle = "#000";
        ctx.font = "24px Arial";
        ctx.fillText("Score: " + score, 10, 30);
      }

function checkCollision() {
        if (pickaxePos.x + 50 >= rockPos.x && pickaxePos.y + 50 >= rockPos.y && pickaxePos.x <= rockPos.x + 50 && pickaxePos.y <= rockPos.y + 50) {
          score++;
          miningSpeed += 0.5;
          resetRock();
        }
      }

function resetRock() {
        rockPos.x = Math.random() * (canvas.width - 50);
        rockPos.y = Math.random() * (canvas.height - 50);
      }

function update() {
        pickaxePos.x += miningSpeed;

if (pickaxePos.x > canvas.width) {
          pickaxePos.x = -50;
          resetRock();
        }

checkCollision();
      }

function draw() {
        ctx.clearRect(0, 0, canvas.width, canvas.height);

drawRock();
        drawPickaxe();
        drawScore();

requestAnimationFrame(draw);
      }

function startGame() {
        setInterval(update, 1000 / 60);
        draw();
      }

startGame();
    }
  </script>
</head>

<body>
  <canvas id="canvas" width="480" height="320"></canvas>
  <div id="score">Score: 0</div>
  <div id="instruction">Tap or click to mine the rock!</div>
</body>

</html>