var board = [0, 0, 0, 0, 0, 0, 0, 0, 0]; //data structure for grid //some initialization of variables var player_turn = ""; var first_player; var second_player; var won = ""; var going; //constructor for a Player object function Player(player_num, representing_symbol) { this.player_num = player_num; this.representing_symbol = representing_symbol; this.check_win = function() { //if-else statements used to check if player is winning if (board[0] == this.player_num && board[1] == this.player_num && board[2] == this.player_num) //horizontal-top win { return true; } else if (board[3] == this.player_num && board[4] == this.player_num && board[5] == this.player_num) //horizontal middle win { return true; } else if (board[6] == this.player_num && board[7] == this.player_num && board[8] == this.player_num) //horizontal bottom win { return true; } else if (board[0] == this.player_num && board[3] == this.player_num && board[6] == this.player_num) //vertical left win { return true; } else if (board[1] == this.player_num && board[4] == this.player_num && board[7] == this.player_num) //vertical middle win { return true; } else if (board[2] == this.player_num && board[5] == this.player_num && board[8] == this.player_num) //vertical right win { return true; } else if (board[0] == this.player_num && board[4] == this.player_num && board[8] == this.player_num) //diagonal left to right win { return true; } else if (board[2] == this.player_num && board[4] == this.player_num && board[6] == this.player_num) //diagonal right to left win { return true; } return false; } } //function to toggle buttons for visible grid function toggle_game(bool) { document.getElementById("two_players").disabled = !bool; document.getElementById("one_button").disabled = bool; document.getElementById("two_button").disabled = bool; document.getElementById("three_button").disabled = bool; document.getElementById("four_button").disabled = bool; document.getElementById("five_button").disabled = bool; document.getElementById("six_button").disabled = bool; document.getElementById("seven_button").disabled = bool; document.getElementById("eight_button").disabled = bool; document.getElementById("nine_button").disabled = bool; } //function to erase text inside grid buttons function erase_text() { document.getElementById("result_text").innerHTML = ""; document.getElementById("one_text").innerHTML = ""; document.getElementById("two_text").innerHTML = ""; document.getElementById("three_text").innerHTML = ""; document.getElementById("four_text").innerHTML = ""; document.getElementById("five_text").innerHTML = ""; document.getElementById("six_text").innerHTML = ""; document.getElementById("seven_text").innerHTML = ""; document.getElementById("eight_text").innerHTML = ""; document.getElementById("nine_text").innerHTML = ""; } //initializing game function two_players() { toggle_game(false); erase_text(); board = [0, 0, 0, 0, 0, 0, 0, 0, 0]; first_player = new Player(1, "X"); second_player = new Player(2, "O"); going = first_player.player_num; } function place_board(position, num) { var num_dict = {1: "one", 2: "two", 3: "three", 4: "four", 5: "five", 6: "six", 7: "seven", 8: "eight", 9: "nine"}; var pos_num = num_dict[num]; if (board[position] == 0) //if position hasn't been taken, it is available { board[position] = going; if (going == first_player.player_num) //if player is first_player { document.getElementById(pos_num + "_text").innerHTML = "" + first_player.representing_symbol + ""; going = second_player.player_num; } else //if player is second_player { document.getElementById(pos_num + "_text").innerHTML = "" + second_player.representing_symbol + ""; going = first_player.player_num; } var first_win = first_player.check_win(); var second_win = second_player.check_win(); var covered = 0; var over = false; if (first_win) //if first_player wins { document.getElementById("result_text").innerHTML = "" + first_player.representing_symbol + " won !"; over = true; toggle_game(true); } else if (second_win) //if second_player wins { document.getElementById("result_text").innerHTML = "" + second_player.representing_symbol + " won !"; over = true; toggle_game(true); } if (!(over)) { for (var item = 0; item < board.length; item++) { if (!(board[item] == 0)) { covered += 1; } } if (covered == 9) //if board contains no zeros, it is essentially covered, meaning the result is a tie { over = true; toggle_game(true); document.getElementById("result_text").innerHTML = "It's a tie!"; } } } } window.onload = function() { toggle_game(true); }

Tic-Tac-Toe