AI game creator

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

No:50053

←

Prev Next

→

Game and watch
Developer User21218｜Date and time 24/3/7 14:39:34
Build time 11.713 sec｜Game capacity 2.559KB｜

Script

←

Prev　Next

→ 　

Back　

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

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

```html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Game and Watch</title>
<style>
    body {
        display: flex;
        justify-content: center;
        align-items: center;
        height: 100vh;
        margin: 0;
        background-color: #f0f0f0;
    }
    #game-container {
        width: 300px;
        height: 300px;
        border: 2px solid #333;
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        grid-template-rows: repeat(3, 1fr);
    }
    .game-cell {
        display: flex;
        justify-content: center;
        align-items: center;
        font-size: 30px;
        cursor: pointer;
    }
</style>
</head>
<body>
<div id="game-container"></div>
<script>
    const gameContainer = document.getElementById('game-container');
    let currentPlayer = 'X';
    let gameBoard = ['', '', '', '', '', '', '', '', ''];

function checkWinner() {
        const winPatterns = [
            [0, 1, 2],
            [3, 4, 5],
            [6, 7, 8],
            [0, 3, 6],
            [1, 4, 7],
            [2, 5, 8],
            [0, 4, 8],
            [2, 4, 6]
        ];

for (let i = 0; i < winPatterns.length; i++) {
            const [a, b, c] = winPatterns[i];
            if (gameBoard[a] && gameBoard[a] === gameBoard[b] && gameBoard[a] === gameBoard[c]) {
                alert(`${currentPlayer} wins the game!`);
                resetGame();
                return;
            }
        }

if (!gameBoard.includes('')) {
            alert("It's a tie!");
            resetGame();
            return;
        }

currentPlayer = currentPlayer === 'X' ? 'O' : 'X';
    }

function handleCellClick(index) {
        if (gameBoard[index] || !currentPlayer) return;
        gameBoard[index] = currentPlayer;
        renderGameBoard();
        checkWinner();
    }

function resetGame() {
        gameBoard = ['', '', '', '', '', '', '', '', ''];
        currentPlayer = 'X';
        renderGameBoard();
    }

function renderGameBoard() {
        gameContainer.innerHTML = '';
        gameBoard.forEach((cell, index) => {
            const cellElement = document.createElement('div');
            cellElement.className = 'game-cell';
            cellElement.textContent = cell;
            cellElement.addEventListener('click', () => handleCellClick(index));
            gameContainer.appendChild(cellElement);
        });
    }

renderGameBoard();
</script>
</body>
</html>
```