Create playable checkers with kings's game

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

No:45043

←

Prev Next

→

Create playable checkers with kings
Developer User4781｜Date and time 24/2/20 3:01:47
Build time 15.135 sec｜Game capacity 2.254KB｜

Script

←

Prev　Next

→ 　

Back　

[PR]現在のゲームギフトランキング

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

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

const SIZE = 50;
    const ROWS = 8;
    const COLS = 8;

let board = [
        [0, 1, 0, 1, 0, 1, 0, 1],
        [1, 0, 1, 0, 1, 0, 1, 0],
        [0, 1, 0, 1, 0, 1, 0, 1],
        [0, 0, 0, 0, 0, 0, 0, 0],
        [0, 0, 0, 0, 0, 0, 0, 0],
        [2, 0, 2, 0, 2, 0, 2, 0],
        [0, 2, 0, 2, 0, 2, 0, 2],
        [2, 0, 2, 0, 2, 0, 2, 0]
    ];

let selectedPiece = null;

function drawPiece(x, y, color) {
        ctx.beginPath();
        ctx.arc(x, y, SIZE / 2 - 5, 0, 2 * Math.PI);
        ctx.fillStyle = color;
        ctx.fill();
    }

function handleClick(event) {
        const x = Math.floor(event.offsetX / SIZE);
        const y = Math.floor(event.offsetY / SIZE);

if (selectedPiece === null && board[y][x] !== 0) {
            selectedPiece = {x, y};
        } else if (selectedPiece !== null) {
            let dx = x - selectedPiece.x;
            let dy = y - selectedPiece.y;

if (board[y][x] === 0 && Math.abs(dx) === 1 && Math.abs(dy) === 1) {
                board[y][x] = board[selectedPiece.y][selectedPiece.x];
                board[selectedPiece.y][selectedPiece.x] = 0;
                selectedPiece = null;
            }
        }

drawBoard();
    }

canvas.addEventListener('click', handleClick);

drawBoard();
</script>

</body>
</html>