Skip to content

Commit a8ce1da

Browse files
authored
Update Part3_FrontEndProject.js
1 parent f02554d commit a8ce1da

File tree

1 file changed

+85
-85
lines changed

1 file changed

+85
-85
lines changed

ConnectFour/Part3_FrontEndProject.js

Lines changed: 85 additions & 85 deletions
Original file line numberDiff line numberDiff line change
@@ -10,95 +10,95 @@ var game_on = true;
1010
var table = $('table tr');
1111

1212
// http://stackoverflow.com/questions/6139407/getting-td-by-index-with-jquery
13-
function reportWin(rowNum,colNum) {
14-
console.log("You won starting at this row,col");
15-
console.log(rowNum);
16-
console.log(colNum);
13+
function reportWin(rowNum, colNum) {
14+
console.log("You won starting at this row,col");
15+
console.log(rowNum);
16+
console.log(colNum);
1717
}
1818
// Change the color of a button
19-
function changeColor(rowIndex,colIndex,color) {
20-
return table.eq(rowIndex).find('td').eq(colIndex).find('button').css('background-color',color);
19+
function changeColor(rowIndex, colIndex, color) {
20+
return table.eq(rowIndex).find('td').eq(colIndex).find('button').css('background-color', color);
2121
}
2222

2323
// Report Back to current color of a button
24-
function returnColor(rowIndex,colIndex) {
25-
return table.eq(rowIndex).find('td').eq(colIndex).find('button').css('background-color');
24+
function returnColor(rowIndex, colIndex) {
25+
return table.eq(rowIndex).find('td').eq(colIndex).find('button').css('background-color');
2626
}
2727

2828
// Take in column index, returns the bottom row that is still gray
2929
function checkBottom(colIndex) {
30-
var colorReport = returnColor(5,colIndex);
31-
for (var row = 5; row > -1; row--) {
32-
colorReport = returnColor(row,colIndex);
33-
if (colorReport === 'rgb(128, 128, 128)') {
34-
return row
35-
}
36-
}
30+
var colorReport = returnColor(5, colIndex);
31+
for (var row = 5; row > -1; row--) {
32+
colorReport = returnColor(row, colIndex);
33+
if (colorReport === 'rgb(128, 128, 128)') {
34+
return row
35+
}
36+
}
3737
}
3838

3939
// Check to see if 4 inputs are the same color
40-
function colorMatchCheck(one,two,three,four){
41-
return (one===two && one===three && one===four && one !== 'rgb(128, 128, 128)' && one !== undefined);
40+
function colorMatchCheck(one, two, three, four) {
41+
return (one === two && one === three && one === four && one !== 'rgb(128, 128, 128)' && one !== undefined);
4242
}
4343

4444
// Check for Horizontal Wins
4545
function horizontalWinCheck() {
46-
for (var row = 0; row < 6; row++) {
47-
for (var col = 0; col < 4; col++) {
48-
if (colorMatchCheck(returnColor(row,col), returnColor(row,col+1) ,returnColor(row,col+2), returnColor(row,col+3))) {
49-
console.log('horiz');
50-
reportWin(row,col);
51-
return true;
52-
}else {
53-
continue;
54-
}
55-
}
56-
}
46+
for (var row = 0; row < 6; row++) {
47+
for (var col = 0; col < 4; col++) {
48+
if (colorMatchCheck(returnColor(row, col), returnColor(row, col + 1), returnColor(row, col + 2), returnColor(row, col + 3))) {
49+
console.log('horiz');
50+
reportWin(row, col);
51+
return true;
52+
} else {
53+
continue;
54+
}
55+
}
56+
}
5757
}
5858

5959
// Check for Vertical Wins
6060
function verticalWinCheck() {
61-
for (var col = 0; col < 7; col++) {
62-
for (var row = 0; row < 3; row++) {
63-
if (colorMatchCheck(returnColor(row,col), returnColor(row+1,col) ,returnColor(row+2,col), returnColor(row+3,col))) {
64-
console.log('vertical');
65-
reportWin(row,col);
66-
return true;
67-
}else {
68-
continue;
69-
}
70-
}
71-
}
61+
for (var col = 0; col < 7; col++) {
62+
for (var row = 0; row < 3; row++) {
63+
if (colorMatchCheck(returnColor(row, col), returnColor(row + 1, col), returnColor(row + 2, col), returnColor(row + 3, col))) {
64+
console.log('vertical');
65+
reportWin(row, col);
66+
return true;
67+
} else {
68+
continue;
69+
}
70+
}
71+
}
7272
}
7373

7474
// Check for Diagonal Wins
7575
function diagonalWinCheck() {
76-
for (var col = 0; col < 5; col++) {
77-
for (var row = 0; row < 7; row++) {
78-
if (colorMatchCheck(returnColor(row,col), returnColor(row+1,col+1) ,returnColor(row+2,col+2), returnColor(row+3,col+3))) {
79-
console.log('diag');
80-
reportWin(row,col);
81-
return true;
82-
}else if (colorMatchCheck(returnColor(row,col), returnColor(row-1,col+1) ,returnColor(row-2,col+2), returnColor(row-3,col+3))) {
83-
console.log('diag');
84-
reportWin(row,col);
85-
return true;
86-
}else {
87-
continue;
88-
}
89-
}
90-
}
76+
for (var col = 0; col < 5; col++) {
77+
for (var row = 0; row < 7; row++) {
78+
if (colorMatchCheck(returnColor(row, col), returnColor(row + 1, col + 1), returnColor(row + 2, col + 2), returnColor(row + 3, col + 3))) {
79+
console.log('diag');
80+
reportWin(row, col);
81+
return true;
82+
} else if (colorMatchCheck(returnColor(row, col), returnColor(row - 1, col + 1), returnColor(row - 2, col + 2), returnColor(row - 3, col + 3))) {
83+
console.log('diag');
84+
reportWin(row, col);
85+
return true;
86+
} else {
87+
continue;
88+
}
89+
}
90+
}
9191
}
9292

9393
// Game End
9494
function gameEnd(winningPlayer) {
95-
for (var col = 0; col < 7; col++) {
96-
for (var row = 0; row < 7; row++) {
97-
$('h3').fadeOut('fast');
98-
$('h2').fadeOut('fast');
99-
$('h1').text(winningPlayer+" has won! Refresh your browser to play again!").css("fontSize", "50px")
100-
}
101-
}
95+
for (var col = 0; col < 7; col++) {
96+
for (var row = 0; row < 7; row++) {
97+
$('h3').fadeOut('fast');
98+
$('h2').fadeOut('fast');
99+
$('h1').text(winningPlayer + " has won! Refresh your browser to play again!").css("fontSize", "50px")
100+
}
101+
}
102102
}
103103

104104
// Start with Player One
@@ -107,36 +107,36 @@ var currentName = player1;
107107
var currentColor = player1Color;
108108

109109
// Start with Player One
110-
$('h3').text(player1+": it is your turn, please pick a column to drop your blue chip.");
110+
$('h3').text(player1 + ": it is your turn, please pick a column to drop your blue chip.");
111111

112-
$('.board button').on('click',function() {
112+
$('.board button').on('click', function() {
113113

114-
// Recognize what column was chosen
115-
var col = $(this).closest("td").index();
114+
// Recognize what column was chosen
115+
var col = $(this).closest("td").index();
116116

117-
// Get back bottom available row to change
118-
var bottomAvail = checkBottom(col);
117+
// Get back bottom available row to change
118+
var bottomAvail = checkBottom(col);
119119

120-
// Drop the chip in that column at the bottomAvail Row
121-
changeColor(bottomAvail,col,currentColor);
120+
// Drop the chip in that column at the bottomAvail Row
121+
changeColor(bottomAvail, col, currentColor);
122122

123-
// Check for a win or a tie.
124-
if (horizontalWinCheck() || verticalWinCheck() || diagonalWinCheck()) {
125-
gameEnd(currentName);
126-
}
123+
// Check for a win or a tie.
124+
if (horizontalWinCheck() || verticalWinCheck() || diagonalWinCheck()) {
125+
gameEnd(currentName);
126+
}
127127

128-
// If no win or tie, continue to next player
129-
currentPlayer = currentPlayer * -1 ;
128+
// If no win or tie, continue to next player
129+
currentPlayer = currentPlayer * -1;
130130

131-
// Re-Check who the current Player is.
132-
if (currentPlayer === 1) {
133-
currentName = player1;
134-
$('h3').text(currentName+": it is your turn, please pick a column to drop your blue chip.");
135-
currentColor = player1Color;
136-
}else {
137-
currentName = player2
138-
$('h3').text(currentName+": it is your turn, please pick a column to drop your red chip.");
139-
currentColor = player2Color;
140-
}
131+
// Re-Check who the current Player is.
132+
if (currentPlayer === 1) {
133+
currentName = player1;
134+
$('h3').text(currentName + ": it is your turn, please pick a column to drop your blue chip.");
135+
currentColor = player1Color;
136+
} else {
137+
currentName = player2
138+
$('h3').text(currentName + ": it is your turn, please pick a column to drop your red chip.");
139+
currentColor = player2Color;
140+
}
141141

142142
})

0 commit comments

Comments
 (0)