Can't determine when the winner is / show who's turn it is for a prompt. Functionality is there but I'm missing something...
P.S simple tic-tac-toe program in JavaScript
Code
var blocks= ["FirstSquare","SecondSquare","ThirdSquare",
"FourthSquare","FifthSquare","SixthSquare",
"SeventhSquare","EighthSquare","NinthSquare"];
var PlayerX = -1; // determines what to display
var isPvP = -1; // used to determine game mode and what to do next
var isComputerTurn = -1; //determines computer turn
var counter; // provides quick way to check for cat's game
var seconds = 0; // timer
function $(id)
{
return document.getElementById(id);
//start timer
}
function startGame()
{
//remove values
for (var i =0; i < blocks.length; i++)
{
$(blocks[i]).innerHTML = "-";
onClick();
}
counter = 0;
var timer = setInterval( updateTimer, 2000);
// $("start").disabled = true;
//set game mode
if($("PvP").checked)
{
isPvP = 1;
// pick random number for PlayerX
PlayerX = getRnd(1);
gamePrompt();
}
else
{
//PvC
isPvP = 0;
isComputerTurn = getRnd(1);
if(isComputerTurn)
{
PlayerX = 0;
computerAi();
}
else
{
PlayerX = 1;
gamePrompt();
}
}
}
function getRnd(max)
{
return Math.floor(Math.random() * (max + 1));
}
function placeLetter()
{
counter++;
if (PlayerX)
{
if(this.innerHTML == "-")
{
this.innerHTML = "X"; // Changed
if (!isPvP)
{
isComputerTurn = 1;
}
PlayerX = 0;
}
}
else
{
if(this.innerHTML == "-")
{
this.innerHTML = "O";
if (!isPvP)
{
isComputerTurn = 0;
onClick();
}
PlayerX = 1;
}
}
// Checks for winner
var champ = gameOver();
if (champ != -1)
{
endGame(champ);
}
else if (counter == 9)
{
endGame(champ);
}
else
{
gamePrompt();
if(isComputerTurn != -1)
{
if(isComputerTurn)
{
computerAi();
}
}
}
}
function computerAi()
{
gamePrompt();
unClick();
setTimeout(computerPick, 1000);
}
function computerPick()
{
var temp = getRnd(8);
while($(blocks[temp]).innerHTML != "-")
{
temp = getRnd(8);
}
placeLetter.call($(blocks[temp]));
}
function onClick()
{
for (var i =0; i < blocks.length; i++)
{
$(blocks[i]).addEventListener("click",placeLetter);
}
}
function unClick()
{
for (var i =0; i < blocks.length; i++)
{
$(blocks[i]).removeEventListener("click",placeLetter);
}
}
function updateTimer()
{
var tempSec = timerPad(++seconds%60);
var tempMin = timerPad(parseInt(seconds/60,10));
$("timer").innerHTML = "Total playing time: " + tempMin + ":" + tempSec;
}
function timerPad ( val )
{
if (val > 9)
{
return val;
}
else
{
return "0" + val;
}
}
function turnPrompt()
{
if (isX)
{
$("gamePrompt").innerHTML = "Its X's Turn! Click a Box.";
}
else
{
$("gamePrompt").innerHTML = "Its O's Turn! Click a Box.";
}
}
function gameOver()
{
// check first row
if(($("FirstSquare").innerHTML == $("SecondSquare").innerHTML) &&
($("SecondSquare").innerHTML == $("ThirdSquare").innerHTML) &&
($("FirstSquare").innerHTML != "-"))
{
if($("FirstSquare").innerHTML == "O")
{
return 0;
}
else
{
return 1;
}
}
// check second row
else if(($("FourthSquare").innerHTML == $("FifthSquare").innerHTML) &&
($("FifthSquare").innerHTML == $("SixthSquare").innerHTML) &&
($("FourthSquare").innerHTML != "-"))
{
if($("FourthSquare").innerHTML == "O")
{
return 0;
}
else
{
return 1;
}
}
// check third row
else if(($("SeventhSquare").innerHTML == $("EigthSquare").innerHTML) &&
($("EigthSquare").innerHTML == $("NinthSquare").innerHTML) &&
($("SeventhSquare").innerHTML != "-"))
{//
if($("SeventhSquare").innerHTML == "O")
{
return 0;
}
else
{
return 1;
}
}
//check first column
if(($("FirstSquare").innerHTML == $("FourthSquare").innerHTML) &&
($("FourthSquare").innerHTML == $("SeventhSquare").innerHTML) &&
($("FirstSquare").innerHTML != "-"))
{
if($("FirstSquare").innerHTML == "O")
{
return 0;
}
else
{
return 1;
}
}
// check second column
else if(($("SecondSquare").innerHTML == $("FifthSquare").innerHTML) &&
($("FifthSquare").innerHTML == $("EighthSquare").innerHTML) &&
($("SecondSquare").innerHTML != "-"))
{
if($("SecondSquare").innerHTML == "O")
{
return 0;
}
else
{
return 1;
}
}
// check third row
else if(($("ThirdSquare").innerHTML == $("SixthSquare").innerHTML) &&
($("SixthSquare").innerHTML == $("NinthSquare").innerHTML) &&
($("ThirdSquare").innerHTML != "-"))
{
if($("ThirdSquare").innerHTML == "O")
{
return 0;
}
else
{
return 1;
}
}
//check first diagonal \
else if(($("FirstSquare").innerHTML == $("FifthSquare").innerHTML) &&
($("FifthSquare").innerHTML == $("NinthSquare").innerHTML) &&
($("FirstSquare").innerHTML != "-"))
{
if($("FirstSquare").innerHTML == "O")
{
return 0;
}
else
{
return 1;
}
}
// check second diagonal /
else
{
(($("ThirdSquare").innerHTML == $("FifthSquare").innerHTML) &&
($("FifthSquare").innerHTML == $("SeventhSquare").innerHTML) &&
($("ThirdSquare").innerHTML != "-"))
{
if($("ThirdSquare").innerHTML == "O")
{
return 0;
}
else
{
return 1;
}
}
}
return -1;
}
function endGame(champ)
{
if (champ == -1)
{
$("gamePrompt").innerHTML = "Cats Game! You both suck.";
}
else if (champ == 0)
{
$("gamePrompt").innerHTML = "You lost to O, don't feel bad X, you're just a loser.";
}
else
{
$("gamePrompt").innerHTML = "X won whoopy diddly do!";
}
counter = 0;
$("start").disabled = true;
}