diff --git a/ConnectFourGame/index.html b/ConnectFourGame/index.html
new file mode 100644
index 0000000..440b295
--- /dev/null
+++ b/ConnectFourGame/index.html
@@ -0,0 +1,89 @@
+
+
+
+
+
+ Connect Four Game
+
+
+
+
+
+
+
+
+
Connect Four Game!
+ BY HIMANSHU KUMAR AMB
+
+
+
+
+
+
+ |
+ |
+ |
+ |
+ |
+ |
+ |
+
+
+
+ |
+ |
+ |
+ |
+ |
+ |
+ |
+
+
+
+ |
+ |
+ |
+ |
+ |
+ |
+ |
+
+
+
+ |
+ |
+ |
+ |
+ |
+ |
+ |
+
+
+
+ |
+ |
+ |
+ |
+ |
+ |
+ |
+
+
+
+ |
+ |
+ |
+ |
+ |
+ |
+ |
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/ConnectFourGame/script.js b/ConnectFourGame/script.js
new file mode 100644
index 0000000..64ef81b
--- /dev/null
+++ b/ConnectFourGame/script.js
@@ -0,0 +1,194 @@
+var player1 = prompt("Player One: Enter Your Name , You will be Blue");
+console.log("Player One is :- " + player1)
+var player1Color = 'rgb(86, 151, 255)';
+var player2 = prompt("Player Two: Enter Your Name , You will be Red");
+console.log("Player Two is :- " + player2)
+var player2Color = 'rgb(237, 45, 73)';
+var game_on = true;
+var table = $('table tr');
+
+function reportwin(rowNum, colNum) {
+ console.log(currentName + " You won starting at this row,col :- (" + (rowNum + 1) + "," + (colNum + 1) + ")");
+
+}
+
+function changeColor(rowIndex, colIndex, color) {
+ return table.eq(rowIndex).find('td').eq(colIndex).find('button').css('background-color', color);
+}
+
+function returnColor(rowIndex, colIndex) {
+ return table.eq(rowIndex).find('td').eq(colIndex).find('button').css('background-color');
+}
+function checkBottom(colIndex) {
+ var colorReport = returnColor(5, colIndex)
+ for (var row = 5; row > -1; row--) {
+ colorReport = returnColor(row, colIndex);
+ if (colorReport === 'rgb(128, 128, 128)') {
+ return row
+ }
+ }
+}
+function colorMatchCheck(one, two, three, four) {
+ return (one === two && one === three && one === four && one !== 'rgb(128, 128, 128)' && one !== undefined)
+}
+function horizontalWinCheck() {
+ for (var row = 0; row < 6; row++) {
+ for (var col = 0; col < 4; col++) {
+ if (colorMatchCheck(returnColor(row, col), returnColor(row, col + 1), returnColor(row, col + 2), returnColor(row, col + 3))) {
+ console.log('Horizontal Win');
+ reportwin(row, col);
+ return true;
+ } else {
+ continue;
+ }
+ }
+ }
+}
+function verticalWinCheck() {
+ for (var col = 0; col < 7; col++) {
+ for (var row = 0; row < 3; row++) {
+ if (colorMatchCheck(returnColor(row, col), returnColor(row + 1, col), returnColor(row + 2, col), returnColor(row + 3, col))) {
+ console.log('Vertical Win');
+ reportwin(row, col);
+ return true;
+ } else {
+ continue;
+ }
+ }
+ }
+}
+function diagonalWinCheck() {
+ for (var col = 0; col < 5; col++) {
+ for (var row = 0; row < 7; row++) {
+ if (colorMatchCheck(returnColor(row, col), returnColor(row + 1, col + 1), returnColor(row + 2, col + 2), returnColor(row + 3, col + 3))) {
+ console.log('Diagonal Win');
+ reportwin(row, col);
+ return true;
+ } else if (colorMatchCheck(returnColor(row, col), returnColor(row - 1, col + 1), returnColor(row - 2, col + 2), returnColor(row - 3, col + 3))) {
+
+ reportwin(row, col);
+ return true;
+ } else {
+ continue;
+ }
+ }
+ }
+}
+var currentPlayer = 1;
+var currentName = player1;
+var currentColor = player1Color;
+
+$('h3').text(player1 + " it is your turn, pick a column to drop in!")
+
+$('.board button').on('click', function () {
+ var col = $(this).closest('td').index();
+ var bottomAvail = checkBottom(col);
+ changeColor(bottomAvail, col, currentColor);
+ if (horizontalWinCheck() || verticalWinCheck() || diagonalWinCheck()) {
+ $('h1').text(currentName + " You have Won!")
+ $("h2").text("Refresh to play again")
+ $('h3').fadeOut(20);
+ $('.container').fadeOut(3000);
+ console.log(currentName + " You have Won!")
+ game_on = false;
+ }
+ currentPlayer = currentPlayer * -1;
+ if (currentPlayer === 1) {
+ currentName = player1;
+ $('h3').text(currentName + " it is your turn, pick a column to drop in!")
+ currentColor = player1Color;
+ } else {
+ currentName = player2;
+ $('h3').text(currentName + " it is your turn, pick a column to drop in!")
+ currentColor = player2Color;
+ }
+ if (game_on === false) {
+ $('h3').text("Refresh the page to Play Again!")
+ }
+})
+
+
+
+$("#tsparticles")
+ .particles()
+ .init(
+ {
+ background: {
+ color: {
+ value: "#171717",
+ },
+ },
+ fpsLimit: 60,
+ interactivity: {
+ detectsOn: "canvas",
+ events: {
+ onClick: {
+ enable: true,
+ mode: "push",
+ },
+ onHover: {
+ enable: true,
+ mode: "repulse",
+ },
+ resize: true,
+ },
+ modes: {
+ bubble: {
+ distance: 400,
+ duration: 2,
+ opacity: 0.8,
+ size: 40,
+ },
+ push: {
+ quantity: 4,
+ },
+ repulse: {
+ distance: 200,
+ duration: 0.4,
+ },
+ },
+ },
+ particles: {
+ color: {
+ value: "#ffffff",
+ },
+ links: {
+ color: "#ffffff",
+ distance: 150,
+ enable: true,
+ opacity: 0.5,
+ width: 1,
+ },
+ collisions: {
+ enable: true,
+ },
+ move: {
+ direction: "none",
+ enable: true,
+ outMode: "bounce",
+ random: false,
+ speed: 6,
+ straight: false,
+ },
+ number: {
+ density: {
+ enable: true,
+ value_area: 800,
+ },
+ value: 80,
+ },
+ opacity: {
+ value: 0.5,
+ },
+ shape: {
+ type: "circle",
+ },
+ size: {
+ random: true,
+ value: 7,
+ },
+ },
+ detectRetina: true,
+ },
+
+ );
\ No newline at end of file
diff --git a/ConnectFourGame/style.css b/ConnectFourGame/style.css
new file mode 100644
index 0000000..da0543a
--- /dev/null
+++ b/ConnectFourGame/style.css
@@ -0,0 +1,35 @@
+.container{
+ position: relative;
+ top: 0px;
+ left: 0px;
+ width: 100%;
+ color: white;
+
+}
+#tsparticles{
+ position: absolute;
+ left: 0px ;
+ top: 0px;
+ width: 100%;
+ height: 100vh;
+ z-index: -1;
+}
+.board button{
+ width:90px;
+ height:90px;
+ background-color: gray;
+ margin: 1px;
+ border: 4px solid black;
+ border-radius: 50%;
+}
+.board{
+ transition: 0.8s;
+ box-shadow: 0px 0px 10px rgb(255, 255, 255);
+}
+.board:hover{
+ box-shadow: 0px 0px 40px rgb(13, 255, 73);
+}
+p{
+ text-align: right;
+ font-size: 2em;
+}
\ No newline at end of file