Compare commits
No commits in common. 'master' and 'testDockerToto' have entirely different histories.
master
...
testDocker
@ -0,0 +1,5 @@
|
|||||||
|
<php?
|
||||||
|
|
||||||
|
echo "coucou";
|
||||||
|
|
||||||
|
?>
|
||||||
@ -1,20 +0,0 @@
|
|||||||
FROM node:latest
|
|
||||||
|
|
||||||
# Create app directory
|
|
||||||
|
|
||||||
# Install app dependencies
|
|
||||||
# A wildcard is used to ensure both package.json AND package-lock.json are copied
|
|
||||||
# where available (npm@5+)
|
|
||||||
COPY bob_party/package*.json ./
|
|
||||||
|
|
||||||
RUN yarn
|
|
||||||
|
|
||||||
# If you are building your code for production
|
|
||||||
# RUN npm ci --only=production
|
|
||||||
|
|
||||||
# Bundle app source
|
|
||||||
COPY bob_party/server.js .
|
|
||||||
|
|
||||||
EXPOSE 3000
|
|
||||||
|
|
||||||
CMD [ "node", "server.js" ]
|
|
||||||
|
Before Width: | Height: | Size: 7.3 KiB |
|
Before Width: | Height: | Size: 320 B |
|
Before Width: | Height: | Size: 3.5 KiB |
|
Before Width: | Height: | Size: 448 KiB |
@ -1,4 +1,4 @@
|
|||||||
const { io } = require("socket.io-client");
|
const { io } = require("socket.io-client");
|
||||||
|
|
||||||
|
|
||||||
export const socket = io("http://172.20.10.2:3000");
|
export const socket = io("http://192.168.1.54:3000");
|
||||||
@ -1,242 +0,0 @@
|
|||||||
import React,{Component, useState} from 'react';
|
|
||||||
import {
|
|
||||||
View,
|
|
||||||
StyleSheet,
|
|
||||||
ImageBackground,
|
|
||||||
UIManager,
|
|
||||||
StatusBar,
|
|
||||||
NativeModules,
|
|
||||||
AppState,
|
|
||||||
Platform
|
|
||||||
} from 'react-native';
|
|
||||||
import cardsDeck from './source/data/cards';
|
|
||||||
import {shuffle} from './source/helpers';
|
|
||||||
import {Overlay,ChipSelector, UserControls,FloatingText} from './source/components';
|
|
||||||
import boardBg from './source/assets/board.png';
|
|
||||||
import { MANAGER_USER } from '../../../appManagers';
|
|
||||||
import { UserCoinsModifier } from '../../core/User/userCoinsModifier';
|
|
||||||
import { useNavigation } from '@react-navigation/native';
|
|
||||||
import { useUserStore } from '../../context/userContext';
|
|
||||||
|
|
||||||
|
|
||||||
export default function BlackJack(props){
|
|
||||||
|
|
||||||
const [totalBet, setTotalBet] = useState(0);
|
|
||||||
const [amount, setAmount] = useState(MANAGER_USER.getCurrentUser()?.getCurrentCoins());
|
|
||||||
const [playerHand, setPlayerHand] = useState([]);
|
|
||||||
const [dealerHand, setDealerHand] = useState([]);
|
|
||||||
const [gameover, setGameover] = useState(false);
|
|
||||||
const [cardCount, setCardCount] = useState(0);
|
|
||||||
const [gameMessage, setGameMessage] = useState("");
|
|
||||||
const [gameStarted, setGameStarted] = useState(false);
|
|
||||||
const [startGame, setStartGame] = useState(false);
|
|
||||||
|
|
||||||
const navigation = useNavigation();
|
|
||||||
|
|
||||||
const setUser = useUserStore((state) => state.setUser);
|
|
||||||
|
|
||||||
return(
|
|
||||||
<>
|
|
||||||
<ImageBackground
|
|
||||||
source={boardBg}
|
|
||||||
style={styles.container}>
|
|
||||||
|
|
||||||
<StatusBar backgroundColor={"green"} translucent={true} />
|
|
||||||
|
|
||||||
<View style={styles.bottom}>
|
|
||||||
|
|
||||||
<UserControls
|
|
||||||
playerHand={playerHand}
|
|
||||||
dealerHand={dealerHand}
|
|
||||||
goBack={() => navigation.goBack()}
|
|
||||||
hit={() => hit()}
|
|
||||||
doubleGame={() => doubleGame()}
|
|
||||||
endgame={() => endgame()}
|
|
||||||
gameover={gameover}
|
|
||||||
totalBet={totalBet}
|
|
||||||
/>
|
|
||||||
|
|
||||||
<View style={styles.center}>
|
|
||||||
<FloatingText
|
|
||||||
text={`Total Bet ${totalBet} BobCoins`}
|
|
||||||
/>
|
|
||||||
</View>
|
|
||||||
<ChipSelector
|
|
||||||
onSelect={(chipValue) => {
|
|
||||||
if(!gameover && startGame){
|
|
||||||
if(chipValue <= amount && !gameStarted){
|
|
||||||
setTotalBet(totalBet+chipValue);
|
|
||||||
setAmount(amount-chipValue);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
else{
|
|
||||||
if (amount > 0 && amount>=chipValue){
|
|
||||||
newGame();
|
|
||||||
setTotalBet(totalBet+chipValue);
|
|
||||||
setAmount(amount-chipValue);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
<View style={styles.center}>
|
|
||||||
<FloatingText
|
|
||||||
text={`Available ${amount} BobCoins`}
|
|
||||||
/>
|
|
||||||
</View>
|
|
||||||
|
|
||||||
{gameover && gameMessage != "" && <Overlay text={gameMessage} onClose={() => { newGame() }} />}
|
|
||||||
|
|
||||||
</View>
|
|
||||||
</ImageBackground>
|
|
||||||
</>
|
|
||||||
)
|
|
||||||
|
|
||||||
async function modifAmount(money){
|
|
||||||
const modif = new UserCoinsModifier();
|
|
||||||
const tmp=MANAGER_USER.getCurrentUser();
|
|
||||||
setAmount(money);
|
|
||||||
if (tmp!=null){
|
|
||||||
await modif.changeCurrentCoins(tmp, money);
|
|
||||||
setUser(MANAGER_USER.getCurrentUser());
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function newGame(){
|
|
||||||
let cardCount = 0;
|
|
||||||
shuffle(cardsDeck);
|
|
||||||
|
|
||||||
let playerHand = [],
|
|
||||||
dealerHand = [];
|
|
||||||
|
|
||||||
for(let i = 0; i < 2; i++){
|
|
||||||
playerHand.push(cardsDeck[cardCount]);
|
|
||||||
cardCount++;
|
|
||||||
dealerHand.push(cardsDeck[cardCount]);
|
|
||||||
cardCount++;
|
|
||||||
}
|
|
||||||
|
|
||||||
setPlayerHand(playerHand);
|
|
||||||
setDealerHand(dealerHand);
|
|
||||||
setGameover(false);
|
|
||||||
setCardCount(cardCount);
|
|
||||||
setGameMessage("");
|
|
||||||
setStartGame(true);
|
|
||||||
}
|
|
||||||
|
|
||||||
function hit(){
|
|
||||||
const hand=playerHand;
|
|
||||||
|
|
||||||
hand.push(cardsDeck[cardCount]);
|
|
||||||
|
|
||||||
let userPoints = checkTotalPlayerPoints(hand);
|
|
||||||
setGameStarted(true);
|
|
||||||
setPlayerHand(hand);
|
|
||||||
setCardCount(cardCount+1)
|
|
||||||
|
|
||||||
if(userPoints > 21){
|
|
||||||
endgame();
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function doubleGame(){
|
|
||||||
hit();
|
|
||||||
endgame();
|
|
||||||
}
|
|
||||||
|
|
||||||
async function endgame(){
|
|
||||||
|
|
||||||
let _cardCount = cardCount;
|
|
||||||
|
|
||||||
let dealerPoints = checkTotalPlayerPoints(dealerHand),
|
|
||||||
playerPoints = checkTotalPlayerPoints(playerHand);
|
|
||||||
//alert(dealerPoints)
|
|
||||||
while(dealerPoints < 17){
|
|
||||||
dealerHand.push(cardsDeck[_cardCount]);
|
|
||||||
_cardCount++;
|
|
||||||
dealerPoints = checkTotalPlayerPoints(dealerHand);
|
|
||||||
}
|
|
||||||
|
|
||||||
let betValue = totalBet * 1.5;
|
|
||||||
setGameStarted(false);
|
|
||||||
|
|
||||||
//who won
|
|
||||||
if(playerPoints == 21 && playerHand.length == 2){
|
|
||||||
let newAmount = totalBet * 1.5;
|
|
||||||
await modifAmount(newAmount);
|
|
||||||
setTotalBet(0);
|
|
||||||
setGameover(true);
|
|
||||||
setGameMessage("Player BlackJack!");
|
|
||||||
}
|
|
||||||
|
|
||||||
if(
|
|
||||||
(playerPoints < 22 && dealerPoints < playerPoints) ||
|
|
||||||
(dealerPoints > 21 && playerPoints < 22)
|
|
||||||
){
|
|
||||||
|
|
||||||
await modifAmount(amount+betValue);
|
|
||||||
|
|
||||||
setTotalBet(0);
|
|
||||||
setGameover(true);
|
|
||||||
setGameMessage("You Win "+ betValue+" BobCoins");
|
|
||||||
|
|
||||||
}
|
|
||||||
else if(playerPoints > 21 && dealerPoints <= 21){
|
|
||||||
await modifAmount(amount);
|
|
||||||
setCardCount(_cardCount);
|
|
||||||
setTotalBet(0);
|
|
||||||
setGameover(true);
|
|
||||||
setGameMessage("Bust!");
|
|
||||||
|
|
||||||
}else if(playerPoints == dealerPoints){
|
|
||||||
await modifAmount(amount+totalBet);
|
|
||||||
|
|
||||||
setTotalBet(0);
|
|
||||||
setGameover(true);
|
|
||||||
setGameMessage("Push!");
|
|
||||||
}else{
|
|
||||||
|
|
||||||
await modifAmount(amount);
|
|
||||||
setTotalBet(0);
|
|
||||||
setGameover(true);
|
|
||||||
setGameMessage("Dealer Wins, You Lost");
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function checkTotalPlayerPoints(playerHand){
|
|
||||||
let aceAdjuts = false,
|
|
||||||
points = 0;
|
|
||||||
playerHand.map((card,_index) => {
|
|
||||||
if(card.name == 'A' && !aceAdjuts) {
|
|
||||||
aceAdjuts = true;
|
|
||||||
points = points + 10;
|
|
||||||
}
|
|
||||||
points = points + card.value;
|
|
||||||
});
|
|
||||||
|
|
||||||
if(aceAdjuts && points > 21){
|
|
||||||
points = points - 10;
|
|
||||||
}
|
|
||||||
|
|
||||||
return points;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
const styles = StyleSheet.create({
|
|
||||||
container : {
|
|
||||||
flex : 1
|
|
||||||
},
|
|
||||||
center : {
|
|
||||||
alignItems : "center"
|
|
||||||
},
|
|
||||||
|
|
||||||
bottom : {
|
|
||||||
position : "absolute",
|
|
||||||
left : 0,
|
|
||||||
right : 0,
|
|
||||||
bottom : 0,
|
|
||||||
zIndex : 2
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
|
|
||||||
|
Before Width: | Height: | Size: 79 KiB |
|
Before Width: | Height: | Size: 8.5 KiB |
|
Before Width: | Height: | Size: 2.4 KiB |
|
Before Width: | Height: | Size: 6.9 KiB |
|
Before Width: | Height: | Size: 6.2 KiB |
|
Before Width: | Height: | Size: 6.3 KiB |
|
Before Width: | Height: | Size: 5.8 KiB |
|
Before Width: | Height: | Size: 5.9 KiB |
|
Before Width: | Height: | Size: 6.6 KiB |
|
Before Width: | Height: | Size: 5.6 KiB |
|
Before Width: | Height: | Size: 6.9 KiB |
|
Before Width: | Height: | Size: 6.6 KiB |
|
Before Width: | Height: | Size: 6.3 KiB |
|
Before Width: | Height: | Size: 5.1 KiB |
|
Before Width: | Height: | Size: 6.5 KiB |
|
Before Width: | Height: | Size: 7.5 KiB |
|
Before Width: | Height: | Size: 4.6 KiB |
|
Before Width: | Height: | Size: 4.0 KiB |
|
Before Width: | Height: | Size: 4.1 KiB |
|
Before Width: | Height: | Size: 3.7 KiB |
|
Before Width: | Height: | Size: 3.7 KiB |
|
Before Width: | Height: | Size: 4.2 KiB |
|
Before Width: | Height: | Size: 3.5 KiB |
|
Before Width: | Height: | Size: 4.5 KiB |
|
Before Width: | Height: | Size: 4.3 KiB |
|
Before Width: | Height: | Size: 4.1 KiB |
|
Before Width: | Height: | Size: 3.1 KiB |
|
Before Width: | Height: | Size: 4.1 KiB |
|
Before Width: | Height: | Size: 5.0 KiB |
|
Before Width: | Height: | Size: 5.8 KiB |
|
Before Width: | Height: | Size: 5.2 KiB |
|
Before Width: | Height: | Size: 5.3 KiB |
|
Before Width: | Height: | Size: 4.9 KiB |
|
Before Width: | Height: | Size: 5.0 KiB |
|
Before Width: | Height: | Size: 5.5 KiB |
|
Before Width: | Height: | Size: 4.7 KiB |
|
Before Width: | Height: | Size: 5.8 KiB |
|
Before Width: | Height: | Size: 5.5 KiB |
|
Before Width: | Height: | Size: 5.3 KiB |
|
Before Width: | Height: | Size: 4.4 KiB |
|
Before Width: | Height: | Size: 5.4 KiB |
|
Before Width: | Height: | Size: 6.2 KiB |
|
Before Width: | Height: | Size: 6.7 KiB |
|
Before Width: | Height: | Size: 6.0 KiB |
|
Before Width: | Height: | Size: 6.2 KiB |
|
Before Width: | Height: | Size: 5.7 KiB |
|
Before Width: | Height: | Size: 5.8 KiB |
|
Before Width: | Height: | Size: 6.4 KiB |
|
Before Width: | Height: | Size: 5.4 KiB |
|
Before Width: | Height: | Size: 6.7 KiB |
|
Before Width: | Height: | Size: 6.4 KiB |
|
Before Width: | Height: | Size: 6.1 KiB |
|
Before Width: | Height: | Size: 5.0 KiB |
|
Before Width: | Height: | Size: 6.3 KiB |
|
Before Width: | Height: | Size: 7.3 KiB |
|
Before Width: | Height: | Size: 28 KiB |
|
Before Width: | Height: | Size: 34 KiB |
|
Before Width: | Height: | Size: 33 KiB |
|
Before Width: | Height: | Size: 32 KiB |
|
Before Width: | Height: | Size: 35 KiB |
|
Before Width: | Height: | Size: 32 KiB |
|
Before Width: | Height: | Size: 32 KiB |
|
Before Width: | Height: | Size: 33 KiB |
|
Before Width: | Height: | Size: 34 KiB |
|
Before Width: | Height: | Size: 33 KiB |
@ -1,52 +0,0 @@
|
|||||||
import React from 'react';
|
|
||||||
import {
|
|
||||||
StyleSheet,
|
|
||||||
View,
|
|
||||||
TouchableOpacity,
|
|
||||||
Text
|
|
||||||
} from 'react-native';
|
|
||||||
|
|
||||||
const ActionButton = props => {
|
|
||||||
return(
|
|
||||||
<TouchableOpacity
|
|
||||||
onPress={() => {
|
|
||||||
if(props.onPress) props.onPress()
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
<View style={[
|
|
||||||
props.direction == 'right' ? styles.rightDirection :
|
|
||||||
props.direction == 'left' ? styles.leftDirection : {},
|
|
||||||
styles.wrap,
|
|
||||||
props.style
|
|
||||||
]}>
|
|
||||||
<Text style={styles.text}>{props.text.replace(" ",'\n')}</Text>
|
|
||||||
</View>
|
|
||||||
</TouchableOpacity>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
const styles = StyleSheet.create({
|
|
||||||
wrap : {
|
|
||||||
padding : 6,
|
|
||||||
backgroundColor : "rgba(255,255,255,0.7)",
|
|
||||||
borderColor : "rgba(255,255,255,0.9)",
|
|
||||||
borderWidth : 2,
|
|
||||||
marginBottom : 12
|
|
||||||
},
|
|
||||||
rightDirection : {
|
|
||||||
borderTopRightRadius : 6,
|
|
||||||
borderBottomRightRadius : 6
|
|
||||||
},
|
|
||||||
leftDirection : {
|
|
||||||
borderTopLeftRadius : 6,
|
|
||||||
borderBottomLeftRadius : 6
|
|
||||||
},
|
|
||||||
text : {
|
|
||||||
color : "white",
|
|
||||||
fontWeight : "bold",
|
|
||||||
fontSize : 14,
|
|
||||||
textAlign : "center"
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
export default ActionButton;
|
|
||||||
@ -1,65 +0,0 @@
|
|||||||
import React,{Component} from 'react';
|
|
||||||
import {
|
|
||||||
View,
|
|
||||||
Text,
|
|
||||||
Image,
|
|
||||||
StyleSheet,
|
|
||||||
Dimensions
|
|
||||||
} from 'react-native';
|
|
||||||
import backCard from '../assets/cards/back.png';
|
|
||||||
const {width} = Dimensions.get("window");
|
|
||||||
const CARD_WIDTH = (width / 3) - 50;
|
|
||||||
const CARD_HEIGHT = (width / 3) + 5;
|
|
||||||
const CARD_SEPARATION = 50;
|
|
||||||
|
|
||||||
class CardDeck extends Component{
|
|
||||||
render(){
|
|
||||||
const {cards, isDealer, gameover} = this.props
|
|
||||||
return(
|
|
||||||
<View style={styles.container}>
|
|
||||||
<View
|
|
||||||
style={[
|
|
||||||
{marginLeft : -(cards.length * CARD_SEPARATION) / 1.8}
|
|
||||||
,styles.row]}>
|
|
||||||
{cards && cards.length > 0 && cards.map((card,i) => {
|
|
||||||
return (
|
|
||||||
<View
|
|
||||||
key={i}
|
|
||||||
style={[
|
|
||||||
i > 0 ? {
|
|
||||||
position : "absolute",
|
|
||||||
left : (i * CARD_SEPARATION),
|
|
||||||
} : {},
|
|
||||||
{
|
|
||||||
//elevation : 2,
|
|
||||||
borderWidth : 1,
|
|
||||||
borderColor : "black",
|
|
||||||
borderRadius : 6
|
|
||||||
}]}
|
|
||||||
><Image
|
|
||||||
source={ (isDealer && i == 0 && !gameover) ? backCard : cards[i].image}
|
|
||||||
style={{
|
|
||||||
width : CARD_WIDTH,
|
|
||||||
height : CARD_HEIGHT,
|
|
||||||
//position : "absolute",
|
|
||||||
//left : cards.length == 2 ? -(i * CARD_SEPARATION) : (i * -20)
|
|
||||||
}}
|
|
||||||
resizeMode={"stretch"}
|
|
||||||
/></View>)
|
|
||||||
})}
|
|
||||||
</View>
|
|
||||||
</View>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
const styles = StyleSheet.create({
|
|
||||||
container : {
|
|
||||||
justifyContent : "center"
|
|
||||||
},
|
|
||||||
row : {
|
|
||||||
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
export default CardDeck;
|
|
||||||
@ -1,79 +0,0 @@
|
|||||||
import React,{Component} from 'react';
|
|
||||||
import {
|
|
||||||
View,
|
|
||||||
ScrollView,
|
|
||||||
StyleSheet,
|
|
||||||
Image,
|
|
||||||
Text,
|
|
||||||
TouchableOpacity,
|
|
||||||
Dimensions
|
|
||||||
} from 'react-native';
|
|
||||||
|
|
||||||
import chips from '../data/chips';
|
|
||||||
|
|
||||||
const {width} = Dimensions.get('window');
|
|
||||||
const PADDING_WRAP = 8;
|
|
||||||
const MARGIN_SIDE = 20;
|
|
||||||
const CHIPS_SHOWN = 7;
|
|
||||||
const CHIP_WIDTH = (width / CHIPS_SHOWN) - ((MARGIN_SIDE / 2) * 2);
|
|
||||||
|
|
||||||
class ChipSelector extends Component{
|
|
||||||
|
|
||||||
render(){
|
|
||||||
const {onSelect} = this.props;
|
|
||||||
return(
|
|
||||||
<View style={styles.chipsWrapper}>
|
|
||||||
<ScrollView
|
|
||||||
horizontal={true}
|
|
||||||
contentContainerStyle={styles.scrollableContent}
|
|
||||||
showsHorizontalScrollIndicator={false}
|
|
||||||
>
|
|
||||||
{chips && chips.length > 0 && chips.map((chip,_index) => (
|
|
||||||
<TouchableOpacity
|
|
||||||
key={_index}
|
|
||||||
onPress={() => onSelect(chip.value)}
|
|
||||||
>
|
|
||||||
<View style={
|
|
||||||
_index < (chips.length-1) ? styles.chipWrap : {}
|
|
||||||
}>
|
|
||||||
<Image
|
|
||||||
source={chip.image}
|
|
||||||
resizeMode={'cover'}
|
|
||||||
style={styles.chip}
|
|
||||||
/>
|
|
||||||
</View>
|
|
||||||
</TouchableOpacity>
|
|
||||||
))}
|
|
||||||
</ScrollView>
|
|
||||||
</View>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
const styles = StyleSheet.create({
|
|
||||||
chipsWrapper : {
|
|
||||||
backgroundColor : "#8A5D3C",
|
|
||||||
borderColor : "#AF7B56",
|
|
||||||
borderTopWidth : 2,
|
|
||||||
borderBottomWidth : 2,
|
|
||||||
/*elevation : 5,
|
|
||||||
position : "absolute",
|
|
||||||
bottom : 0,
|
|
||||||
left : 0,
|
|
||||||
right : 0,
|
|
||||||
zIndex : 3*/
|
|
||||||
},
|
|
||||||
scrollableContent:{
|
|
||||||
padding : PADDING_WRAP
|
|
||||||
},
|
|
||||||
chipWrap: {
|
|
||||||
marginRight : MARGIN_SIDE
|
|
||||||
},
|
|
||||||
chip : {
|
|
||||||
width : CHIP_WIDTH,
|
|
||||||
height: CHIP_WIDTH
|
|
||||||
}
|
|
||||||
})
|
|
||||||
|
|
||||||
export default ChipSelector;
|
|
||||||
@ -1,32 +0,0 @@
|
|||||||
import React from 'react';
|
|
||||||
import {
|
|
||||||
View,
|
|
||||||
Text,
|
|
||||||
StyleSheet
|
|
||||||
} from 'react-native';
|
|
||||||
|
|
||||||
const FloatingText = props => {
|
|
||||||
return(
|
|
||||||
<View style={styles.indicator}>
|
|
||||||
<Text style={styles.indicatorTxt}>{props.text}</Text>
|
|
||||||
</View>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
const styles = StyleSheet.create({
|
|
||||||
indicator : {
|
|
||||||
backgroundColor : "rgba(0,0,0,0.6)",
|
|
||||||
borderColor : "rgba(0,0,0,0.9)",
|
|
||||||
padding : 8,
|
|
||||||
alignItems : "center",
|
|
||||||
marginTop : 8,
|
|
||||||
marginBottom : 8,
|
|
||||||
borderRadius : 4
|
|
||||||
},
|
|
||||||
indicatorTxt : {
|
|
||||||
color : "white",
|
|
||||||
fontSize : 12
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
export default FloatingText;
|
|
||||||
@ -1,62 +0,0 @@
|
|||||||
import React from 'react';
|
|
||||||
import {
|
|
||||||
View,
|
|
||||||
Text,
|
|
||||||
StyleSheet,
|
|
||||||
TouchableOpacity,
|
|
||||||
Dimensions
|
|
||||||
} from 'react-native';
|
|
||||||
|
|
||||||
const {width,height} = Dimensions.get("window");
|
|
||||||
const Overlay = props =>{
|
|
||||||
return(
|
|
||||||
<View style={styles.overlay}>
|
|
||||||
<Text style={styles.text}>{props.text}</Text>
|
|
||||||
<TouchableOpacity onPress={() => props.onClose()}>
|
|
||||||
<View style={styles.btn}>
|
|
||||||
<Text style={styles.continueBtn}>CONTINUE</Text>
|
|
||||||
</View>
|
|
||||||
</TouchableOpacity>
|
|
||||||
</View>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
const styles = StyleSheet.create({
|
|
||||||
overlay : {
|
|
||||||
backgroundColor : "rgba(0,0,0,0.8)",
|
|
||||||
position : "absolute",
|
|
||||||
top : (height / 2) - 60,
|
|
||||||
left : 0,
|
|
||||||
right : 0,
|
|
||||||
zIndex : 5,
|
|
||||||
alignItems : "center",
|
|
||||||
justifyContent : "center",
|
|
||||||
padding : 12
|
|
||||||
},
|
|
||||||
|
|
||||||
text : {
|
|
||||||
color : "#fff",
|
|
||||||
fontSize : 40,
|
|
||||||
textAlign : "center"
|
|
||||||
},
|
|
||||||
|
|
||||||
center : {
|
|
||||||
alignItems : "center",
|
|
||||||
justifyContent : "center"
|
|
||||||
},
|
|
||||||
|
|
||||||
btn : {
|
|
||||||
marginTop : 10,
|
|
||||||
borderWidth : 1,
|
|
||||||
borderColor : "#fff",
|
|
||||||
padding : 8
|
|
||||||
},
|
|
||||||
|
|
||||||
continueBtn : {
|
|
||||||
color : "#fff",
|
|
||||||
fontSize : 14,
|
|
||||||
textAlign : "center"
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
export default Overlay;
|
|
||||||
@ -1,132 +0,0 @@
|
|||||||
import React,{Component} from 'react';
|
|
||||||
import {
|
|
||||||
View,
|
|
||||||
Text,
|
|
||||||
TouchableOpacity,
|
|
||||||
StyleSheet,
|
|
||||||
Dimensions
|
|
||||||
} from 'react-native';
|
|
||||||
import {calculatePoints} from '../helpers';
|
|
||||||
import {ActionButton, FloatingText, CardDeck} from '../components';
|
|
||||||
const {width} = Dimensions.get('window');
|
|
||||||
const CIRCLE_BET_SIZE = (width / 4) - 20;
|
|
||||||
|
|
||||||
class UserControls extends Component{
|
|
||||||
|
|
||||||
constructor(){
|
|
||||||
super();
|
|
||||||
|
|
||||||
this.state = {
|
|
||||||
playerPoints : 0
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
UNSAFE_componentWillReceiveProps(nextProps){
|
|
||||||
if(nextProps.playerHand){
|
|
||||||
this.setState({
|
|
||||||
playerPoints : calculatePoints(nextProps.playerHand),
|
|
||||||
dealerPoints : calculatePoints(nextProps.dealerHand)
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
render(){
|
|
||||||
|
|
||||||
const {playerHand, dealerHand, goBack, hit, endgame, doubleGame, gameover, totalBet, moreMoney} = this.props;
|
|
||||||
const {playerPoints, dealerPoints} = this.state;
|
|
||||||
|
|
||||||
return(
|
|
||||||
<View style={styles.centerView}>
|
|
||||||
|
|
||||||
{/*<View>
|
|
||||||
<ActionButton
|
|
||||||
direction={'right'}
|
|
||||||
text={"DOUBLE WIN"}
|
|
||||||
/>
|
|
||||||
</View>*/}
|
|
||||||
|
|
||||||
<View style={styles.center}>
|
|
||||||
{gameover && <FloatingText text={dealerPoints} />}
|
|
||||||
<CardDeck
|
|
||||||
cards={dealerHand}
|
|
||||||
isDealer={true}
|
|
||||||
gameover={gameover}
|
|
||||||
/>
|
|
||||||
</View>
|
|
||||||
|
|
||||||
<View style={styles.center}>
|
|
||||||
<FloatingText text={playerPoints} />
|
|
||||||
<CardDeck
|
|
||||||
cards={playerHand}
|
|
||||||
/>
|
|
||||||
</View>
|
|
||||||
|
|
||||||
{totalBet == false && (<View style={styles.absoluteBtnRight}>
|
|
||||||
<ActionButton
|
|
||||||
direction={'left'}
|
|
||||||
text={"QUITER PARTIE"}
|
|
||||||
onPress={() => goBack()}
|
|
||||||
/>
|
|
||||||
</View>)}
|
|
||||||
|
|
||||||
{!!totalBet && (<View style={[styles.absoluteBtnRight,{top:60}]}>
|
|
||||||
<ActionButton
|
|
||||||
direction={'left'}
|
|
||||||
text={"HIT"}
|
|
||||||
onPress={() => hit()}
|
|
||||||
/>
|
|
||||||
</View>)}
|
|
||||||
|
|
||||||
{!!totalBet && (<View style={[styles.absoluteBtnRight,{top:105}]}>
|
|
||||||
<ActionButton
|
|
||||||
direction={'left'}
|
|
||||||
text={"DOUBLE"}
|
|
||||||
onPress={() => doubleGame()}
|
|
||||||
/>
|
|
||||||
</View>)}
|
|
||||||
|
|
||||||
{!!totalBet && (<View style={[styles.absoluteBtnRight,{top:150}]}>
|
|
||||||
<ActionButton
|
|
||||||
direction={'left'}
|
|
||||||
text={"DEAL"}
|
|
||||||
onPress={() => endgame()}
|
|
||||||
/>
|
|
||||||
</View>)}
|
|
||||||
|
|
||||||
</View>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
const styles = StyleSheet.create({
|
|
||||||
centerView : {
|
|
||||||
//flexDirection : "row",
|
|
||||||
alignItems : "center",
|
|
||||||
justifyContent : "space-around",
|
|
||||||
paddingTop : 10,
|
|
||||||
paddingBottom : 10
|
|
||||||
},
|
|
||||||
/*betCircle : {
|
|
||||||
width : CIRCLE_BET_SIZE,
|
|
||||||
height : CIRCLE_BET_SIZE,
|
|
||||||
borderRadius : (CIRCLE_BET_SIZE / 2),
|
|
||||||
borderColor : 'white',
|
|
||||||
borderWidth : 1,
|
|
||||||
padding : 2
|
|
||||||
},*/
|
|
||||||
betText : {
|
|
||||||
color : "white",
|
|
||||||
textAlign : "center"
|
|
||||||
},
|
|
||||||
center : {
|
|
||||||
alignItems : "center",
|
|
||||||
justifyContent : "center"
|
|
||||||
},
|
|
||||||
absoluteBtnRight : {
|
|
||||||
position : "absolute",
|
|
||||||
right : 0,
|
|
||||||
zIndex : 2
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
export default UserControls;
|
|
||||||
@ -1,15 +0,0 @@
|
|||||||
import ChipSelector from './ChipSelector';
|
|
||||||
import UserControls from './UserControls';
|
|
||||||
import ActionButton from './ActionButton';
|
|
||||||
import FloatingText from './FloatingText';
|
|
||||||
import CardDeck from './CardDeck';
|
|
||||||
import Overlay from './Overlay';
|
|
||||||
|
|
||||||
export {
|
|
||||||
ChipSelector,
|
|
||||||
UserControls,
|
|
||||||
ActionButton,
|
|
||||||
FloatingText,
|
|
||||||
CardDeck,
|
|
||||||
Overlay
|
|
||||||
}
|
|
||||||
@ -1,314 +0,0 @@
|
|||||||
export default [
|
|
||||||
{
|
|
||||||
name : 'A',
|
|
||||||
deck : 'spades',
|
|
||||||
value : 1,
|
|
||||||
image : require('../assets/cards/spades/A.png')
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name : 'J',
|
|
||||||
deck : 'spades',
|
|
||||||
value : 10,
|
|
||||||
image : require('../assets/cards/spades/J.png')
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name : 'Q',
|
|
||||||
deck : 'spades',
|
|
||||||
value : 10,
|
|
||||||
image : require('../assets/cards/spades/Q.png')
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name : 'K',
|
|
||||||
deck : 'spades',
|
|
||||||
value : 10,
|
|
||||||
image : require('../assets/cards/spades/K.png')
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name : '2',
|
|
||||||
deck : 'spades',
|
|
||||||
value : 2,
|
|
||||||
image : require('../assets/cards/spades/2.png')
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name : '3',
|
|
||||||
deck : 'spades',
|
|
||||||
value : 3,
|
|
||||||
image : require('../assets/cards/spades/3.png')
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name : '4',
|
|
||||||
deck : 'spades',
|
|
||||||
value : 4,
|
|
||||||
image : require('../assets/cards/spades/4.png')
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name : '5',
|
|
||||||
deck : 'spades',
|
|
||||||
value : 5,
|
|
||||||
image : require('../assets/cards/spades/5.png')
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name : '6',
|
|
||||||
deck : 'spades',
|
|
||||||
value : 6,
|
|
||||||
image : require('../assets/cards/spades/6.png')
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name : '7',
|
|
||||||
deck : 'spades',
|
|
||||||
value : 7,
|
|
||||||
image : require('../assets/cards/spades/7.png')
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name : '8',
|
|
||||||
deck : 'spades',
|
|
||||||
value : 8,
|
|
||||||
image : require('../assets/cards/spades/8.png')
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name : '9',
|
|
||||||
deck : 'spades',
|
|
||||||
value : 9,
|
|
||||||
image : require('../assets/cards/spades/9.png')
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name : '10',
|
|
||||||
deck : 'spades',
|
|
||||||
value : 10,
|
|
||||||
image : require('../assets/cards/spades/10.png')
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name : 'A',
|
|
||||||
deck : 'hearts',
|
|
||||||
value : 1,
|
|
||||||
image : require('../assets/cards/hearts/A.png')
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name : 'J',
|
|
||||||
deck : 'hearts',
|
|
||||||
value : 10,
|
|
||||||
image : require('../assets/cards/hearts/J.png')
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name : 'Q',
|
|
||||||
deck : 'hearts',
|
|
||||||
value : 10,
|
|
||||||
image : require('../assets/cards/hearts/Q.png')
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name : 'K',
|
|
||||||
deck : 'hearts',
|
|
||||||
value : 10,
|
|
||||||
image : require('../assets/cards/hearts/K.png')
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name : '2',
|
|
||||||
deck : 'hearts',
|
|
||||||
value : 2,
|
|
||||||
image : require('../assets/cards/hearts/2.png')
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name : '3',
|
|
||||||
deck : 'hearts',
|
|
||||||
value : 3,
|
|
||||||
image : require('../assets/cards/hearts/3.png')
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name : '4',
|
|
||||||
deck : 'hearts',
|
|
||||||
value : 4,
|
|
||||||
image : require('../assets/cards/hearts/4.png')
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name : '5',
|
|
||||||
deck : 'hearts',
|
|
||||||
value : 5,
|
|
||||||
image : require('../assets/cards/hearts/5.png')
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name : '6',
|
|
||||||
deck : 'hearts',
|
|
||||||
value : 6,
|
|
||||||
image : require('../assets/cards/hearts/6.png')
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name : '7',
|
|
||||||
deck : 'hearts',
|
|
||||||
value : 7,
|
|
||||||
image : require('../assets/cards/hearts/7.png')
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name : '8',
|
|
||||||
deck : 'hearts',
|
|
||||||
value : 8,
|
|
||||||
image : require('../assets/cards/hearts/8.png')
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name : '9',
|
|
||||||
deck : 'hearts',
|
|
||||||
value : 9,
|
|
||||||
image : require('../assets/cards/hearts/9.png')
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name : '10',
|
|
||||||
deck : 'hearts',
|
|
||||||
value : 10,
|
|
||||||
image : require('../assets/cards/hearts/10.png')
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name : 'A',
|
|
||||||
deck : 'clubs',
|
|
||||||
value : 1,
|
|
||||||
image : require('../assets/cards/clubs/A.png')
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name : 'J',
|
|
||||||
deck : 'clubs',
|
|
||||||
value : 10,
|
|
||||||
image : require('../assets/cards/clubs/J.png')
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name : 'Q',
|
|
||||||
deck : 'clubs',
|
|
||||||
value : 10,
|
|
||||||
image : require('../assets/cards/clubs/Q.png')
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name : 'K',
|
|
||||||
deck : 'clubs',
|
|
||||||
value : 10,
|
|
||||||
image : require('../assets/cards/clubs/K.png')
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name : '2',
|
|
||||||
deck : 'clubs',
|
|
||||||
value : 2,
|
|
||||||
image : require('../assets/cards/clubs/2.png')
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name : '3',
|
|
||||||
deck : 'clubs',
|
|
||||||
value : 3,
|
|
||||||
image : require('../assets/cards/clubs/3.png')
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name : '4',
|
|
||||||
deck : 'clubs',
|
|
||||||
value : 4,
|
|
||||||
image : require('../assets/cards/clubs/4.png')
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name : '5',
|
|
||||||
deck : 'clubs',
|
|
||||||
value : 5,
|
|
||||||
image : require('../assets/cards/clubs/5.png')
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name : '6',
|
|
||||||
deck : 'clubs',
|
|
||||||
value : 6,
|
|
||||||
image : require('../assets/cards/clubs/6.png')
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name : '7',
|
|
||||||
deck : 'clubs',
|
|
||||||
value : 7,
|
|
||||||
image : require('../assets/cards/clubs/7.png')
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name : '8',
|
|
||||||
deck : 'clubs',
|
|
||||||
value : 8,
|
|
||||||
image : require('../assets/cards/clubs/8.png')
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name : '9',
|
|
||||||
deck : 'clubs',
|
|
||||||
value : 9,
|
|
||||||
image : require('../assets/cards/clubs/9.png')
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name : '10',
|
|
||||||
deck : 'clubs',
|
|
||||||
value : 10,
|
|
||||||
image : require('../assets/cards/clubs/10.png')
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name : 'A',
|
|
||||||
deck : 'diamonds',
|
|
||||||
value : 1,
|
|
||||||
image : require('../assets/cards/diamonds/A.png')
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name : 'J',
|
|
||||||
deck : 'diamonds',
|
|
||||||
value : 10,
|
|
||||||
image : require('../assets/cards/diamonds/J.png')
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name : 'Q',
|
|
||||||
deck : 'diamonds',
|
|
||||||
value : 10,
|
|
||||||
image : require('../assets/cards/diamonds/Q.png')
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name : 'K',
|
|
||||||
deck : 'diamonds',
|
|
||||||
value : 10,
|
|
||||||
image : require('../assets/cards/diamonds/K.png')
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name : '2',
|
|
||||||
deck : 'diamonds',
|
|
||||||
value : 2,
|
|
||||||
image : require('../assets/cards/diamonds/2.png')
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name : '3',
|
|
||||||
deck : 'diamonds',
|
|
||||||
value : 3,
|
|
||||||
image : require('../assets/cards/diamonds/3.png')
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name : '4',
|
|
||||||
deck : 'diamonds',
|
|
||||||
value : 4,
|
|
||||||
image : require('../assets/cards/diamonds/4.png')
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name : '5',
|
|
||||||
deck : 'diamonds',
|
|
||||||
value : 5,
|
|
||||||
image : require('../assets/cards/diamonds/5.png')
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name : '6',
|
|
||||||
deck : 'diamonds',
|
|
||||||
value : 6,
|
|
||||||
image : require('../assets/cards/diamonds/6.png')
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name : '7',
|
|
||||||
deck : 'diamonds',
|
|
||||||
value : 7,
|
|
||||||
image : require('../assets/cards/diamonds/7.png')
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name : '8',
|
|
||||||
deck : 'diamonds',
|
|
||||||
value : 8,
|
|
||||||
image : require('../assets/cards/diamonds/8.png')
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name : '9',
|
|
||||||
deck : 'diamonds',
|
|
||||||
value : 9,
|
|
||||||
image : require('../assets/cards/diamonds/9.png')
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name : '10',
|
|
||||||
deck : 'diamonds',
|
|
||||||
value : 10,
|
|
||||||
image : require('../assets/cards/diamonds/10.png')
|
|
||||||
}
|
|
||||||
];
|
|
||||||
@ -1,42 +0,0 @@
|
|||||||
export default [
|
|
||||||
{
|
|
||||||
image : require("../assets/chips/1.png"),
|
|
||||||
value : 1
|
|
||||||
},
|
|
||||||
{
|
|
||||||
image : require("../assets/chips/5.png"),
|
|
||||||
value : 5
|
|
||||||
},
|
|
||||||
{
|
|
||||||
image : require("../assets/chips/25.png"),
|
|
||||||
value : 25
|
|
||||||
},
|
|
||||||
{
|
|
||||||
image : require("../assets/chips/100.png"),
|
|
||||||
value : 100
|
|
||||||
},
|
|
||||||
{
|
|
||||||
image : require("../assets/chips/500.png"),
|
|
||||||
value : 500
|
|
||||||
},
|
|
||||||
{
|
|
||||||
image : require("../assets/chips/1k.png"),
|
|
||||||
value : 1000
|
|
||||||
},
|
|
||||||
{
|
|
||||||
image : require("../assets/chips/2k.png"),
|
|
||||||
value : 2000
|
|
||||||
},
|
|
||||||
{
|
|
||||||
image : require("../assets/chips/5k.png"),
|
|
||||||
value : 5000
|
|
||||||
},
|
|
||||||
{
|
|
||||||
image : require("../assets/chips/10k.png"),
|
|
||||||
value : 10000
|
|
||||||
},
|
|
||||||
{
|
|
||||||
image : require("../assets/chips/25k.png"),
|
|
||||||
value : 25000
|
|
||||||
}
|
|
||||||
]
|
|
||||||
@ -1,32 +0,0 @@
|
|||||||
export function shuffle(a){
|
|
||||||
for (let i = a.length - 1; i > 0; i--) {
|
|
||||||
const j = Math.floor(Math.random() * (i + 1));
|
|
||||||
[a[i], a[j]] = [a[j], a[i]];
|
|
||||||
}
|
|
||||||
return a;
|
|
||||||
}
|
|
||||||
|
|
||||||
export function calculatePoints(playerHand){
|
|
||||||
/*let points = 0;
|
|
||||||
arr.map((card,_index) => {
|
|
||||||
//if(card.name == 'A' && card.name == 'J')
|
|
||||||
points = points + card.value
|
|
||||||
});
|
|
||||||
return points;*/
|
|
||||||
let aceAdjuts = false,
|
|
||||||
points = 0;
|
|
||||||
|
|
||||||
playerHand.map((card,_index) => {
|
|
||||||
if(card.name == 'A' && !aceAdjuts) {
|
|
||||||
aceAdjuts = true;
|
|
||||||
points = points + 10;
|
|
||||||
}
|
|
||||||
points = points + card.value;
|
|
||||||
});
|
|
||||||
|
|
||||||
if(aceAdjuts && points > 21){
|
|
||||||
points = points - 10;
|
|
||||||
}
|
|
||||||
|
|
||||||
return points;
|
|
||||||
}
|
|
||||||
@ -1,245 +0,0 @@
|
|||||||
import {Alert, Button, 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";
|
|
||||||
import { TopBar } from "../../components/TopBar";
|
|
||||||
import { socket } from "../../../socketConfig";
|
|
||||||
import { MANAGER_MATCH, MANAGER_USER } from "../../../appManagers";
|
|
||||||
import { useUserStore } from "../../context/userContext";
|
|
||||||
|
|
||||||
|
|
||||||
export default function TicTacToeOnline(props: { navigation: any }){
|
|
||||||
|
|
||||||
const [initTic, setInitTic]=useState(0);
|
|
||||||
|
|
||||||
const setUser = useUserStore((state) => state.setUser);
|
|
||||||
|
|
||||||
|
|
||||||
setUpTicTacToeOnline();
|
|
||||||
|
|
||||||
const [map,setMap]=useState([
|
|
||||||
['','',''],
|
|
||||||
['','',''],
|
|
||||||
['','',''],
|
|
||||||
]);
|
|
||||||
|
|
||||||
const [turnUser, setTurnUser]=useState("x");
|
|
||||||
|
|
||||||
|
|
||||||
const {navigation}=props;
|
|
||||||
|
|
||||||
const [currentTurn,setCurrentTurn] = useState("x");
|
|
||||||
|
|
||||||
|
|
||||||
const onPressCell = async (rowIndex:number,columnIndex:number) => {
|
|
||||||
if (turnUser!==currentTurn){
|
|
||||||
Alert.alert("ce n'est pas à votre tour de jouer");
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
if(map[rowIndex][columnIndex]==""){
|
|
||||||
setMap((existingMap) =>{
|
|
||||||
const updateMap = [...existingMap]
|
|
||||||
updateMap[rowIndex][columnIndex]=currentTurn;
|
|
||||||
return updateMap;
|
|
||||||
});
|
|
||||||
socket.emit("playTicTacToe", MANAGER_MATCH.getCurrentMatch(), rowIndex, columnIndex, currentTurn);
|
|
||||||
setCurrentTurn(currentTurn === "x"? "o" : "x");
|
|
||||||
const retour= await checkWinning();
|
|
||||||
if(retour!=true){
|
|
||||||
checkComplete();
|
|
||||||
}
|
|
||||||
|
|
||||||
}else{
|
|
||||||
Alert.alert("Case déjà prise");
|
|
||||||
}
|
|
||||||
|
|
||||||
};
|
|
||||||
|
|
||||||
function setUpTicTacToeOnline() {
|
|
||||||
if (initTic===0){
|
|
||||||
setInitTic(1);
|
|
||||||
socket.on("oppPlayTicTacToe", async (rowIndex, columnIndex, turn) =>{
|
|
||||||
|
|
||||||
setMap((existingMap) =>{
|
|
||||||
const updateMap = [...existingMap]
|
|
||||||
updateMap[rowIndex][columnIndex]=turn;
|
|
||||||
return updateMap;
|
|
||||||
});
|
|
||||||
const retour= await checkWinning();
|
|
||||||
if(retour!=true){
|
|
||||||
checkComplete();
|
|
||||||
}
|
|
||||||
if (turn==="x"){
|
|
||||||
setCurrentTurn("o");
|
|
||||||
setTurnUser("o");
|
|
||||||
}
|
|
||||||
else{
|
|
||||||
setCurrentTurn("x");
|
|
||||||
setTurnUser("x");
|
|
||||||
}
|
|
||||||
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
async function endGame(win: number){
|
|
||||||
socket.off("oppPlayTicTacToe");
|
|
||||||
navigation.goBack();
|
|
||||||
const tmp=MANAGER_USER.getCurrentUser();
|
|
||||||
if (tmp!==null){
|
|
||||||
await MANAGER_MATCH.getCurrentMatch()?.updatePostMatch(tmp, win);
|
|
||||||
MANAGER_USER.setCurrentUser(tmp);
|
|
||||||
setUser(tmp);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
const checkWinning = async () =>{
|
|
||||||
const tmp=MANAGER_USER.getCurrentUser()
|
|
||||||
// Checks rows
|
|
||||||
for (let i=0; i<3; i++){
|
|
||||||
const isRowXWinning = map[i].every((cell)=> cell==="x");
|
|
||||||
const isRowOWinning = map[i] .every((cell)=>cell==="o");
|
|
||||||
if(isRowXWinning==true){
|
|
||||||
Alert.alert("X won !");
|
|
||||||
if (turnUser==="x"){
|
|
||||||
await endGame(2);
|
|
||||||
}
|
|
||||||
else{
|
|
||||||
await endGame(0);
|
|
||||||
}
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
else if(isRowOWinning==true){
|
|
||||||
|
|
||||||
Alert.alert("O won !");
|
|
||||||
if (turnUser==="x"){
|
|
||||||
await endGame(0);
|
|
||||||
}
|
|
||||||
else{
|
|
||||||
await endGame(2);
|
|
||||||
}
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
// Checks columns
|
|
||||||
for (let col=0;col<3;col++){
|
|
||||||
let isColumnXWinning=true;
|
|
||||||
let isColumnOWinning=true;
|
|
||||||
|
|
||||||
for(let row=0;row<3;row++){
|
|
||||||
if(map[row][col] !== "x"){
|
|
||||||
isColumnXWinning=false;
|
|
||||||
}
|
|
||||||
if(map[row][col] !== "o"){
|
|
||||||
isColumnOWinning=false;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
if (isColumnXWinning == true){
|
|
||||||
Alert.alert("X won !");
|
|
||||||
if (turnUser==="x"){
|
|
||||||
await endGame(2);
|
|
||||||
}
|
|
||||||
else{
|
|
||||||
await endGame(0);
|
|
||||||
}
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
if(isColumnOWinning==true){
|
|
||||||
Alert.alert("O won !");
|
|
||||||
if (turnUser==="x"){
|
|
||||||
await endGame(0);
|
|
||||||
}
|
|
||||||
else{
|
|
||||||
await endGame(2);
|
|
||||||
}
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
// Checks diag
|
|
||||||
let isDiag1XWinning=true;
|
|
||||||
let isDiag1OWinning=true;
|
|
||||||
let isDiag2XWinning=true;
|
|
||||||
let isDiag2OWinning=true;
|
|
||||||
for (let i=0;i<3;i++){
|
|
||||||
if(map[i][i]!=="x"){
|
|
||||||
isDiag1XWinning=false;
|
|
||||||
}
|
|
||||||
if(map[i][i]!=="o"){
|
|
||||||
isDiag1OWinning=false;
|
|
||||||
}
|
|
||||||
if(map[i][2-i]!=="x"){
|
|
||||||
isDiag2XWinning=false;
|
|
||||||
}
|
|
||||||
if(map[i][2-i]!=="o"){
|
|
||||||
isDiag2OWinning=false;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
if(isDiag1OWinning==true || isDiag2OWinning==true){
|
|
||||||
Alert.alert("O won !");
|
|
||||||
if (turnUser==="x"){
|
|
||||||
await endGame(0);
|
|
||||||
}
|
|
||||||
else{
|
|
||||||
await endGame(2);
|
|
||||||
}
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
if(isDiag1XWinning==true || isDiag2XWinning==true){
|
|
||||||
Alert.alert("X won !");
|
|
||||||
if (turnUser==="x"){
|
|
||||||
await endGame(2);
|
|
||||||
}
|
|
||||||
else{
|
|
||||||
await endGame(0);
|
|
||||||
}
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
const checkComplete = async () =>{
|
|
||||||
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 !");
|
|
||||||
await endGame(1);
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
return(
|
|
||||||
<View style={styles.container}>
|
|
||||||
<ScreenIndicator title='TIC TAC TOE'/>
|
|
||||||
<Text style={styles.text}>Current turn: {currentTurn}</Text>
|
|
||||||
<ImageBackground style={styles.grid} source={{uri:"https://upload.wikimedia.org/wikipedia/commons/6/64/Tic-tac-toe.png"}} >
|
|
||||||
<View style={styles.map}>
|
|
||||||
|
|
||||||
{map.map((row, rowIndex)=>(
|
|
||||||
<View key={`row-${rowIndex}`} style={styles.row}>
|
|
||||||
{row.map((cell, columnIndex)=> (
|
|
||||||
<Pressable
|
|
||||||
onPress={() => onPressCell(rowIndex,columnIndex)}
|
|
||||||
style={styles.cell}
|
|
||||||
key={`row-${rowIndex}-col-${columnIndex}`}
|
|
||||||
>
|
|
||||||
{cell === "o" && <View style={styles.circle}/>}
|
|
||||||
{cell === "x" &&(
|
|
||||||
<View style={styles.cross}>
|
|
||||||
<View style={styles.crossLine}/>
|
|
||||||
<View style={[styles.crossLine, styles.crossLineReversed]}/>
|
|
||||||
</View>
|
|
||||||
)}
|
|
||||||
</Pressable>
|
|
||||||
))}
|
|
||||||
</View>
|
|
||||||
))}
|
|
||||||
</View>
|
|
||||||
</ImageBackground>
|
|
||||||
</View>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||