Skip to content

Commit

Permalink
Add files via upload
Browse files Browse the repository at this point in the history
  • Loading branch information
@Patel-Parth12
Patel-Parth12 authored Sep 10, 2023
0 parents commit e05acd5
Show file tree
Hide file tree
Showing 3 changed files with 369 additions and 0 deletions.
69 changes: 69 additions & 0 deletions Tic-Tac-Toe/index.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,69 @@
<!DOCTYPE html>
<html>

<head>
<meta name="viewport" content=
"width=device-width, initial-scale=1.0">
<!-- CSS file Included -->
<link rel="stylesheet" type="text/css" href="tic.css">

</head>

<body>
<div id="main">
<h1>TIC TAC TOE</h1>
<p id="ins">
Game starts by just Tap on
box<br><br>First Player starts as
<b>Player X </b>And Second Player as
<b>Player 0</b>
</p>
<br><br>
<div class = "ui">
<div class="row">
<input type="text" id= "b1"
class="cell" onclick="onPlayerTrun(1);"
readonly>
<input type="text" id= "b2"
class="cell" onclick="onPlayerTrun(2);"
readonly>
<input type="text" id= "b3" class="cell"
onclick="onPlayerTrun(3);"
readonly>
</div>
<div class="row">
<input type="text" id= "b4"
class="cell" onclick="onPlayerTrun(4);"
readonly>
<input type="text" id= "b5"
class="cell" onclick="onPlayerTrun(5);"
readonly>
<input type="text" id= "b6"
class="cell" onclick="onPlayerTrun(6);"
readonly>
</div>
<div class="row">
<input type="text" id= "b7"
class="cell" onclick="onPlayerTrun(7);"
readonly>
<input type="text" id= "b8"
class="cell" onclick="onPlayerTrun(8);"
readonly>
<input type="text" id= "b9"
class="cell" onclick="onPlayerTrun(9);"
readonly>
</div>
</div>
<br><br><br>

<button id="but" onclick="window.location.reload()">
RESET
</button>
<br><br>
<p id="print"></p>
</div>
<!-- JavaScript file included -->
<script src="tic.js"></script>
</body>

</html>
113 changes: 113 additions & 0 deletions Tic-Tac-Toe/tic.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,113 @@
h1 {
color: orangered;
margin-bottom: -5px;
}
p {
margin-bottom: -10px;
}
.ui {
display: flex;
flex-direction: column;
align-items: center;
}
.row {
display: flex;
}
.cell {
border: none;
width: 80px;
height: 80px;
display: flex;
align-items: center;
justify-content: center;
font-size: 24px;
text-align: center;
cursor: pointer;
}
.cell:active {
outline: none;
}
/* 3*3 Grid */
#b1{
border-bottom: 1px solid gray;
border-right: 1px solid gray;
}

#b2 {
border-bottom: 1px solid gray;
border-right: 1px solid gray;
border-left: 1px solid gray;
}

#b3 {
border-bottom: 1px solid gray;
border-left: 1px solid gray;
}

#b4 {
border-top: 1px solid gray;
border-bottom: 1px solid gray;
border-right: 1px solid gray;
}

#b5 {
border: 1px solid gray;
}

#b6 {
border-top: 1px solid gray;
border-bottom: 1px solid gray;
border-left: 1px solid gray;
}

#b7 {
border-top: 1px solid gray;
border-right: 1px solid gray;
}

#b8 {
border-top: 1px solid gray;
border-right: 1px solid gray;
border-left: 1px solid gray;
}

#b9 {
border-top: 1px solid gray;
border-left: 1px solid gray;
}
/* Reset Button */
#but {
box-sizing: border-box;
width: 95px;
height: 40px;
border: 1px solid dodgerblue;
margin-left: auto;
border-radius: 8px;
font-family: Verdana,
Geneva, Tahoma, sans-serif;

background-color: whitesmoke;
color: dodgerblue;
font-size: 20px;
cursor: pointer;
}

/* Player turn space */
#print {
font-family: Verdana,
Geneva, Tahoma, sans-serif;
color: dodgerblue;
font-size: 20px;
}

/* Main Container */
#main {
text-align: center;
}

/* Game Instruction Text */
#ins {
font-family: Verdana,Geneva,
Tahoma, sans-serif;
color: dodgerblue;
}
187 changes: 187 additions & 0 deletions Tic-Tac-Toe/tic.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,187 @@
let game_arr = [];
let gamePlayer = true;
const onPlayerTrun = function(i){
if(!gamePlayer){
return false;
}
if(isPositionisfree(i)){
gamePlayer=false;
setGameData(0,i);
if(isWinnig(0,game_arr,false)){
setMessage("Player X is Won");
return false;
}
let computermove = computerMove(1);
if(computermove){
setGameData(1,computermove);
}
if(isWinnig(1,game_arr,false)){
setMessage("Player 0 is Won");
return false;
}
if(!isGameBordisFree()){
setMessage("Draw");
return false;
}
setMessage("Player X turn");

gamePlayer=true;
}

};
const isGameBordisFree = function(){
return getCornerFreePosition(1,2,3,4,5,6,7,8,9).length > 0;
};
const computerMove=function(turn){
setMessage("Player 0 turn");
let oppTurn = (turn === 0)?1:0;
let winingposition = getWiningPosition(turn);
//console.log("getWiningPosition",turn,winingposition);
if(winingposition){
return winingposition;
}
winingposition = getWiningPosition(oppTurn);
//console.log("getWiningPosition",oppTurn,winingposition);
if(winingposition){
return winingposition;
}
let freePosition;
if(!isCornerisfree(oppTurn)){
freePosition = getCornerFreePosition(5);
if(freePosition.length > 0){
return getRandomItem(freePosition);
}
}
if(isCrossCorner(oppTurn)){
freePosition = getCornerFreePosition(2,4,6,8);
if(freePosition.length > 0){
return getRandomItem(freePosition);
}
}

freePosition = getCornerFreePosition(1,3,7,9);
if(freePosition.length > 0){
return getRandomItem(freePosition);
}
freePosition = getCornerFreePosition(5);
if(freePosition.length > 0){
return getRandomItem(freePosition);
}
freePosition = getCornerFreePosition(2,4,6,8);
if(freePosition.length > 0){
return getRandomItem(freePosition);
}

return null;
};
const getRandomItem=function(arr) {

// get random index value
const randomIndex = Math.floor(Math.random() * arr.length);

// get random item
const item = arr[randomIndex];

return item;
};
const getCornerFreePosition=function(...position){
let freePosition = [];
position.forEach(item=>{
if(isPositionisfree(item)){
freePosition.push(item);
}
});
return freePosition;
};
const isCornerisfree=function(turn){
let retValue = true;
let char=getPlayerChar(turn);
[1,3,7,9].forEach(item=>{
if(!isPositionisfree(item) && game_arr[item]===char){
retValue = false;
return retValue;
}
});
return retValue;
};
const isCrossCorner=function(turn){
let char=getPlayerChar(turn);
if(!isPositionisfree(1) && !isPositionisfree(9) && game_arr[1]===char && game_arr[9]===char){
return true;
}else if(!isPositionisfree(3) && !isPositionisfree(7) && game_arr[3]===char && game_arr[7]===char){
return true;
}
return false;
};
const getWiningPosition=function(turn){
let computerMovePosition;
let char = getPlayerChar(turn);
for(let i=1;i<=9;i++){
if(isPositionisfree(i)){
let copyGameBord = cloneArray(game_arr);
copyGameBord[i]=char;
if(isWinnig(turn,copyGameBord,true)){
computerMovePosition=i;
return computerMovePosition;
}
}
}
return computerMovePosition;
};
const cloneArray=function(arr){
return arr.map(a => a);
};
const getPlayerChar=function(turn){
return (turn === 0)?"X":"0";
};
const setGameData=function(turn,i){
let char = getPlayerChar(turn);
document.getElementById("b"+i).value = char;
document.getElementById("b"+i).disabled = true;
game_arr[i]=char;
};
const isWinnig=function(turn,gameBord,isdummy){
let char = getPlayerChar(turn);
if(winingCheck(gameBord,char,1,2,3,isdummy)){
return true;
}else if(winingCheck(gameBord,char,4,5,6,isdummy)){
return true;
}else if(winingCheck(gameBord,char,7,8,9,isdummy)){
return true;
}else if(winingCheck(gameBord,char,1,4,7,isdummy)){
return true;
}else if(winingCheck(gameBord,char,2,5,8,isdummy)){
return true;
}else if(winingCheck(gameBord,char,3,6,9,isdummy)){
return true;
}else if(winingCheck(gameBord,char,1,5,9,isdummy)){
return true;
}else if(winingCheck(gameBord,char,3,5,7,isdummy)){
return true;
}
return false;
};
const setWiningColor = function(a,b,c){
document.getElementById("b"+a).style = "color:red;";
document.getElementById("b"+b).style = "color:red;";
document.getElementById("b"+c).style = "color:red;";
};
const winingCheck=function(gameBord,ch,a,b,c,isdummy){
let isWining = ch === gameBord[a] && gameBord[a] === gameBord[b] && gameBord[b] === gameBord[c];
if(isWining && !isdummy){
setWiningColor(a,b,c);
}
return isWining;
};
const isPositionisfree=function(i){
if(game_arr[i]){
return false;
}
return true;
};
const setMessage=function(msg){
document.getElementById("print").innerText = msg;
};
setMessage("Player X turn");


0 comments on commit e05acd5

Please sign in to comment.