tjhintz/farm
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Fixing Moving bugs.

Browse Source
This commit is contained in:
Thomas Hintz
2020-04-01 08:33:18 -07:00
parent 2bdab2ab6e
commit c45b9af10d
2 changed files with 52 additions and 44 deletions
Download Patch File Download Diff File Expand all files Collapse all files

79
src/components/farm/Board.jsx
View File

@@ -1011,7 +1011,6 @@ class Harvest extends React.Component {
// props: currentPos, moveTo, color
// actions: movePlayer
class Moving extends React.Component {
timerId = false
endPos = 0
color = ''
hurtBack = false
@@ -1041,14 +1040,17 @@ class Moving extends React.Component {
this.color);
this.setState(state => ({ currentPos: state.currentPos + delta}));
if (this.state.currentPos + delta !== this.endPos) {
this.timerId = setInterval(() => this.tick(), 500);
if (this.props.timerId) {
clearInterval(this.props.timerId);
}
this.props.setTimerId(setInterval(() => this.tick(), 500));
}
}
componentWillUnmount() {
if (this.timerId) {
clearInterval(this.timerId);
this.timerId = false;
if (this.props.timerId) {
clearInterval(this.props.timerId);
this.props.setTimerId(false);
}
// if another player skips movement
if (this.state.currentPos !== this.endPos) {
@@ -1065,8 +1067,8 @@ class Moving extends React.Component {
this.color);
this.setState(state => ({ currentPos: state.currentPos + delta}));
if (this.state.currentPos === this.endPos) {
if (this.timerId) { clearInterval(this.timerId); }
this.timerId = false;
if (this.props.timerId) { clearInterval(this.props.timerId); }
this.props.setTimerId(false);
}
}
@@ -1074,8 +1076,8 @@ class Moving extends React.Component {
if (!preventAutoSkip) {
skip('moving');
}
clearInterval(this.timerId);
this.timerId = false;
clearInterval(this.props.timerId);
this.props.setTimerId(false);
this.props.movePlayer(this.endPos, this.state.currentPos, this.color);
this.setState({ currentPos: this.endPos });
}
@@ -1234,12 +1236,15 @@ class Action extends React.Component {
spaces={this.props.spaces}
movePlayer={this.props.movePlayer}
autoSkip={this.props.ui.autoSkip}
timerId={this.props.timerId}
setTimerId={this.props.setTimerId}
ui={this.props.ui} />);
buttons = (<Fragment />);
break;
case 'goto':
view = (<Moving showNextAction={() => this.props.showNextAction()}
key={this.props.game.currentPlayer + '|' + this.props.ui.actionValue.from + '|' + this.props.ui.actionValue.to}
timerId={this.props.timerId}
setTimerId={this.props.setTimerId}
player={this.props.player}
game={this.props.game}
spaces={this.props.spaces}
@@ -1492,7 +1497,8 @@ class BoardApp extends React.Component {
super(props);
this.state = {
screen: SCREENS.summary,
card: props.ui.card
card: props.ui.card,
timerId: false
};
this.myRef = React.createRef();
this.actionRef = React.createRef();
@@ -1555,10 +1561,19 @@ class BoardApp extends React.Component {
// midRow.onmouseover = () => this.props.setMessagePanelSpace(null);
}
setTimerId = id => {
this.setState(state => {
if (state.timerId) {
clearInterval(state.timerId);
}
return { timerId: id }
});
}
iconClass = icon => {
return this.iconToScreen[icon] === this.state.screen ? 'is-active' :
(this.iconToScreen[icon] === SCREENS.trade ?
(this.props.game.settings.trade ? ' ' : ' hidden ')
(this.iconToScreen[icon] === SCREENS.trade ?
(this.props.game.settings.trade ? ' ' : ' hidden ')
: (icon === 'tractor' ? ' hide-for-large ' : ' '));
}
@@ -1673,6 +1688,20 @@ class BoardApp extends React.Component {
</AlertOverlay>
);
}
const actionComponent = (
<Action
timerId={this.state.timerId}
setTimerId={this.setTimerId}
forwardRef={x => this.actionRef = x}
spaces={this.props.spaces}
player={this.props.player}
game={this.props.game}
movePlayer={this.props.movePlayer}
showNextAction={this.props.nextUIAction}
otherPlayersTurn={this.props.player.name !== this.props.game.currentPlayer}
screen={this.state.screen}
showScreen={screen => this.showScreen(screen)}
ui={this.props.ui} />);
// faExchangeAlt -> trade icon, hidden for now
return (
<div className='game-container' ref={this.myRef}>
@@ -1705,17 +1734,7 @@ class BoardApp extends React.Component {
game={this.props.game} showScreen={this.showScreen} />
</div>
<div className={this.tabClass(SCREENS.action)}>
<Action
forwardRef={x => this.actionRef = x}
spaces={this.props.spaces}
player={this.props.player}
game={this.props.game}
movePlayer={this.props.movePlayer}
showNextAction={this.props.nextUIAction}
otherPlayersTurn={this.props.player.name !== this.props.game.currentPlayer}
screen={this.state.screen}
showScreen={screen => this.showScreen(screen)}
ui={this.props.ui} />
{actionComponent}
</div>
<div className={this.tabClass(SCREENS.cards)}>
<Row>
@@ -1757,17 +1776,7 @@ class BoardApp extends React.Component {
</div>
<div className='static-tab-container show-for-large'>
<div className='tab show'>
<Action
forwardRef={x => this.actionRefExtra = x}
spaces={this.props.spaces}
player={this.props.player}
game={this.props.game}
movePlayer={this.props.movePlayer}
showNextAction={this.props.nextUIAction}
otherPlayersTurn={this.props.player.name !== this.props.game.currentPlayer}
screen={this.state.screen}
showScreen={screen => this.showScreen(screen)}
ui={this.props.ui} />
{actionComponent}
</div>
</div>
</div>

17
src/components/farm/interface.js
View File

@@ -108,15 +108,6 @@ function handleMessage(evt) {
if (data.event === 'end-of-game') {
store.dispatch(alert(ALERTS.endOfGame, data.results, 'endOfGame' + data.game.turn));
}
if (data.event === 'action' && data.action === false) {
const playerSpaces = store.getState().farm.ui.playerSpaces;
data.game.otherPlayers.map(x => x.player).concat([data.player]).forEach(player => {
if (player.space !== playerSpaces[player.color]) {
store.dispatch(movePlayer(player.space, playerSpaces[player.color],
player.color));
}
});
}
});
};
@@ -133,6 +124,14 @@ function roll() {
}
function endTurn() {
const farmState = store.getState().farm;
const playerSpaces = farmState.ui.playerSpaces;
farmState.game.otherPlayers.map(x => x.player).concat([farmState.player]).forEach(player => {
if (player.space !== playerSpaces[player.color]) {
store.dispatch(movePlayer(player.space, playerSpaces[player.color],
player.color));
}
});
store.dispatch(gameState(GAME_STATES.turnEnded));
sendCommand({ type: 'turn-ended' });
}