Tic Tac Toe
A simple tic-tac-toe game, following the define-all-variables-at-the-top-of-each-function policy.
by marhaba
HTML
<div id="tictactoe"></div>JavaScript
/*
* A complete tic-tac-toe widget. Just include this script in a
* browser page and enjoy. A tic-tac-toe game will be included
* as a child element of the element with id "tictactoe". If the
* page has no such element, it will just be added at the end of
* the body.
*/
(function () {
var squares = [],
EMPTY = "\xA0",
score,
moves,
turn = "X",
oldOnload,
/*
* To determine a win condition, each square is "tagged" from left
* to right, top to bottom, with successive powers of 2. Each cell
* thus represents an individual bit in a 9-bit string, and a
* player's squares at any given time can be represented as a
* unique 9-bit value. A winner can thus be easily determined by
* checking whether the player's current 9 bits have covered any
* of the eight "three-in-a-row" combinations.
*
* 273 84
* \ /
* 1 | 2 | 4 = 7
* -----+-----+-----
* 8 | 16 | 32 = 56
* -----+-----+-----
* 64 | 128 | 256 = 448
* =================
* 73 146 292
*
*/
wins = [7, 56, 448, 73, 146, 292, 273, 84],
/*
* Clears the score and move count, erases the board, and makes it
* X's turn.
*/
startNewGame = function () {
var i;
turn = "X";
score = {"X": 0, "O": 0};
moves = 0;
for (i = 0; i < squares.length; i += 1) {
squares[i].firstChild.nodeValue = EMPTY;
}
},
/*
* Returns whether the given score is a winning score.
*/
win = function (score) {
var i;
for (i = 0; i < wins.length; i += 1) {
if ((wins[i] & score) === wins[i]) {
return true;
}
}
return false;
},
/*
* Sets the clicked-on square to the current player's mark,
* then checks for...