diff --git a/tic_tac_toe/index.html b/tic_tac_toe/index.html new file mode 100644 index 0000000..f3c4ce0 --- /dev/null +++ b/tic_tac_toe/index.html @@ -0,0 +1,60 @@ + + + + + + + + + + + + + +
+

TIC TAC TOE

+ +

Game starts by just Tap on + box

First Player starts as + Player X
And
Second + Player as Player 0 +

+ + + + +

+ + + + + +

+ + + + + + +

+ + + + + + +


+ + +

+

+ + + + +
+ + + \ No newline at end of file diff --git a/tic_tac_toe/script.js b/tic_tac_toe/script.js new file mode 100644 index 0000000..514f717 --- /dev/null +++ b/tic_tac_toe/script.js @@ -0,0 +1,362 @@ +function myfunc() { + + var b1, b2, b3, b4, b5, b6, b7, b8, b9; + b1 = document.getElementById("b1").value; + b2 = document.getElementById("b2").value; + b3 = document.getElementById("b3").value; + b4 = document.getElementById("b4").value; + b5 = document.getElementById("b5").value; + b6 = document.getElementById("b6").value; + b7 = document.getElementById("b7").value; + b8 = document.getElementById("b8").value; + b9 = document.getElementById("b9").value; + + if ((b1 == 'x' || b1 == 'X') && (b2 == 'x' || + b2 == 'X') && (b3 == 'x' || b3 == 'X')) { + document.getElementById('print') + .innerHTML = "Player X won"; + document.getElementById("b4").disabled = true; + document.getElementById("b5").disabled = true; + document.getElementById("b6").disabled = true; + document.getElementById("b7").disabled = true; + document.getElementById("b8").disabled = true; + document.getElementById("b9").disabled = true; + window.alert('Player X won'); + } + else if ((b1 == 'x' || b1 == 'X') && (b4 == 'x' || + b4 == 'X') && (b7 == 'x' || b7 == 'X')) { + document.getElementById('print') + .innerHTML = "Player X won"; + document.getElementById("b2").disabled = true; + document.getElementById("b3").disabled = true; + document.getElementById("b5").disabled = true; + document.getElementById("b6").disabled = true; + document.getElementById("b8").disabled = true; + document.getElementById("b9").disabled = true; + + window.alert('Player X won'); + } + else if ((b7 == 'x' || b7 == 'X') && (b8 == 'x' || + b8 == 'X') && (b9 == 'x' || b9 == 'X')) { + document.getElementById('print') + .innerHTML = "Player X won"; + document.getElementById("b1").disabled = true; + document.getElementById("b2").disabled = true; + document.getElementById("b3").disabled = true; + document.getElementById("b4").disabled = true; + document.getElementById("b5").disabled = true; + document.getElementById("b6").disabled = true; + window.alert('Player X won'); + } + else if ((b3 == 'x' || b3 == 'X') && (b6 == 'x' || + b6 == 'X') && (b9 == 'x' || b9 == 'X')) { + document.getElementById('print') + .innerHTML = "Player X won"; + document.getElementById("b1").disabled = true; + document.getElementById("b2").disabled = true; + document.getElementById("b4").disabled = true; + document.getElementById("b5").disabled = true; + document.getElementById("b7").disabled = true; + document.getElementById("b8").disabled = true; + window.alert('Player X won'); + } + else if ((b1 == 'x' || b1 == 'X') && (b5 == 'x' || + b5 == 'X') && (b9 == 'x' || b9 == 'X')) { + document.getElementById('print') + .innerHTML = "Player X won"; + document.getElementById("b2").disabled = true; + document.getElementById("b3").disabled = true; + document.getElementById("b4").disabled = true; + document.getElementById("b6").disabled = true; + document.getElementById("b7").disabled = true; + document.getElementById("b8").disabled = true; + window.alert('Player X won'); + } + else if ((b3 == 'x' || b3 == 'X') && (b5 == 'x' || + b5 == 'X') && (b7 == 'x' || b7 == 'X')) { + document.getElementById('print') + .innerHTML = "Player X won"; + document.getElementById("b1").disabled = true; + document.getElementById("b2").disabled = true; + document.getElementById("b4").disabled = true; + document.getElementById("b6").disabled = true; + document.getElementById("b8").disabled = true; + document.getElementById("b9").disabled = true; + window.alert('Player X won'); + } + else if ((b2 == 'x' || b2 == 'X') && (b5 == 'x' || + b5 == 'X') && (b8 == 'x' || b8 == 'X')) { + document.getElementById('print') + .innerHTML = "Player X won"; + document.getElementById("b1").disabled = true; + document.getElementById("b3").disabled = true; + document.getElementById("b4").disabled = true; + document.getElementById("b6").disabled = true; + document.getElementById("b7").disabled = true; + document.getElementById("b9").disabled = true; + window.alert('Player X won'); + } + else if ((b4 == 'x' || b4 == 'X') && (b5 == 'x' || + b5 == 'X') && (b6 == 'x' || b6 == 'X')) { + document.getElementById('print') + .innerHTML = "Player X won"; + document.getElementById("b1").disabled = true; + document.getElementById("b2").disabled = true; + document.getElementById("b3").disabled = true; + document.getElementById("b7").disabled = true; + document.getElementById("b8").disabled = true; + document.getElementById("b9").disabled = true; + window.alert('Player X won'); + } + + else if ((b1 == '0' || b1 == '0') && (b2 == '0' || + b2 == '0') && (b3 == '0' || b3 == '0')) { + document.getElementById('print') + .innerHTML = "Player 0 won"; + document.getElementById("b4").disabled = true; + document.getElementById("b5").disabled = true; + document.getElementById("b6").disabled = true; + document.getElementById("b7").disabled = true; + document.getElementById("b8").disabled = true; + document.getElementById("b9").disabled = true; + window.alert('Player 0 won'); + } + else if ((b1 == '0' || b1 == '0') && (b4 == '0' || + b4 == '0') && (b7 == '0' || b7 == '0')) { + document.getElementById('print') + .innerHTML = "Player 0 won"; + document.getElementById("b2").disabled = true; + document.getElementById("b3").disabled = true; + document.getElementById("b5").disabled = true; + document.getElementById("b6").disabled = true; + document.getElementById("b8").disabled = true; + document.getElementById("b9").disabled = true; + window.alert('Player 0 won'); + } + else if ((b7 == '0' || b7 == '0') && (b8 == '0' || + b8 == '0') && (b9 == '0' || b9 == '0')) { + document.getElementById('print') + .innerHTML = "Player 0 won"; + document.getElementById("b1").disabled = true; + document.getElementById("b2").disabled = true; + document.getElementById("b3").disabled = true; + document.getElementById("b4").disabled = true; + document.getElementById("b5").disabled = true; + document.getElementById("b6").disabled = true; + window.alert('Player 0 won'); + } + else if ((b3 == '0' || b3 == '0') && (b6 == '0' || + b6 == '0') && (b9 == '0' || b9 == '0')) { + document.getElementById('print') + .innerHTML = "Player 0 won"; + document.getElementById("b1").disabled = true; + document.getElementById("b2").disabled = true; + document.getElementById("b4").disabled = true; + document.getElementById("b5").disabled = true; + document.getElementById("b7").disabled = true; + document.getElementById("b8").disabled = true; + window.alert('Player 0 won'); + } + else if ((b1 == '0' || b1 == '0') && (b5 == '0' || + b5 == '0') && (b9 == '0' || b9 == '0')) { + document.getElementById('print') + .innerHTML = "Player 0 won"; + document.getElementById("b2").disabled = true; + document.getElementById("b3").disabled = true; + document.getElementById("b4").disabled = true; + document.getElementById("b6").disabled = true; + document.getElementById("b7").disabled = true; + document.getElementById("b8").disabled = true; + window.alert('Player 0 won'); + } + else if ((b3 == '0' || b3 == '0') && (b5 == '0' || + b5 == '0') && (b7 == '0' || b7 == '0')) { + document.getElementById('print') + .innerHTML = "Player 0 won"; + document.getElementById("b1").disabled = true; + document.getElementById("b2").disabled = true; + document.getElementById("b4").disabled = true; + document.getElementById("b6").disabled = true; + document.getElementById("b8").disabled = true; + document.getElementById("b9").disabled = true; + window.alert('Player 0 won'); + } + else if ((b2 == '0' || b2 == '0') && (b5 == '0' || + b5 == '0') && (b8 == '0' || b8 == '0')) { + document.getElementById('print') + .innerHTML = "Player 0 won"; + document.getElementById("b1").disabled = true; + document.getElementById("b3").disabled = true; + document.getElementById("b4").disabled = true; + document.getElementById("b6").disabled = true; + document.getElementById("b7").disabled = true; + document.getElementById("b9").disabled = true; + window.alert('Player 0 won'); + } + else if ((b4 == '0' || b4 == '0') && (b5 == '0' || + b5 == '0') && (b6 == '0' || b6 == '0')) { + document.getElementById('print') + .innerHTML = "Player 0 won"; + document.getElementById("b1").disabled = true; + document.getElementById("b2").disabled = true; + document.getElementById("b3").disabled = true; + document.getElementById("b7").disabled = true; + document.getElementById("b8").disabled = true; + document.getElementById("b9").disabled = true; + window.alert('Player 0 won'); + } + + else if ((b1 == 'X' || b1 == '0') && (b2 == 'X' + || b2 == '0') && (b3 == 'X' || b3 == '0') && + (b4 == 'X' || b4 == '0') && (b5 == 'X' || + b5 == '0') && (b6 == 'X' || b6 == '0') && + (b7 == 'X' || b7 == '0') && (b8 == 'X' || + b8 == '0') && (b9 == 'X' || b9 == '0')) { + document.getElementById('print') + .innerHTML = "Match Tie"; + window.alert('Match Tie'); + } + else { + + if (flag == 1) { + document.getElementById('print') + .innerHTML = "Player X Turn"; + } + else { + document.getElementById('print') + .innerHTML = "Player 0 Turn"; + } + } +} + +function myfunc_2() { + location.reload(); + document.getElementById('b1').value = ''; + document.getElementById("b2").value = ''; + document.getElementById("b3").value = ''; + document.getElementById("b4").value = ''; + document.getElementById("b5").value = ''; + document.getElementById("b6").value = ''; + document.getElementById("b7").value = ''; + document.getElementById("b8").value = ''; + document.getElementById("b9").value = ''; + +} + +flag = 1; +function myfunc_3() { + if (flag == 1) { + document.getElementById("b1").value = "X"; + document.getElementById("b1").disabled = true; + flag = 0; + } + else { + document.getElementById("b1").value = "0"; + document.getElementById("b1").disabled = true; + flag = 1; + } +} + +function myfunc_4() { + if (flag == 1) { + document.getElementById("b2").value = "X"; + document.getElementById("b2").disabled = true; + flag = 0; + } + else { + document.getElementById("b2").value = "0"; + document.getElementById("b2").disabled = true; + flag = 1; + } +} + +function myfunc_5() { + if (flag == 1) { + document.getElementById("b3").value = "X"; + document.getElementById("b3").disabled = true; + flag = 0; + } + else { + document.getElementById("b3").value = "0"; + document.getElementById("b3").disabled = true; + flag = 1; + } +} + +function myfunc_6() { + if (flag == 1) { + document.getElementById("b4").value = "X"; + document.getElementById("b4").disabled = true; + flag = 0; + } + else { + document.getElementById("b4").value = "0"; + document.getElementById("b4").disabled = true; + flag = 1; + } +} + +function myfunc_7() { + if (flag == 1) { + document.getElementById("b5").value = "X"; + document.getElementById("b5").disabled = true; + flag = 0; + } + else { + document.getElementById("b5").value = "0"; + document.getElementById("b5").disabled = true; + flag = 1; + } +} + +function myfunc_8() { + if (flag == 1) { + document.getElementById("b6").value = "X"; + document.getElementById("b6").disabled = true; + flag = 0; + } + else { + document.getElementById("b6").value = "0"; + document.getElementById("b6").disabled = true; + flag = 1; + } +} + +function myfunc_9() { + if (flag == 1) { + document.getElementById("b7").value = "X"; + document.getElementById("b7").disabled = true; + flag = 0; + } + else { + document.getElementById("b7").value = "0"; + document.getElementById("b7").disabled = true; + flag = 1; + } +} + +function myfunc_10() { + if (flag == 1) { + document.getElementById("b8").value = "X"; + document.getElementById("b8").disabled = true; + flag = 0; + } + else { + document.getElementById("b8").value = "0"; + document.getElementById("b8").disabled = true; + flag = 1; + } +} + +function myfunc_11() { + if (flag == 1) { + document.getElementById("b9").value = "X"; + document.getElementById("b9").disabled = true; + flag = 0; + } + else { + document.getElementById("b9").value = "0"; + document.getElementById("b9").disabled = true; + flag = 1; + } +} diff --git a/tic_tac_toe/style.css b/tic_tac_toe/style.css new file mode 100644 index 0000000..8c95ec6 --- /dev/null +++ b/tic_tac_toe/style.css @@ -0,0 +1,58 @@ +h1 { + color: orangered; + font-size: 45px; +} + +#b1, +#b2, +#b3, +#b4, +#b5, +#b6, +#b7, +#b8, +#b9 { + width: 80px; + height: 52px; + margin: auto; + border: 1px solid gray; + border-radius: 6px; + font-size: 30px; + text-align: center; +} + +#but { + box-sizing: border-box; + width: 95px; + height: 40px; + border: 1px solid dodgerblue; + margin: auto; + border-radius: 4px; + font-family: Verdana, + Geneva, Tahoma, sans-serif; + + background-color: dodgerblue; + color: white; + font-size: 20px; + cursor: pointer; +} + +#print { + font-family: Verdana, + Geneva, Tahoma, sans-serif; + + color: dodgerblue; + font-size: 20px; +} + +#main { + text-align: center; +} + +#ins { + font-family: Verdana, + Geneva, Tahoma, sans-serif; + + color: dodgerblue; + font-size: 17px; +} \ No newline at end of file