Change Doudizhu message process from websocket to restful api
This commit is contained in:
parent
9de0847a1e
commit
19fafcb832
|
@ -9,53 +9,12 @@ const port = process.env.PORT || 10080;
|
|||
app.use(cors());
|
||||
app.use(express.json());
|
||||
|
||||
const server = app.listen(port, () => {
|
||||
app.listen(port, () => {
|
||||
console.log(`Server is running on port: ${port}`);
|
||||
});
|
||||
|
||||
const socket = require("socket.io");
|
||||
const io = socket(server);
|
||||
|
||||
let testDoudizhuData = null, testLeducHoldemData = null;
|
||||
|
||||
io.on("connection", socket => {
|
||||
console.log("successfully connected to rlcard showdown frontend");
|
||||
socket.emit("getMessage", "successfully connected to rlcard showdown node server");
|
||||
socket.on("getMessage", message => {
|
||||
let res = null;
|
||||
if(message){
|
||||
switch(message.type){
|
||||
case(0):
|
||||
res = {
|
||||
type: 0,
|
||||
message: {
|
||||
playerInfo: testDoudizhuData.playerInfo,
|
||||
initHands: testDoudizhuData.initHands
|
||||
}
|
||||
};
|
||||
socket.emit("getMessage", res);
|
||||
break;
|
||||
case(1):
|
||||
console.log(message);
|
||||
if(message.message.turn >= testDoudizhuData.moveHistory.length){
|
||||
// todo: process end of game
|
||||
}else{
|
||||
res = {
|
||||
type: 1,
|
||||
message: {
|
||||
turn: message.message.turn,
|
||||
playerIdx: testDoudizhuData.moveHistory[message.message.turn].playerIdx,
|
||||
move: testDoudizhuData.moveHistory[message.message.turn].move
|
||||
}
|
||||
};
|
||||
}
|
||||
socket.emit("getMessage", res);
|
||||
break;
|
||||
}
|
||||
}
|
||||
})
|
||||
});
|
||||
|
||||
router.get('/replay/leduc_holdem/:id', (req, res)=>{
|
||||
res.json(testLeducHoldemData);
|
||||
});
|
||||
|
|
|
@ -1,8 +1,8 @@
|
|||
import React from 'react';
|
||||
import axios from 'axios';
|
||||
import '../assets/gameview.scss';
|
||||
import { DoudizhuGameBoard } from '../components/GameBoard';
|
||||
import webSocket from "socket.io-client";
|
||||
import { removeCards, doubleRaf, deepCopy, debounce } from "../utils";
|
||||
import { removeCards, doubleRaf, deepCopy } from "../utils";
|
||||
|
||||
import { Layout } from 'element-react';
|
||||
import Slider from '@material-ui/core/Slider';
|
||||
|
@ -19,6 +19,8 @@ class DoudizhuGameView extends React.Component {
|
|||
this.initConsiderationTime = 2000;
|
||||
this.considerationTimeDeduction = 100;
|
||||
this.gameStateTimeout = null;
|
||||
this.apiUrl = window.g.apiUrl;
|
||||
this.moveHistory = [];
|
||||
|
||||
this.initGameState = {
|
||||
gameStatus: "ready", // "ready", "playing", "paused", "over"
|
||||
|
@ -32,7 +34,6 @@ class DoudizhuGameView extends React.Component {
|
|||
};
|
||||
|
||||
this.state = {
|
||||
ws: null,
|
||||
gameInfo: this.initGameState,
|
||||
gameStateLoop: null,
|
||||
gameSpeed: 0
|
||||
|
@ -42,11 +43,6 @@ class DoudizhuGameView extends React.Component {
|
|||
gameStateTimer() {
|
||||
this.gameStateTimeout = setTimeout(()=>{
|
||||
let currentConsiderationTime = this.state.gameInfo.considerationTime;
|
||||
// for test use
|
||||
// console.log(currentConsiderationTime);
|
||||
// if(currentConsiderationTime === 1000){
|
||||
// debugger;
|
||||
// }
|
||||
if(currentConsiderationTime > 0) {
|
||||
currentConsiderationTime -= this.considerationTimeDeduction * Math.pow(2, this.state.gameSpeed);
|
||||
currentConsiderationTime = currentConsiderationTime < 0 ? 0 : currentConsiderationTime;
|
||||
|
@ -55,59 +51,8 @@ class DoudizhuGameView extends React.Component {
|
|||
this.setState({gameInfo: gameInfo});
|
||||
this.gameStateTimer();
|
||||
}else{
|
||||
const turn = this.state.gameInfo.turn;
|
||||
const gameStateReq = {
|
||||
type: 1,
|
||||
message: {turn: turn}
|
||||
};
|
||||
let gameInfo = deepCopy(this.state.gameInfo);
|
||||
this.setState({gameInfo: gameInfo});
|
||||
this.state.ws.emit("getMessage", gameStateReq);
|
||||
}
|
||||
}, 100);
|
||||
}
|
||||
|
||||
startReplay() {
|
||||
if(this.state.ws !== null){
|
||||
const replayReq = {type: 0};
|
||||
this.state.ws.emit("getMessage", replayReq);
|
||||
// init game state
|
||||
let initGameState = deepCopy(this.initGameState);
|
||||
// set game status to playing
|
||||
initGameState.gameStatus = "playing";
|
||||
this.setState({gameInfo: initGameState});
|
||||
|
||||
if(this.gameStateTimeout){
|
||||
window.clearTimeout(this.gameStateTimeout);
|
||||
this.gameStateTimeout = null;
|
||||
}
|
||||
// loop to update game state
|
||||
this.gameStateTimer();
|
||||
}else{
|
||||
console.log("websocket not connected");
|
||||
}
|
||||
};
|
||||
|
||||
connectWebSocket() {
|
||||
let ws = webSocket("http://localhost:10080");
|
||||
ws.on("getMessage", message => {
|
||||
if(message){
|
||||
switch(message.type){
|
||||
case 0:
|
||||
// init replay info
|
||||
let gameInfo = deepCopy(this.state.gameInfo);
|
||||
gameInfo.playerInfo = message.message.playerInfo;
|
||||
gameInfo.hands = message.message.initHands.map(element => {
|
||||
return element.split(" ");
|
||||
});
|
||||
// the first player should be landlord
|
||||
gameInfo.currentPlayer = message.message.playerInfo.find(element=>{return element.role === "landlord"}).index;
|
||||
this.setState({gameInfo: gameInfo});
|
||||
break;
|
||||
case 1:
|
||||
// getting player actions
|
||||
let res = message.message;
|
||||
if(res.turn === this.state.gameInfo.turn && res.playerIdx === this.state.gameInfo.currentPlayer){
|
||||
let res = this.moveHistory[this.state.gameInfo.turn];
|
||||
if(res.playerIdx === this.state.gameInfo.currentPlayer){
|
||||
let gameInfo = deepCopy(this.state.gameInfo);
|
||||
gameInfo.latestAction[res.playerIdx] = res.move === "P" ? "P" : res.move.split(" ");
|
||||
gameInfo.turn++;
|
||||
|
@ -122,16 +67,39 @@ class DoudizhuGameView extends React.Component {
|
|||
gameInfo.considerationTime = this.initConsiderationTime;
|
||||
this.setState({gameInfo: gameInfo});
|
||||
}else{
|
||||
console.log("Mismatched game turn or current player index", message);
|
||||
}
|
||||
break;
|
||||
default:
|
||||
console.log("Wrong message type ", message);
|
||||
break;
|
||||
console.log("Mismatched current player index");
|
||||
}
|
||||
}
|
||||
}, 100);
|
||||
}
|
||||
|
||||
startReplay() {
|
||||
// for test use
|
||||
const replayId = 0;
|
||||
|
||||
axios.get(`${this.apiUrl}/replay/doudizhu/${replayId}`)
|
||||
.then(res => {
|
||||
res = res.data;
|
||||
// init replay info
|
||||
this.moveHistory = res.moveHistory;
|
||||
let gameInfo = deepCopy(this.initGameState);
|
||||
gameInfo.gameStatus = "playing";
|
||||
gameInfo.playerInfo = res.playerInfo;
|
||||
gameInfo.hands = res.initHands.map(element => {
|
||||
return element.split(" ");
|
||||
});
|
||||
this.setState({ws: ws});
|
||||
// the first player should be landlord
|
||||
gameInfo.currentPlayer = res.playerInfo.find(element=>{return element.role === "landlord"}).index;
|
||||
this.setState({gameInfo: gameInfo}, ()=>{
|
||||
if(this.gameStateTimeout){
|
||||
window.clearTimeout(this.gameStateTimeout);
|
||||
this.gameStateTimeout = null;
|
||||
}
|
||||
// loop to update game state
|
||||
this.gameStateTimer();
|
||||
});
|
||||
});
|
||||
|
||||
};
|
||||
|
||||
runNewTurn(prevTurn){
|
||||
|
@ -175,7 +143,6 @@ class DoudizhuGameView extends React.Component {
|
|||
}
|
||||
|
||||
changeGameSpeed(newVal){
|
||||
console.log('wdnmd');
|
||||
this.setState({gameSpeed: newVal});
|
||||
}
|
||||
|
||||
|
@ -188,11 +155,10 @@ class DoudizhuGameView extends React.Component {
|
|||
case "paused":
|
||||
return <Button variant={"contained"} startIcon={<PlayArrowRoundedIcon />} color="primary" onClick={()=>{this.resumeReplay()}}>Resume</Button>;
|
||||
case "over":
|
||||
return <Button variant={"contained"} startIcon={<ReplayRoundedIcon />} color="primary" onClick={()=>{this.startReplay()}}>Resume</Button>;
|
||||
return <Button variant={"contained"} startIcon={<ReplayRoundedIcon />} color="primary" onClick={()=>{this.startReplay()}}>Restart</Button>;
|
||||
default:
|
||||
alert(`undefined game status: ${status}`);
|
||||
}
|
||||
return ;
|
||||
}
|
||||
|
||||
render(){
|
||||
|
@ -247,14 +213,14 @@ class DoudizhuGameView extends React.Component {
|
|||
<div className="game-controller">
|
||||
<Layout.Row>
|
||||
<Layout.Col span="24">
|
||||
<Button variant={"contained"} color="primary" onClick={()=>{this.connectWebSocket()}}>Connect</Button>
|
||||
{/*<Button variant={"contained"} color="primary" onClick={()=>{this.connectWebSocket()}}>Connect</Button>*/}
|
||||
{ this.gameStatusButton(this.state.gameInfo.gameStatus) }
|
||||
</Layout.Col>
|
||||
</Layout.Row>
|
||||
<Layout.Row style={{height: "31px"}}>
|
||||
<Layout.Col span="8" style={{height: "100%"}}>
|
||||
<div style={{display: "table", height: "100%"}}>
|
||||
<span style={{display: "table-cell", verticalAlign: "middle"}}>Consideration Time</span>
|
||||
<span style={{display: "table-cell", verticalAlign: "middle"}}>Game Speed</span>
|
||||
</div>
|
||||
</Layout.Col>
|
||||
<Layout.Col span="16">
|
||||
|
|
|
@ -2,7 +2,7 @@ import React from 'react';
|
|||
import axios from 'axios';
|
||||
import '../assets/gameview.scss';
|
||||
import {LeducHoldemGameBoard} from '../components/GameBoard';
|
||||
import {doubleRaf, deepCopy} from "../utils";
|
||||
import {deepCopy} from "../utils";
|
||||
|
||||
import { Button, Layout } from 'element-react';
|
||||
import Slider from '@material-ui/core/Slider';
|
||||
|
@ -10,12 +10,14 @@ import Slider from '@material-ui/core/Slider';
|
|||
class LeducHoldemGameView extends React.Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
|
||||
const mainViewerId = 0; // Id of the player at the bottom of screen
|
||||
this.initConsiderationTime = 2000;
|
||||
this.considerationTimeDeduction = 100;
|
||||
this.gameStateTimeout = null;
|
||||
this.apiUrl = window.g.apiUrl;
|
||||
this.moveHistory = [];
|
||||
|
||||
this.initGameState = {
|
||||
playerInfo: [],
|
||||
hands: [],
|
||||
|
|
Loading…
Reference in New Issue