diff --git a/client/src/components/Game.js b/client/src/components/Game.js index 3c2c908..2041256 100644 --- a/client/src/components/Game.js +++ b/client/src/components/Game.js @@ -700,84 +700,87 @@ const Game = (props) => { } return ( - (!roomFull) ? <> -

Game Code: {room}

+ <> + {(!roomFull) ? <> +

Game Code: {room}

- {users.length===2 ? <> + {users.length===2 ? <> - {gameOver ?
{winner !== '' && <>

GAME OVER

{winner} wins!

}Home
: -
-

Turn: {turn}

- - {currentUser === 'Player 1' && <> -
- {player1Deck.map((item) => ( + {gameOver ?
{winner !== '' && <>

GAME OVER

{winner} wins!

}Home
: +
+

Turn: {turn}

+ + {currentUser === 'Player 1' && <> +
+ {player1Deck.map((item) => ( + onCardPlayedHandler(item)} + src={require(`../assets/cards-front/${item}.png`).default} + width='100px' + /> + ))} + +
+
+
+ {playedCardsPile && playedCardsPile.length>0 && onCardPlayedHandler(item)} - src={require(`../assets/cards-front/${item}.png`).default} + src={require(`../assets/cards-front/${playedCardsPile[playedCardsPile.length-1]}.png`).default} width='100px' - /> - ))} - -
-
-
- {playedCardsPile && playedCardsPile.length>0 && - } -
-
-
- {player2Deck.map((item) => ( + /> } +
+
+
+ {player2Deck.map((item) => ( + onCardPlayedHandler(item)} + src={require(`../assets/card-back.png`).default} + width='100px' + /> + ))} + +
} + + {currentUser === 'Player 2' && <> +
+ {player1Deck.map((item) => ( + onCardPlayedHandler(item)} + src={require(`../assets/card-back.png`).default} + width='100px' + /> + ))} + +
+
+
+ {playedCardsPile && playedCardsPile.length>0 && onCardPlayedHandler(item)} - src={require(`../assets/card-back.png`).default} + src={require(`../assets/cards-front/${playedCardsPile[playedCardsPile.length-1]}.png`).default} width='100px' - /> - ))} - -
} + /> } +
+
+
+ {player2Deck.map((item) => ( + onCardPlayedHandler(item)} + src={require(`../assets/cards-front/${item}.png`).default} + width='100px' + /> + ))} + +
} - {currentUser === 'Player 2' && <> -
- {player1Deck.map((item) => ( - onCardPlayedHandler(item)} - src={require(`../assets/card-back.png`).default} - width='100px' - /> - ))} - -
-
-
- {playedCardsPile && playedCardsPile.length>0 && - } -
-
-
- {player2Deck.map((item) => ( - onCardPlayedHandler(item)} - src={require(`../assets/cards-front/${item}.png`).default} - width='100px' - /> - ))} - -
} +
} -
- Home -
} + :

Waiting for other player

} - :

Waiting for other player

} + :

Room full

} - :

Room full

+
+ Home + ) }