Ric Rac Roe (Similar trends to tic tac toe)'s game

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

No:42346

157

←

Prev Next

→

Ric Rac Roe (Similar trends to tic tac toe)
Developer User18028｜Date and time 24/2/11 11:59:30
Build time 13.169 sec｜Game capacity 3.299KB｜

Script

Sebagai seorang programmer, saya dapat membuat Ric Rac Roe (Mirip dengan tren tic tac toe) dalam bentuk game yang dapat dimainkan dalam sebuah file HTML tunggal. Berikut adalah contoh implementasinya:

Dalam implementasi di atas, game ini memanfaatkan pintasan smartphone untuk mengklik sel pada papan permainan. Pada papan permainan ini, simbol X dan O digunakan untuk pemain pertama dan kedua. Jika ada pemain yang berhasil mencapai kondisi menang (misalnya tiga simbolnya secara horizontal, vertikal, atau diagonal), pesan kemenangan akan muncul dan permainan akan diatur ulang. Silakan masukkan kode ini dalam satu file HTML dan jalankan dalam browser Anda untuk memainkan game Ric Rac Roe.

←

Prev　Next

→ 　

Back　

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

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

```html
<!DOCTYPE html>
<html>
<head>
  <title>Ric Rac Roe Game</title>
  <style>
    .game-container {
      display: flex;
      justify-content: center;
      align-items: center;
      height: 100vh;
      font-size: 50px;
    }

.game-cell {
      width: 100px;
      height: 100px;
      display: flex;
      justify-content: center;
      align-items: center;
      border: 2px solid black;
    }
  </style>
</head>
<body>
  <div class="game-container"></div>

// Menginisialisasi pemain pertama
    let currentPlayer = 'X';

// Mendapatkan elemen papan permainan
    const gameContainer = document.querySelector('.game-container');

// Render papan permainan
    function renderBoard() {
      gameContainer.innerHTML = '';

for (let i = 0; i < board.length; i++) {
        for (let j = 0; j < board[i].length; j++) {
          const cell = document.createElement('div');
          cell.classList.add('game-cell');
          cell.textContent = board[i][j];
          
          // Menambahkan event listener untuk mengurus klik pada sel
          cell.addEventListener('click', () => handleCellClick(i, j));

gameContainer.appendChild(cell);
        }
      }
    }

// Memproses klik pada sel
    function handleCellClick(row, col) {
      if (board[row][col] === '') {
        board[row][col] = currentPlayer;
        currentPlayer = currentPlayer === 'X' ? 'O' : 'X';

renderBoard();
        checkWinCondition();
      }
    }

// Memeriksa kondisi kemenangan
    function checkWinCondition() {
      const winningPatterns = [
        // Baris
        [[0, 0], [0, 1], [0, 2]],
        [[1, 0], [1, 1], [1, 2]],
        [[2, 0], [2, 1], [2, 2]],
        // Kolom
        [[0, 0], [1, 0], [2, 0]],
        [[0, 1], [1, 1], [2, 1]],
        [[0, 2], [1, 2], [2, 2]],
        // Diagonal
        [[0, 0], [1, 1], [2, 2]],
        [[0, 2], [1, 1], [2, 0]]
      ];

for (let pattern of winningPatterns) {
        const [a, b, c] = pattern;

if (board[a[0]][a[1]] === board[b[0]][b[1]] && board[a[0]][a[1]] === board[c[0]][c[1]] && board[a[0]][a[1]] !== '') {
          alert(`${board[a[0]][a[1]]} menang!`);
          resetGame();
          break;
        }
      }
    }

// Mengatur ulang permainan
    function resetGame() {
      board.forEach(row => row.fill(''));
      currentPlayer = 'X';
      renderBoard();
    }

// Memulai permainan
    renderBoard();
  </script>
</body>
</html>
```

Silakan masukkan kode ini dalam satu file HTML dan jalankan dalam browser Anda untuk memainkan game Ric Rac Roe.