Skip to content

Commit 745aacd

Browse files
committed
add new game page
1 parent aa17c10 commit 745aacd

File tree

12 files changed

+151
-52
lines changed

12 files changed

+151
-52
lines changed

.env

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,3 +2,4 @@
22
NEXT_PUBLIC_API_URL='http://win.sbx0.cn:8080'
33
NEXT_PUBLIC_VERSION='0.0.0'
44
NEXT_PUBLIC_REGION='local'
5+
NEXT_PUBLIC_DEBUG='true'

components/card/card.js

Lines changed: 3 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -6,9 +6,9 @@ import {LanguageContext} from "../i18n/i18n";
66
import {gameActionType, GameContext} from "../../pages/room/components/roomDetail";
77
import useSingleAndDoubleClick from "../common/useSingleAndDoubleClick";
88

9-
export default function Card({roomCode, card, serviceInstanceId}) {
9+
export default function Card({roomCode, card}) {
10+
const debug = process.env.NEXT_PUBLIC_DEBUG === 'true';
1011
const language = useContext(LanguageContext);
11-
const [debug, setDebug] = useState(false);
1212
const [can, setCan] = useState(false);
1313
const [choose, setChoose] = useState(false);
1414
const {state, dispatch} = useContext(GameContext);
@@ -87,9 +87,7 @@ export default function Card({roomCode, card, serviceInstanceId}) {
8787

8888
playCards({
8989
roomCode: roomCode, uuid: card.uuid, color: state.chooseColor != null ? state.chooseColor : card.color
90-
}, null, {
91-
'instance-id': serviceInstanceId
92-
}).then((response) => {
90+
}, null).then((response) => {
9391
if (response.code !== '0') {
9492
dispatch({type: gameActionType.initCards, data: original})
9593
dispatch({type: gameActionType.discards, data: originalDiscards})

components/card/discardCard.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,10 @@
1-
import React, {useContext, useState} from 'react';
1+
import React, {useContext} from 'react';
22
import styles from './discardCard.module.css';
33
import {LanguageContext} from "../i18n/i18n";
44

55
export default function DiscardCard({card}) {
66
const language = useContext(LanguageContext);
7-
const [debug, setDebug] = useState(false);
7+
const debug = process.env.NEXT_PUBLIC_DEBUG === 'true';
88

99
const better = (text) => {
1010
switch (text) {

components/card/myCards.js

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -22,7 +22,6 @@ export default function MyCards() {
2222
<div className={styles.innerContainer}>
2323
{state?.cards.map((one, index) => <Card
2424
key={index}
25-
serviceInstanceId={sseState?.serviceInstanceId}
2625
roomCode={sseState?.roomCode}
2726
card={one}
2827
data={cards.data}

components/common/callApiButton.js

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -16,9 +16,7 @@ export default function CallApiButton({loadingText, buttonText, onSuccess, api,
1616
if (params == null) {
1717
params = {}
1818
}
19-
api(params, null, {
20-
'instance-id': params['instance-id']
21-
}).then((response) => {
19+
api(params, null).then((response) => {
2220
if (response.code === 500) {
2321
router.push("/login").then(r => r);
2422
}

pages/game/[gameCode].js

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
import React from "react";
2+
import GameView from "./gameView";
3+
4+
export default function Game() {
5+
return <GameView/>
6+
}

pages/game/gameData.js

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
import React, {createContext} from "react";
2+
3+
export const GameContext = createContext({});
4+
5+
export default function GameData() {
6+
7+
}

pages/game/gameView.js

Lines changed: 43 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,43 @@
1+
import React from "react";
2+
import styles from "./gameView.module.css"
3+
4+
export default function GameView() {
5+
const gamers = [
6+
{'id': 'gamer1', 'name': 'gamer1'},
7+
{'id': 'gamer2', 'name': 'gamer2'},
8+
{'id': 'gamer3', 'name': 'gamer3'},
9+
{'id': 'gamer4', 'name': 'gamer4'},
10+
{'id': 'gamer5', 'name': 'gamer5'},
11+
];
12+
13+
return <div className={styles.viewContainer}>
14+
<div className={styles.gamersContainer}>
15+
<div className={styles.gamersScroll}>
16+
{gamers.map((gamer) =>
17+
<div key={gamer.id}
18+
id={gamer.id}
19+
className={styles.gamerContainer}>
20+
<div className={styles.gamerName}>
21+
{gamer.name}
22+
</div>
23+
</div>
24+
)}
25+
</div>
26+
</div>
27+
<div className={styles.deckContainer}>
28+
<div className={styles.cardDeckContainer}>
29+
Draw Card
30+
</div>
31+
<div className={styles.discardDeckContainer}>
32+
Discard Card
33+
</div>
34+
</div>
35+
<div className={styles.gamersContainer} hidden>
36+
{gamers.map((gamer) =>
37+
<div>
38+
<a href={'#' + gamer.id}>{gamer.name}</a>&nbsp;
39+
</div>
40+
)}
41+
</div>
42+
</div>
43+
}

pages/game/gameView.module.css

Lines changed: 71 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,71 @@
1+
.viewContainer {
2+
width: 100vw;
3+
height: 100vh;
4+
border: 0.2rem solid black;
5+
padding: 1rem;
6+
}
7+
8+
.gamersContainer {
9+
width: 100%;
10+
height: 8rem;
11+
border: 0.2rem solid black;
12+
padding: 1rem;
13+
margin-bottom: 1rem;
14+
overflow: auto;
15+
scroll-behavior: smooth;
16+
}
17+
18+
.gamersScroll {
19+
width: max-content;
20+
height: 100%;
21+
}
22+
23+
.gamerContainer {
24+
width: 8rem;
25+
height: 100%;
26+
border: 0.2rem solid black;
27+
padding: 1rem;
28+
margin-right: 1rem;
29+
display: inline-grid;
30+
align-content: center;
31+
text-align: center;
32+
}
33+
34+
.gamerContainer:last-child {
35+
margin-right: 0;
36+
}
37+
38+
.gamerName {
39+
display: block;
40+
width: 100%;
41+
height: 30%;
42+
}
43+
44+
45+
.deckContainer {
46+
width: 100%;
47+
height: 12rem;
48+
border: 0.2rem solid black;
49+
padding: 1rem;
50+
margin-bottom: 1rem;
51+
display: grid;
52+
justify-content: center;
53+
grid-template-columns: 46% 46%;
54+
grid-gap: 2rem;
55+
}
56+
57+
.cardDeckContainer {
58+
height: 100%;
59+
border: 0.2rem solid black;
60+
display: grid;
61+
align-content: center;
62+
text-align: center;
63+
}
64+
65+
.discardDeckContainer {
66+
height: 100%;
67+
border: 0.2rem solid black;
68+
display: grid;
69+
align-content: center;
70+
text-align: center;
71+
}

pages/room/components/roomDashboard.js

Lines changed: 7 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -68,9 +68,7 @@ export default function RoomDashboard() {
6868
roomCode: sseState?.roomCode,
6969
uuid: card.uuid,
7070
color: state.chooseColor != null ? state.chooseColor : card.color
71-
}, null, {
72-
'instance-id': sseState?.serviceInstanceId
73-
}).then((response) => {
71+
}, null).then((response) => {
7472
if (response.code !== '0') {
7573
dispatch({type: gameActionType.initCards, data: original})
7674
dispatch({type: gameActionType.discards, data: originalDiscards})
@@ -127,7 +125,7 @@ export default function RoomDashboard() {
127125
loadingText={language.addingBot}
128126
api={addUnoBot}
129127
params={{
130-
"roomCode": sseState?.roomCode, "instance-id": sseState?.serviceInstanceId,
128+
"roomCode": sseState?.roomCode
131129
}}
132130
onSuccess={() => {
133131

@@ -138,7 +136,7 @@ export default function RoomDashboard() {
138136
loadingText={language.removingBot}
139137
api={removeUnoBot}
140138
params={{
141-
"roomCode": sseState?.roomCode, "instance-id": sseState?.serviceInstanceId,
139+
"roomCode": sseState?.roomCode
142140
}}
143141
onSuccess={() => {
144142

@@ -151,7 +149,7 @@ export default function RoomDashboard() {
151149
loadingText={(state?.roomInfo?.isIAmIn ? language.quitingRoom : language.joiningRoom)}
152150
api={state?.roomInfo?.isIAmIn ? quitRoom : joinRoom}
153151
params={{
154-
"roomCode": sseState?.roomCode, "instance-id": sseState?.serviceInstanceId,
152+
"roomCode": sseState?.roomCode
155153
}}
156154
onSuccess={() => {
157155
if (state?.roomInfo?.isIAmIn) {
@@ -168,7 +166,7 @@ export default function RoomDashboard() {
168166
loadingText={language.loading}
169167
api={startUnoRoom}
170168
params={{
171-
"roomCode": sseState?.roomCode, "instance-id": sseState?.serviceInstanceId,
169+
"roomCode": sseState?.roomCode
172170
}}
173171
onSuccess={() => {
174172
dispatch({type: gameActionType.startGame})
@@ -180,7 +178,7 @@ export default function RoomDashboard() {
180178
loadingText={language.drawingCard}
181179
api={drawCard}
182180
params={{
183-
"roomCode": sseState?.roomCode, "instance-id": sseState?.serviceInstanceId,
181+
"roomCode": sseState?.roomCode
184182
}}
185183
onSuccess={(params) => {
186184
sseDispatch({type: actionType.draw, data: params})
@@ -192,7 +190,7 @@ export default function RoomDashboard() {
192190
loadingText={language.skipping}
193191
api={nextPlay}
194192
params={{
195-
"roomCode": sseState?.roomCode, "instance-id": sseState?.serviceInstanceId,
193+
"roomCode": sseState?.roomCode
196194
}}
197195
onSuccess={(params) => {
198196
sseDispatch({type: actionType.draw, data: params})

0 commit comments

Comments
 (0)