diff --git a/bob_party/src/Games/Tic-Tac-Toe/TicTacToeStyle.js b/bob_party/src/Games/Tic-Tac-Toe/TicTacToeStyle.js
new file mode 100644
index 0000000..4e70b88
--- /dev/null
+++ b/bob_party/src/Games/Tic-Tac-Toe/TicTacToeStyle.js
@@ -0,0 +1,65 @@
+import { StyleSheet } from "react-native";
+
+
+export default StyleSheet.create({
+ container:{
+ height:window.innerHeight,
+ width:"100%",
+ flex:1,
+ backgroundColor:"#45444E",
+ alignItems:"center",
+ justifyContent:"center"
+ },
+ grid:{
+ width:375,
+ height:375,
+ alignItems:"center",
+ justifyContent:"center",
+ },
+ row:{
+ flex:1,
+ flexDirection:"row",
+ },
+ cell:{
+ width:100,
+ flex:1,
+ },
+ circle:{
+ left:15,
+ top:15,
+ width:90,
+ height:90,
+ backgroundColor:"#0085FF",
+ borderRadius:50
+ },
+ cross:{
+ width:"100%",
+ height:"100%",
+ },
+ crossLine:{
+ left:52,
+ top:15,
+ position:"absolute",
+ width:15,
+ height:100,
+ borderRadius:50,
+ backgroundColor:"#EE9433",
+ transform:[{rotate:"45deg"},],
+ },
+ crossLineReversed:{
+ transform:[{rotate:"-45deg"},],
+ },
+ map:{
+ aspectRatio:1,
+ padding:5
+ },
+ text:{
+ fontSize: 20,
+ lineHeight: 21,
+ fontWeight: 'bold',
+ letterSpacing: 0.25,
+ color: 'white',
+ marginTop:25,
+ marginBottom:25
+ }
+});
\ No newline at end of file
diff --git a/bob_party/src/Games/Tic-Tac-Toe/tic-tac-toe.tsx b/bob_party/src/Games/Tic-Tac-Toe/tic-tac-toe.tsx
index 61e8f54..e95c907 100644
--- a/bob_party/src/Games/Tic-Tac-Toe/tic-tac-toe.tsx
+++ b/bob_party/src/Games/Tic-Tac-Toe/tic-tac-toe.tsx
@@ -1,6 +1,10 @@
import {Alert, ImageBackground, Pressable, StyleSheet, Text, View } from "react-native";
import React, {useState} from "react";
+import styles from './TicTacToeStyle.js';
import { useMatchStore } from "../../context/matchContext";
+import { current } from "@reduxjs/toolkit";
+import { ScreenIndicator } from "../../components/ScreenIndicator.tsx";
+import { TopBar } from "../../components/TopBar.tsx";
export default function tic_tac_toe(props: { navigation: any}){
@@ -23,12 +27,16 @@ export default function tic_tac_toe(props: { navigation: any}){
updateMap[rowIndex][columnIndex]=currentTurn;
return updateMap;
});
+ setCurrentTurn(currentTurn === "x"? "o" : "x");
+ const retour=checkWinning();
+ if(retour!=true){
+ checkComplete();
+ }
+
}else{
- Alert.alert("Case déjà prise");
+ Alert.alert("Case déjà prise");
}
- setCurrentTurn(currentTurn === "x"? "o" : "x");
- checkWinning();
- checkComplete();
+
};
const checkWinning = () =>{
@@ -39,10 +47,12 @@ export default function tic_tac_toe(props: { navigation: any}){
if(isRowXWinning==true){
Alert.alert("X won !");
navigation.goBack();
+ return true;
}
else if(isRowOWinning==true){
- Alert.alert("X won !");
+ Alert.alert("O won !");
navigation.goBack();
+ return true;
}
}
// Checks columns
@@ -61,10 +71,12 @@ export default function tic_tac_toe(props: { navigation: any}){
if (isColumnXWinning == true){
Alert.alert("X won !");
navigation.goBack();
+ return true;
}
if(isColumnOWinning==true){
Alert.alert("O won !");
navigation.goBack();
+ return true;
}
}
@@ -90,40 +102,34 @@ export default function tic_tac_toe(props: { navigation: any}){
if(isDiag1OWinning==true || isDiag2OWinning==true){
Alert.alert("O won !");
navigation.goBack();
+ return true;
}
if(isDiag1XWinning==true || isDiag2XWinning==true){
Alert.alert("X won !");
navigation.goBack();
+ return true;
}
};
const checkComplete = () =>{
- /*let isFull;
- for (let row=0; row<3; row++){
- for(let col=0;col<3;col++){
- if(map[row][col]==="o" || map[row][col]==="x"){
- isFull=false;
- }
- }
- }
- if (isFull!=false){
- Alert.alert("Draw !");
- navigation.goBack();
- }*/
const isRow0Full = map[0].every((cell)=> cell!=="");
const isRow1Full = map[1] .every((cell)=>cell!=="");
const isRow2Full = map[2] .every((cell)=>cell!=="");
if(isRow0Full==true && isRow1Full==true && isRow2Full==true){
Alert.alert("Draw !");
navigation.goBack();
+ return false;
}
};
return(
- TIC TAC TOE
+
+
+ Current turn: {currentTurn}
+
{map.map((row, rowIndex)=>(
{row.map((cell, columnIndex)=> (
@@ -147,66 +153,4 @@ export default function tic_tac_toe(props: { navigation: any}){
);
-}
-
-const styles= StyleSheet.create({
- container:{
- height:"100%",
- width:"100%",
- flex:1,
- backgroundColor:"#45444E",
- alignItems:"center",
- justifyContent:"center",
- },
- grid:{
- width:375,
- height:375,
- alignItems:"center",
- justifyContent:"center",
- },
- row:{
- flex:1,
- flexDirection:"row",
- },
- cell:{
- width:100,
- flex:1,
- },
- circle:{
- left:15,
- top:15,
- width:90,
- height:90,
- backgroundColor:"#0085FF",
- borderRadius:50
- },
- cross:{
- width:"100%",
- height:"100%",
- },
- crossLine:{
- left:52,
- top:15,
- position:"absolute",
- width:15,
- height:100,
- borderRadius:50,
- backgroundColor:"#EE9433",
- transform:[{rotate:"45deg"},],
- },
- crossLineReversed:{
- transform:[{rotate:"-45deg"},],
- },
- map:{
- aspectRatio:1,
- padding:5
- },
- text:{
- fontSize: 26,
- lineHeight: 21,
- fontWeight: 'bold',
- letterSpacing: 0.25,
- color: 'white',
- marginBottom:25
- }
-})
\ No newline at end of file
+}
\ No newline at end of file
diff --git a/bob_party/src/components/TopBar.tsx b/bob_party/src/components/TopBar.tsx
index 31492bd..0c2c78f 100644
--- a/bob_party/src/components/TopBar.tsx
+++ b/bob_party/src/components/TopBar.tsx
@@ -51,7 +51,7 @@ FC<{nav: any, state?: string}> =
)
- case 'matchmacking':
+ case 'matchmacking'|| 'game':
return (
diff --git a/bob_party/src/navigation/AppNavigator.tsx b/bob_party/src/navigation/AppNavigator.tsx
index 99af4ce..75a8b80 100644
--- a/bob_party/src/navigation/AppNavigator.tsx
+++ b/bob_party/src/navigation/AppNavigator.tsx
@@ -15,7 +15,7 @@ import SignUp from '../screens/SignUp'
import LobbySolo from '../screens/LobbySolo'
import CookieClicker from '../Games/CookieClicker/cookieClicker'
import MatchMaking from '../screens/MatchMaking'
-import TicTacToe from '../Games/Tic-Tac-Toe/tic-tac-toe'
+import TicTacToe from '../Games/Tic-Tac-Toe/Tic-Tac-Toe'
const HomeStack = createStackNavigator();
@@ -95,7 +95,7 @@ const GameSoloStack = createStackNavigator();
function GameSoloStackScreen() {
return (
-
+