script.js

let boxes=document.querySelectorAll(".box");
let reset =document.querySelector("#reset");
let newGame=document.querySelector("#new");
let msgContainer=document.querySelector(".msg-container");
let msg=document.querySelector("#msg");
let turnO = true; //playerX, playerO
let count=0;
let gameOver=false;
const winPatterns=[
    [0,1,2],
    [0,3,6],
    [0,4,8],
    [1,4,7],
    [2,5,8],
    [2,4,6],
    [3,4,5],
    [6,7,8]
];

const resetGame=()=>{
    turnO=true;
    count=0;
    gameOver=false;
    enableBoxes();
    msgContainer.classList.add("hide");
}

const draw = ()=>{
    msg.innerText = "It's a Draw! 🤝";
    msgContainer.classList.remove("hide");
    msg.classList.add("shake");
    setTimeout(()=>msg.classList.remove("shake"),400);
    disableBoxes();
}

boxes.forEach((box) => {
    box.addEventListener("click",()=>{
        if(turnO){
            box.innerText="O";
            turnO=false;
        }
        else{
            box.innerText="X";
            turnO=true;
        }
        box.disabled=true;
        count++;
        checkWinner();
    });
});

const enableBoxes=()=>{
    for(let box of boxes){
        box.disabled=false;
        box.innerText="";
    }
}

const disableBoxes=()=>{
    for(let box of boxes){
        box.disabled=true;
    }
}

const showWinner =(winner)=>{
    msg.innerText=`Congratulations, Winner is ${winner}`;
    msgContainer.classList.remove("hide");
    disableBoxes();
}

const checkWinner =()=>{
    for(let pattern of winPatterns)
    {
        let pos1val = boxes[pattern[0]].innerText;
        let pos2val = boxes[pattern[1]].innerText;
        let pos3val = boxes[pattern[2]].innerText;
        if(pos1val!="" && pos2val!="" && pos3val!="")
        {
            if(pos1val === pos2val && pos2val === pos3val && pos3val === pos1val)
            {
                gameOver=true;
                showWinner(pos1val);
                return;
            }
        }
    }
    if(count===9 && !gameOver)
        draw();
}

newGame.addEventListener("click",resetGame);
reset.addEventListener("click",resetGame);