Connect Four - Revision history

Admin at 18:07, 4 April 2014

2014-04-04T18:07:21Z

2014-04-04T18:07:11Z

2014-04-04T17:52:07Z

2014-04-04T17:51:38Z

2014-04-04T16:36:46Z

‎Check Functions

2014-04-04T16:36:06Z

2014-04-04T16:29:37Z

‎Drawing Functions:

2014-04-04T16:28:53Z

‎Check Functions

2014-04-04T16:28:06Z

2014-04-04T16:27:49Z

@@ Line 55: / Line 55: @@
 ** Look at drawChip() to see how you convert from column to x-coordinate.  It looks similar, but instead, solve for the column variable to convert from x-coordinate to row
 ** Be sure to use Math.floor() to round down to an integer
 === Drop Chip Function ===
 * dropChip(ctx, c, color)

@@ Line 49: / Line 49: @@
 ** Do NOT use any if-statements.  This should be a very simple math equation
 ** Look at drawChip() to see how you convert from row to y-coordinate.  It looks similar, but instead, solve for the row variable to convert from y-coordinate to row
 * getCol(x)
 ** Takes an x-coordinate and returns the corresponding column number
 ** Do NOT use any if-statements.  This should be a very simple math equation
 ** Look at drawChip() to see how you convert from column to x-coordinate.  It looks similar, but instead, solve for the column variable to convert from x-coordinate to row
+** Be sure to use Math.floor() to round down to an integer
 === Drop Chip Function ===
 * dropChip(ctx, c, color)

@@ Line 68: / Line 68: @@
 *# This can be simply be done in one line of code (THINK about what the board looks like)
 * checkFullBoard()
-*# Use a for loop to iterate through the top row to check if there are any empty spots.  Return false if the board is not full, and return true if the board is full
+*# Use a for loop to iterate through the top row to check if there are any empty spots.
 * checkRows()
 *# Use nested for loops to go through the row and columns to check if there are 4 horizontally matching chips

@@ Line 68: / Line 68: @@
 *# This can be simply be done in one line of code (THINK about what the board looks like)
 * checkFullBoard()
-*# Use a nested for loop to iterate through every row and column.  If there is ever an empty slot (empty string), then return false (because the board is not full)
+*# Use a for loop to iterate through the top row to check if there are any empty spots.  Return false if the board is not full, and return true if the board is full
 * checkRows()
 *# Use nested for loops to go through the row and columns to check if there are 4 horizontally matching chips

@@ Line 65: / Line 65: @@
 === Check Functions ===
 * checkValidDrop(c)
-** Takes a column number and returns true if a chip can be dropped in that column, and false otherwise
+*# Takes a column number and returns true if a chip can be dropped in that column, and false otherwise
-** This can be simply be done in one line of code (THINK about what the board looks like)
+*# This can be simply be done in one line of code (THINK about what the board looks like)
 * checkFullBoard()
 *# Use a nested for loop to iterate through every row and column.  If there is ever an empty slot (empty string), then return false (because the board is not full)

@@ Line 56: / Line 56: @@
 === Drop Chip Function ===
 * dropChip(ctx, c, color)
-** Takes a context, a column '''c''', and a color string
+*# Takes a context, a column '''c''', and a color string
-** Use a loop to find the lowest available opening in that column.  The best loop would iterate from the bottom row (numRows-1) through 0.  Check if board[r][c] matches the empty string, and then you can place the color in the board '''and''' and draw the chip at that [r][c] location
+*# Use a loop to find the lowest available opening in that column.  The best loop would iterate from the bottom row (numRows-1) through 0.
 * IMPORTANT: Test your Connect Four program to see if dropChip() works when you click anywhere in a column.  You will need to add the mouse click event to your main() function and call dropChip() inside your the mouse-click function

@@ Line 35: / Line 35: @@
 === Drawing Functions: ===
 * drawBoard(ctx)
-** Takes a context variable ctx as a parameter.
+*# Takes a context variable ctx as a parameter
-** Use the ctx variable to draw all the white circles for the yellow board.
+*# Use the ctx variable to draw all the white circles for the yellow board
-** You'll want to use a nested for loop to go through all the [r][c] combinations
+*# You'll want to use a nested for loop to go through all the [r][c] combinations
-** You could then call the drawChip() function below to draw a white circle inside the nested for loop
+*# You could then call the drawChip() function below to draw a white circle inside the nested for loop
-** Test the drawBoard() function to make sure that it works
+*# Test the drawBoard() function to make sure that it works
 * drawChip(ctx, color, r, c)
 *# Use the color parameter to set the fill color

@@ Line 66: / Line 66: @@
 ** Test your checkValidDrop(c)
 * checkFullBoard()
-** Use a nested for loop to iterate through every row and column.  If there is ever an empty slot (empty string), then return false (because the board is not full)
+*# Use a nested for loop to iterate through every row and column.  If there is ever an empty slot (empty string), then return false (because the board is not full)
-** Otherwise, '''after the loop''' return true
+*# Otherwise, '''after the loop''' return true
 * checkRows()
 *# Use nested for loops to go through the row and columns to check if there are 4 horizontally matching chips

@@ Line 29: / Line 29: @@
 *## After you push the empty list, push an empty string into that row
 *# Draw the board graphically using drawBoard()
-* Clicked Function *
+* clicked()
 ** The clicked function is defined in the '''main()''' function that you have already defined
 ** After the clicked function definition, add the event listening line so that mouse clicks are detected: '''canvas.addEventListener('click', clicked);'''