89 lines
2.1 KiB
JavaScript
89 lines
2.1 KiB
JavaScript
// /var/www/minitactix/static/game.js
|
|
let board = []
|
|
let playerSymbol = ''
|
|
let npcSymbol = ''
|
|
let gameOver = false
|
|
|
|
function startGame(symbol) {
|
|
playerSymbol = symbol
|
|
npcSymbol = symbol === 'X' ? 'O' : 'X'
|
|
document.getElementById('symbol-chooser').classList.add('hidden')
|
|
document.getElementById('board').classList.remove('hidden')
|
|
document.getElementById('restart').classList.remove('hidden')
|
|
initBoard()
|
|
randomNPCMoves(3 + Math.floor(Math.random() * 3))
|
|
renderBoard()
|
|
}
|
|
|
|
function initBoard() {
|
|
board = Array(16).fill('')
|
|
}
|
|
|
|
function renderBoard() {
|
|
const boardDiv = document.getElementById('board')
|
|
boardDiv.innerHTML = ''
|
|
board.forEach((val, idx) => {
|
|
const tile = document.createElement('div')
|
|
tile.className = 'tile'
|
|
tile.textContent = val
|
|
tile.onclick = () => playerMove(idx)
|
|
if (val !== '' || gameOver) tile.onclick = null
|
|
boardDiv.appendChild(tile)
|
|
})
|
|
}
|
|
|
|
function playerMove(index) {
|
|
if (board[index] !== '' || gameOver) return
|
|
board[index] = playerSymbol
|
|
if (checkWin(playerSymbol)) {
|
|
endGame('You win!')
|
|
return
|
|
}
|
|
if (board.includes('')) {
|
|
randomNPCMoves(1)
|
|
if (checkWin(npcSymbol)) {
|
|
endGame('NPC wins!')
|
|
return
|
|
}
|
|
}
|
|
if (!board.includes('')) endGame("It's a draw!")
|
|
renderBoard()
|
|
}
|
|
|
|
function randomNPCMoves(count) {
|
|
for (let i = 0; i < count; i++) {
|
|
const free = board.map((v, i) => v === '' ? i : null).filter(v => v !== null)
|
|
if (free.length === 0) return
|
|
const pick = free[Math.floor(Math.random() * free.length)]
|
|
board[pick] = npcSymbol
|
|
}
|
|
}
|
|
|
|
function checkWin(sym) {
|
|
const lines = [
|
|
// rows
|
|
[0,1,2], [1,2,3],
|
|
[4,5,6], [5,6,7],
|
|
[8,9,10], [9,10,11],
|
|
[12,13,14], [13,14,15],
|
|
// cols
|
|
[0,4,8], [4,8,12],
|
|
[1,5,9], [5,9,13],
|
|
[2,6,10], [6,10,14],
|
|
[3,7,11], [7,11,15],
|
|
// diagonals
|
|
[0,5,10], [1,6,11],
|
|
[4,9,14], [5,10,15],
|
|
[2,5,8], [3,6,9],
|
|
[6,9,12], [7,10,13]
|
|
]
|
|
return lines.some(line => line.every(i => board[i] === sym))
|
|
}
|
|
|
|
function endGame(msg) {
|
|
document.getElementById('status').textContent = msg
|
|
gameOver = true
|
|
renderBoard()
|
|
}
|
|
|