diff --git a/src/components/farm/Board.jsx b/src/components/farm/Board.jsx index dc34576..64a40cf 100644 --- a/src/components/farm/Board.jsx +++ b/src/components/farm/Board.jsx @@ -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 = (); break; case 'goto': view = ( 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 { ); } + const actionComponent = ( + 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 (
@@ -1705,17 +1734,7 @@ class BoardApp extends React.Component { game={this.props.game} showScreen={this.showScreen} />
- 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}
@@ -1757,17 +1776,7 @@ class BoardApp extends React.Component {
- 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}
diff --git a/src/components/farm/interface.js b/src/components/farm/interface.js index f3c904c..c7b29ad 100644 --- a/src/components/farm/interface.js +++ b/src/components/farm/interface.js @@ -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' }); }