From 272b39915cd001411ff130e8a4ad2b2c643ed25a Mon Sep 17 00:00:00 2001 From: jhalitaksoy Date: Sun, 4 Jul 2021 01:23:10 +0300 Subject: [PATCH] added Searching Opponent message --- src/Home.tsx | 19 +++++---- src/components/InfoPanel.tsx | 79 +++++++++++++++++++++--------------- src/const/texts.ts | 10 ++++- 3 files changed, 66 insertions(+), 42 deletions(-) diff --git a/src/Home.tsx b/src/Home.tsx index 2ef234e..922466c 100644 --- a/src/Home.tsx +++ b/src/Home.tsx @@ -28,6 +28,8 @@ const Home: FunctionComponent<{ initial?: number }> = ({ initial = 0 }) => { const [connectionState, setConnetionState] = useState("connecting") + const [searchingOpponent, setSearchingOpponent] = useState(false) + const [game, setGame] = useState(undefined) const [crashMessage, setCrashMessage] = useState(undefined) @@ -78,6 +80,7 @@ const Home: FunctionComponent<{ initial?: number }> = ({ initial = 0 }) => { const newGame: Game = JSON.parse(decodeText(message)) console.log("on_game_start"); console.log(newGame); + setSearchingOpponent(false) setGame(new Game(newGame.player1, newGame.player2, newGame.board, newGame.turn, newGame.state)) }) @@ -109,6 +112,7 @@ const Home: FunctionComponent<{ initial?: number }> = ({ initial = 0 }) => { const newGameClick = () => { resetGameState() + setSearchingOpponent(true) context.rtmt.sendMessage("new_game", new Uint8Array()) } @@ -182,17 +186,18 @@ const Home: FunctionComponent<{ initial?: number }> = ({ initial = 0 }) => {

{context.texts.Mancala}

{renderNewGameButton()} - {game && !userKeyWhoLeave && < Button color="white" text={context.texts.Leave} onClick={leaveGame} />} + {game && !userKeyWhoLeave && !crashMessage && < Button color="white" text={context.texts.Leave} onClick={leaveGame} />}
- + {game && } } -export default Home - -function channel_game_user_leave(channel_game_user_leave: any, arg1: (message: Uint8Array) => void) { - throw new Error('Function not implemented.'); -} +export default Home \ No newline at end of file diff --git a/src/components/InfoPanel.tsx b/src/components/InfoPanel.tsx index ac0cb03..b54a3d3 100644 --- a/src/components/InfoPanel.tsx +++ b/src/components/InfoPanel.tsx @@ -3,46 +3,59 @@ import { FunctionComponent } from "react" import { context } from '../context'; import { Game } from '../mancala'; -const InfoPanel: FunctionComponent<{ game: Game, crashMessage: string, userKey: string, userKeyWhoLeave: string }> = ({ - game, crashMessage, userKey, userKeyWhoLeave }) => { - - if (crashMessage) { - return ( -

{ - context.texts.GameCrashed + " " + crashMessage - }

- ) - } - - if (userKeyWhoLeave) { - let message = context.texts.OpponentLeavesTheGame - - if (userKeyWhoLeave == userKey) { - message = context.texts.YouLeftTheGame - } - return ( -

- {message} -

- ) - } - - if (game) { - if (game.state == "ended") { - const whoWon = game.getWonPlayer() == userKey ? context.texts.YouWon : context.texts.YouLost +const InfoPanel: FunctionComponent<{ + game: Game, + crashMessage: string, + userKey: string, + userKeyWhoLeave: string, + searchingOpponent: boolean +}> = ({ + game, crashMessage, userKey, userKeyWhoLeave, searchingOpponent }) => { + if (searchingOpponent) { return (

{ - context.texts.GameEnded + " " + whoWon + context.texts.SearchingOpponent + " " + context.texts.PleaseWait }

) - } else { + } + + if (crashMessage) { return ( -

{game.checkGameTurn(userKey) ? context.texts.YourTurn : context.texts.OpponentTurn}

+

{ + context.texts.GameCrashed + " " + crashMessage + }

) } + + if (userKeyWhoLeave) { + let message = context.texts.OpponentLeavesTheGame + + if (userKeyWhoLeave == userKey) { + message = context.texts.YouLeftTheGame + } + return ( +

+ {message} +

+ ) + } + + if (game) { + if (game.state == "ended") { + const whoWon = game.getWonPlayer() == userKey ? context.texts.YouWon : context.texts.YouLost + return ( +

{ + context.texts.GameEnded + " " + whoWon + }

+ ) + } else { + return ( +

{game.checkGameTurn(userKey) ? context.texts.YourTurn : context.texts.OpponentTurn}

+ ) + } + } + + return

} - return

-} - export default InfoPanel \ No newline at end of file diff --git a/src/const/texts.ts b/src/const/texts.ts index fe0da0e..6e8aae0 100644 --- a/src/const/texts.ts +++ b/src/const/texts.ts @@ -18,6 +18,8 @@ export type Texts = { SearchingOpponet: string, OpponentLeavesTheGame: string, YouLeftTheGame: string, + SearchingOpponent: string, + PleaseWait : string } export const EnUs: Texts = { @@ -38,7 +40,9 @@ export const EnUs: Texts = { ServerError: "Server Error", SearchingOpponet: "Searching Opponet", OpponentLeavesTheGame: "Opponent Leaves The Game", - YouLeftTheGame: "You Left The Game" + YouLeftTheGame: "You Left The Game", + SearchingOpponent: "Searching Opponent", + PleaseWait : "Please Wait" } export const TrTr: Texts = { @@ -59,5 +63,7 @@ export const TrTr: Texts = { ServerError: "Sunucu Hatası", SearchingOpponet: "Rakip Aranıyor", OpponentLeavesTheGame: "Rakip Oyundan Ayrıldı", - YouLeftTheGame: "Sen Oyundan Ayrıldın" + YouLeftTheGame: "Sen Oyundan Ayrıldın", + SearchingOpponent: "Rakip Aranıyor", + PleaseWait: "Lütfen Bekleyin" } \ No newline at end of file