Tic-Tac-Toe - Revision history

Admin at 18:39, 13 March 2014

2014-03-13T18:39:04Z

Admin at 18:38, 13 March 2014

2014-03-13T18:38:38Z

Admin at 17:29, 13 March 2014

2014-03-13T17:29:45Z

Admin: /* X Y Coordinate-Row Col Translation Functions: */

2014-03-12T17:58:32Z

‎X Y Coordinate-Row Col Translation Functions:

Admin at 17:10, 12 March 2014

2014-03-12T17:10:44Z

Admin at 17:09, 12 March 2014

2014-03-12T17:09:23Z

Admin at 17:08, 12 March 2014

2014-03-12T17:08:50Z

Admin at 17:08, 12 March 2014

2014-03-12T17:08:14Z

Admin at 17:06, 12 March 2014

2014-03-12T17:06:35Z

Admin at 17:01, 12 March 2014

2014-03-12T17:01:31Z

@@ Line 43: / Line 43: @@
 *** r - row number
 *** c - column number
-** Check if the shape variable is an X, and then you'll have a bunch of if statements to check what the row and column numbers are.  For each of the 9 row-column combinations (e.g. r==0 && c==0), you call drawX() to draw an X at the corresponding (x,y) location.  For example, if r==0 && c==0, then drawX(ctx, cWidth/6, cHeight/6)
+** Check if the shape variable is an "X", and then you'll have a bunch of if statements to check what the row and column numbers are.  For each of the 9 row-column combinations (e.g. r==0 && c==0), you call drawX() to draw an X at the corresponding (x,y) location.  For example, if r==0 && c==0, then drawX(ctx, cWidth/6, cHeight/6)
-** Check if the shape variable is O, and then do the same if statements that you have for drawing the X.  The only difference is that you call drawO() instead of drawX()
+** Check if the shape variable is "O", and then do the same if statements that you have for drawing the X.  The only difference is that you call drawO() instead of drawX()
 === X Y Coordinate-Row Col Translation Functions: ===

@@ Line 36: / Line 36: @@
 ** Use the ctx variable to draw an O at the coordinate (x, y)
 ** Test the drawY(ctx, x, y) function to make sure that it works
 === X Y Coordinate-Row Col Translation Functions: ===

@@ Line 30: / Line 30: @@
 ** Takes 3 parameters, a context variable for drawing, x-coordinate, and y-coordinate.
 ** Use the ctx variable to draw an X at the coordinate (x, y)
-** Test the drawX(ctx, x, y) function to make sure that it works.  The easiest way may be to link drawX() to mouse-clicks for testing
+** Test the drawX(ctx, x, y) function to make sure that it works
 * drawO(ctx, x, y)
 ** Takes 3 parameters, a context variable for drawing, x-coordinate, and y-coordinate.
 ** Use the ctx variable to draw an O at the coordinate (x, y)
-** Test the drawY(ctx, x, y) function to make sure that it works.  The easiest way may be to link drawY() to mouse-clicks for testing
+** Test the drawY(ctx, x, y) function to make sure that it works
 === X Y Coordinate-Row Col Translation Functions: ===

@@ Line 51: / Line 51: @@
 ** Use if-statements to check which column of the canvas the x-coordinate is found. The left third of the canvas is Col 0, the middle third is Col 1, and the right third is Col 2
 *** If x is less than cWidth/3, then return 0
-*** If y is between 1/3 and 2/3 of cWidth, then return 1
+*** If x is between 1/3 and 2/3 of cWidth, then return 1
-*** If y is greater than 2/3 of cWidth, then return 2
+*** If x is greater than 2/3 of cWidth, then return 2
 === Check Functions: ===

@@ Line 6: / Line 6: @@
 == Directions ==
 * The Tic-Tac-Toe game must be broken up into manageable pieces. The variables and functions specified below will help guide your development.  We will develop the game in the following order:
 *# Write a function to draw the board
 *# Write the functions to draw the two different shapes

@@ Line 22: / Line 22: @@
 * turn – the current player’s turn (0 or 1)
-'''Drawing Functions:'''
+=== Drawing Functions: ===
 * drawBoard(ctx)
 ** Takes a context variable ctx as a parameter.
@@ Line 38: / Line 38: @@
 ** Test the drawY(ctx, x, y) function to make sure that it works.  The easiest way may be to link drawY() to mouse-clicks for testing
-'''X Y Coordinate-Row Col Translation Functions:'''
+=== X Y Coordinate-Row Col Translation Functions: ===
 * getRow(y)
 ** Takes a single y-coordinate as a parameter
@@ Line 55: / Line 55: @@
 *** If y is greater than 2/3 of cWidth, then return 2
-'''Check Functions:'''
+=== Check Functions: ===
 * checkValidMove(row, col)
 ** Checks if the board element at [row][col] has a move already in it

@@ Line 13: / Line 13: @@
 *# Integrate our functions to the canvas’s mouse-click event handler
-'''Variables:'''
+=== Variables:===
-Initialize the following variables to starting default values at the top of your JavaScript file
+* Initialize the following variables to starting default values at the top of your JavaScript file
 * cHeight – the height of the canvas

@@ Line 26: / Line 26: @@
 ** Takes a context variable ctx as a parameter.
 ** Use the ctx variable to draw the lines for the board.  You should draw the lines 1/3 spaced apart.  The easiest way to do this is to use cWidth and cHeight and manipulate them with math. Example: cWidth/3
-** Test the drawBoard() function
+** Test the drawBoard() function to make sure that it works
-drawX(ctx, x, y)
+* drawX(ctx, x, y)
--	Takes 3 parameters, a context variable for drawing, x-coordinate, and y-coordinate.
+** Takes 3 parameters, a context variable for drawing, x-coordinate, and y-coordinate.
--	Use the ctx variable to draw an X at the coordinate (x, y)
+** Use the ctx variable to draw an X at the coordinate (x, y)
--	Test the drawX(ctx, x, y) function
+** Test the drawX(ctx, x, y) function to make sure that it works.  The easiest way may be to link drawX() to mouse-clicks for testing
-drawO(ctx, x, y)
+* drawO(ctx, x, y)
--	Takes 3 parameters, a context variable for drawing, x-coordinate, and y-coordinate.
+** Takes 3 parameters, a context variable for drawing, x-coordinate, and y-coordinate.
--	Use the ctx variable to draw an O at the coordinate (x, y)
+** Use the ctx variable to draw an O at the coordinate (x, y)
--	Test the drawO(ctx, x, y) function
+** Test the drawY(ctx, x, y) function to make sure that it works.  The easiest way may be to link drawY() to mouse-clicks for testing
-getRow(y)
+* getRow(y)
--	Takes a single y-coordinate as a parameter
+** Takes a single y-coordinate as a parameter
--	We will use getRow() to determine which row is clicked by analyzing the y-coordinate
+** We will use getRow() to determine which row is clicked by analyzing the y-coordinate
--	Use if-statements to check which row of the canvas the y-coordinate is found. The top third of the canvas is Row 0, the middle third is Row 1, and the bottom third is Row 2
+** Use if-statements to check which row of the canvas the y-coordinate is found. The top third of the canvas is Row 0, the middle third is Row 1, and the bottom third is Row 2
-o	If y is less than cHeight/3, then return 0
+*** If y is less than cHeight/3, then return 0
-o	If y is between 1/3 and 2/3 of cHeight, then return 1
+*** If y is between 1/3 and 2/3 of cHeight, then return 1
-o	If y is greater than 2/3 of cHeight, then return 2
+*** If y is greater than 2/3 of cHeight, then return 2
-getCol(x)
+* getCol(x)
--	Takes a single x-coordinate as a parameter
+** Takes a single x-coordinate as a parameter
--	We will use getCol() to determine which column is clicked by analyzing the x-coordinate
+** We will use getCol() to determine which column is clicked by analyzing the x-coordinate
--	Use if-statements to check which column of the canvas the x-coordinate is found. The left third of the canvas is Col 0, the middle third is Col 1, and the right third is Col 2
+** Use if-statements to check which column of the canvas the x-coordinate is found. The left third of the canvas is Col 0, the middle third is Col 1, and the right third is Col 2
-o	If x is less than cWidth/3, then return 0
+*** If x is less than cWidth/3, then return 0
-o	If y is between 1/3 and 2/3 of cWidth, then return 1
+*** If y is between 1/3 and 2/3 of cWidth, then return 1
-o	If y is greater than 2/3 of cWidth, then return 2
+*** If y is greater than 2/3 of cWidth, then return 2
-checkValidMove(row, col)
+* checkValidMove(row, col)
--	Checks if the board element at [row][col] has a move already in it
+** Checks if the board element at [row][col] has a move already in it
--	Return true if board[row][col] is equal to empty string “”, and false otherwise
+* Return true if board[row][col] is equal to empty string “”, and false otherwise
-checkWin()
+* checkWin()
--	Checks to see if there is a winner (3 lined up Xs or Os)
+** Checks to see if there is a winner (3 lined up Xs or Os). Returns “X” if X wins, “O” if O wins, and “” if there is still no winner
-o	Checks the 3 rows
+*** Checks the 3 rows
-o	Checks the 3 columns
+*** Checks the 3 columns
-o	Checks the 2 diagonals
+*** Checks the 2 diagonals
-checkFull()
+* checkFull()
--	Checks to see if every element in board[][] has been filled
+** Checks to see if every element in board[][] has been filled
--	Return false if any of the elements in board[][] are equal to “”
+** Return false if any of the elements in board[][] are equal to empty string ("")
--	Return true if every element in board[][] is not equal to “”
+** Return true if every element in board[][] is not equal to empty string ("")