Skip to content

Instantly share code, notes, and snippets.

@radiocontrolled

radiocontrolled/index.html

Created May 6, 2015 21:19
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save radiocontrolled/5e41dab23dcc4a6ee897 to your computer and use it in GitHub Desktop.
Save radiocontrolled/5e41dab23dcc4a6ee897 to your computer and use it in GitHub Desktop.
Download ZIP
ticTacToe
Raw
index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>TicTacToe</title>
</head>
<body>
Open your console to play.
<script src="script.js"></script>
</body>
</html>
Raw
script.js
(function ticTacToe(){
var arr = [0,1,2,3,4,5,6,7,8];
var xWins = "x wins! Refresh your browser to play again.";
var oWins = "o wins! Refresh your browser to play again.";
var draw = "It's a draw! Refresh your browser to play again";
drawCell = function (value) {
var cell = "[" + value + "]";
return cell;
};
// draw the ticTacToe board and test for wins or draws.
drawGrid = function () {
var line1 = "";
var line2 = "";
var line3 = "";
for(var i = 0; i < arr.length; i++){
if (i <= 2) {
line1 += drawCell(arr[i]);
}
else if ( i > 2 && i < 6 ) {
line2 += drawCell(arr[i]);
}
else {
line3 += drawCell(arr[i]);
}
}
console.log(line1);
console.log(line2);
console.log(line3);
winHoriz = function (horizontalLine) {
switch (horizontalLine) {
case "[x][x][x]":
console.log(xWins);
break;
case "[o][o][o]":
console.log(oWins);
break;
}
};
winHoriz(line1);
winHoriz(line2);
winHoriz(line3);
winVert = function () {
if((line1.charAt(1) === "x") && (line2.charAt(1) === "x") && (line3.charAt(1) === "x")) {
console.log(xWins);
}
if((line1.charAt(1) === "o") && (line2.charAt(1) === "o") && (line3.charAt(1) === "o")) {
console.log(oWins);
}
if((line1.charAt(4) === "x") && (line2.charAt(4) === "x") && (line3.charAt(4) === "x")) {
console.log(xWins);
}
if((line1.charAt(4) === "o") && (line2.charAt(4) === "o") && (line3.charAt(4) === "o")) {
console.log(oWins);
}
if((line1.charAt(7) === "x") && (line2.charAt(7) === "x") && (line3.charAt(7) === "x")) {
console.log(xWins);
}
if((line1.charAt(7) === "o") && (line2.charAt(7) === "o") && (line3.charAt(7) === "o")) {
console.log(oWins);
}
};
winVert();
winDiag = function () {
if((line1.charAt(1) === "x") && (line2.charAt(4) === "x") && (line3.charAt(7) === "x")) {
console.log(xWins);
}
if((line1.charAt(1) === "o") && (line2.charAt(4) === "o") && (line3.charAt(7) === "o")) {
console.log(oWins);
}
if((line1.charAt(7) === "x") && (line2.charAt(4) === "x") && (line3.charAt(1) === "x")) {
console.log(xWins);
}
if((line1.charAt(7) === "o") && (line2.charAt(4) === "o") && (line3.charAt(1) === "o")) {
console.log(oWins);
}
};
winDiag();
itsADraw = function (line) {
if( (parseInt(line.charAt(1)) * 0 !== 0) && (parseInt(line.charAt(4))*0 !== 0 ) && (parseInt(line.charAt(7))*0 !== 0 ) ) {
return true;
}
};
if(itsADraw(line1) && itsADraw(line2) && itsADraw(line3)) {
console.log(draw);
}
};
makeMove = function (pos, player) {
// if gridItem is empty, allow user to make a mark
for(var i = 0; i < arr.length; i++){
if( (pos === arr[i]) && ((arr[i] !== "x") && (arr[i] !== "o")) ) {
arr[pos] = player;
}
}
drawGrid();
};
var init = function() {
console.log("Welcome to TicTacToe. Use the makeMove(pos,player) function to make a move. pos is the cell number, and player is either 'x' or 'o'. For example, running makeMove(6,'o'); in the console will place an 'o' on cell 6. ");
drawGrid();
}();
})();
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment