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

No:17229

120

←

Prev Next

→

perang skibidi toilet
Developer User7602｜Date and time 23/9/22 16:18:07
Build time 41.8 sec｜Game capacity 3.989KB｜

Script

Perang Skibidi Toilet

Kamu adalah seorang superhero toilet yang melawan kotoran yang jatuh dari langit. Let's play!

←

Prev　Next

→ 　

Back　

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

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

<!DOCTYPE html>
<html>
<head>
  <title>Perang Skibidi Toilet</title>
  <style>
    #container {
      display: flex;
      justify-content: center;
      align-items: center;
      height: 100vh;
      flex-direction: column;
      font-size: 30px;
      text-align: center;
    }
  </style>
</head>
<body>
  <div id="container">
    <h1>Perang Skibidi Toilet</h1>
    <p>Kamu adalah seorang superhero toilet yang melawan kotoran yang jatuh dari langit. Let's play!</p>
    <button onclick="startGame()">Mulai Permainan</button>
    <canvas id="gameCanvas" width="480" height="320"></canvas>
  </div>

// Membuat canvas untuk memvisualisasikan permainan
      const canvas = document.getElementById('gameCanvas');
      const ctx = canvas.getContext('2d');

// Menggambar toilet (pictogram)
      const toilet = new Image();
      toilet.src = 'toilet.png';
      let toiletX = canvas.width / 2 - 25; // Koordinat awal toilet
      let toiletY = canvas.height - 100; // Koordinat awal toilet
      const toiletWidth = 50;
      const toiletHeight = 50;

// Menggambar kotoran (pictogram)
      const poop = new Image();
      poop.src = 'poop.png';
      let poopX = Math.random() * (canvas.width - 50); // Bilangan acak untuk koordinat kotoran
      let poopY = 0; // Kotoran muncul di atas canvas
      const poopWidth = 30;
      const poopHeight = 30;

// Nilai untuk mencatat jumlah kotoran yang berhasil dihindari
      let score = 0;

// Mendeteksi pergerakan toilet dengan menggerakkan pictogram menggunakan tombol di layar smartphone
      function move(event) {
        if (event.keyCode === 37 && toiletX > 0) {
          toiletX -= 10; // Menggerakkan toilet ke kiri saat tombol kiri ditekan
        } else if (event.keyCode === 39 && toiletX < canvas.width - toiletWidth) {
          toiletX += 10; // Menggerakkan toilet ke kanan saat tombol kanan ditekan
        }
      }

// Mendeteksi tabrakan antara toilet dan kotoran
      function collisionDetection() {
        if (
          toiletX < poopX + poopWidth &&
          toiletX + toiletWidth > poopX &&
          toiletY < poopY + poopHeight &&
          toiletY + toiletHeight > poopY
        ) {
          return true; // Terjadi tabrakan
        }
        return false; // Tidak terjadi tabrakan
      }

function updateGame() {
        // Membersihkan canvas setiap frame
        ctx.clearRect(0, 0, canvas.width, canvas.height);

// Menggambar toilet
        ctx.drawImage(toilet, toiletX, toiletY, toiletWidth, toiletHeight);

// Menggambar kotoran
        ctx.drawImage(poop, poopX, poopY, poopWidth, poopHeight);

// Memeriksa tabrakan
        if (collisionDetection()) {
          // Menampilkan pesan game over dan skor akhir game
          alert(`Game Over!\nSkor Anda: ${score}`);

// Mereset game setelah game over
          score = 0;
          toiletX = canvas.width / 2 - 25;
          poopX = Math.random() * (canvas.width - 50);

// Menampilkan kembali button mulai setelah game over
          document.querySelector('button').style.display = 'block';
        }

// Memperbarui koordinat kotoran
        poopY += 5;

// Menambah skor saat toilet berhasil menghindari kotoran
        if (poopY > canvas.height) {
          score++;
          poopX = Math.random() * (canvas.width - 50); // Kotoran muncul di koordinat x yang berbeda
          poopY = 0;
        }

// Menampilkan skor saat permainan berlangsung
        ctx.fillText(`Skor: ${score}`, 10, 30);

// Memanggil fungsi updateGame setiap frame
        requestAnimationFrame(updateGame);
      }

// Memulai permainan
      document.addEventListener('keydown', move);
      updateGame();
    }
  </script>
</body>
</html>