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

No:48332

←

Prev Next

→

Game piškvorky
Developer User20718｜Date and time 24/3/1 21:50:00
Build time 11.684 sec｜Game capacity 2.398KB｜

Script

Piskvorky Game

←

Prev　Next

→ 　

Back　

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

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

<!DOCTYPE html>
<html>
<head>
<title>Piskvorky Game</title>
</head>
<body>

<h1>Piskvorky Game</h1>

let currentPlayer = "X";
    let board = [];

function drawBoard() {
        ctx.clearRect(0, 0, canvas.width, canvas.height);
        ctx.strokeStyle = "#000";
        for (let i = 0; i <= canvas.width; i += cellSize) {
            ctx.beginPath();
            ctx.moveTo(i, 0);
            ctx.lineTo(i, canvas.height);
            ctx.stroke();
        }
        for (let i = 0; i <= canvas.height; i += cellSize) {
            ctx.beginPath();
            ctx.moveTo(0, i);
            ctx.lineTo(canvas.width, i);
            ctx.stroke();
        }

for (let i = 0; i < size; i++) {
            for (let j = 0; j < size; j++) {
                if (board[i][j] === "X") {
                    drawX(i, j);
                } else if (board[i][j] === "O") {
                    drawO(i, j);
                }
            }
        }
    }

function drawX(row, col) {
        ctx.beginPath();
        ctx.moveTo(col * cellSize, row * cellSize);
        ctx.lineTo((col + 1) * cellSize, (row + 1) * cellSize);
        ctx.moveTo((col + 1) * cellSize, row * cellSize);
        ctx.lineTo(col * cellSize, (row + 1) * cellSize);
        ctx.stroke();
    }

function drawO(row, col) {
        ctx.beginPath();
        ctx.arc(col * cellSize + cellSize / 2, row * cellSize + cellSize / 2, cellSize / 2, 0, 2 * Math.PI);
        ctx.stroke();
    }

canvas.addEventListener("click", function(event) {
        const rect = canvas.getBoundingClientRect();
        const mouseX = event.clientX - rect.left;
        const mouseY = event.clientY - rect.top;

const row = Math.floor(mouseY / cellSize);
        const col = Math.floor(mouseX / cellSize);

if (board[row][col] === "") {
            board[row][col] = currentPlayer;
            currentPlayer = currentPlayer === "X" ? "O" : "X";
            drawBoard();
        }
    });

function initBoard() {
        for (let i = 0; i < size; i++) {
            board.push(new Array(size).fill(""));
        }
    }

initBoard();
    drawBoard();
</script>

</body>
</html>