|
|
|
|
@ -34,7 +34,7 @@ import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
|
|
|
|
|
import { faUser, faUsers, faTractor, faWindowRestore,
|
|
|
|
|
faDollarSign, faTimes, faExchangeAlt,
|
|
|
|
|
faInfoCircle, faArrowUp, faArrowDown, faAward,
|
|
|
|
|
faBan, faArrowCircleLeft, faPlusCircle } from '@fortawesome/free-solid-svg-icons'
|
|
|
|
|
faBan, faArrowCircleLeft, faPlusCircle, faBirthdayCake } from '@fortawesome/free-solid-svg-icons'
|
|
|
|
|
|
|
|
|
|
import { GroupBox, Row, Col, Button } from '../widgets.jsx'
|
|
|
|
|
import SpaceNode from './SpaceNode.jsx'
|
|
|
|
|
@ -49,7 +49,7 @@ import { buy, roll, endTurn, loan, trade, submitTradeAccept,
|
|
|
|
|
submitTradeDeny, submitTradeCancel, audit,
|
|
|
|
|
buyUncleBert, skip, endAiTurn, startGame, readyToStart,
|
|
|
|
|
leaveGame, kickPlayer, toggleRevealForTrade,
|
|
|
|
|
addAIPlayer } from './interface.js'
|
|
|
|
|
addAIPlayer, birthdayBonusPlayer } from './interface.js'
|
|
|
|
|
|
|
|
|
|
let showScreenDelay = 2000;
|
|
|
|
|
|
|
|
|
|
@ -177,18 +177,18 @@ class PlayerResources extends React.Component {
|
|
|
|
|
<ResourceUnit img={TractorImg} h='240' s='100' label='Tractors'
|
|
|
|
|
amount={player.assets.tractor}>
|
|
|
|
|
{player.assets.tractor}
|
|
|
|
|
</ResourceUnit>
|
|
|
|
|
</ResourceUnit>{' '}
|
|
|
|
|
{player.assets.birthday ? (
|
|
|
|
|
<ResourceUnit img={CakeImg} h='240' s='100' label='Birthday'
|
|
|
|
|
amount={player.assets.birthday ? player.assets.birthday : 0}>
|
|
|
|
|
{player.assets.birthday ? player.assets.birthday : 0}
|
|
|
|
|
</ResourceUnit>
|
|
|
|
|
) : (<></>)}
|
|
|
|
|
</div>
|
|
|
|
|
);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
/* {' '}
|
|
|
|
|
* <ResourceUnit img={CakeImg} h='240' s='100' label='Birthday'
|
|
|
|
|
* amount={player.assets.birthday ? player.assets.birthday : 0}>
|
|
|
|
|
* {player.assets.birthday ? player.assets.birthday : 0}
|
|
|
|
|
* </ResourceUnit> */
|
|
|
|
|
|
|
|
|
|
// http://stackoverflow.com/questions/149055
|
|
|
|
|
function formatMoney(n) {
|
|
|
|
|
return n.toFixed(1).replace(/(\d)(?=(\d{3})+\.)/g, '$1,').slice(0, -2); }
|
|
|
|
|
@ -1949,21 +1949,23 @@ class AlertOverlay extends React.Component {
|
|
|
|
|
<FontAwesomeIcon icon={faTimes} />
|
|
|
|
|
</div>
|
|
|
|
|
) : (<></>)}
|
|
|
|
|
<div className='alert-overlay-contents'>
|
|
|
|
|
{this.props.children}
|
|
|
|
|
<br />
|
|
|
|
|
<div>
|
|
|
|
|
<Button onClick={this.buttonClick} disabled={!!this.props.disabled}>{this.props.buttonText}</Button>
|
|
|
|
|
{this.props.cancelButtonText ? (
|
|
|
|
|
<>
|
|
|
|
|
{' '}
|
|
|
|
|
<Button onClick={this.cancelButtonClick} disabled={!!this.props.cancelDisabled}>
|
|
|
|
|
{this.props.cancelButtonText}
|
|
|
|
|
</Button>
|
|
|
|
|
</>
|
|
|
|
|
): (<></>)}
|
|
|
|
|
<div className='alert-container'>
|
|
|
|
|
<div className='alert-overlay-contents'>
|
|
|
|
|
{this.props.children}
|
|
|
|
|
<br />
|
|
|
|
|
<div>
|
|
|
|
|
<Button onClick={this.buttonClick} disabled={!!this.props.disabled}>{this.props.buttonText}</Button>
|
|
|
|
|
{this.props.cancelButtonText ? (
|
|
|
|
|
<>
|
|
|
|
|
{' '}
|
|
|
|
|
<Button onClick={this.cancelButtonClick} disabled={!!this.props.cancelDisabled}>
|
|
|
|
|
{this.props.cancelButtonText}
|
|
|
|
|
</Button>
|
|
|
|
|
</>
|
|
|
|
|
): (<></>)}
|
|
|
|
|
</div>
|
|
|
|
|
{!this.props.preventHiding ? (<a onClick={this.hide}>close</a>) : (<></>)}
|
|
|
|
|
</div>
|
|
|
|
|
{!this.props.preventHiding ? (<a onClick={this.hide}>close</a>) : (<></>)}
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
);
|
|
|
|
|
@ -2055,54 +2057,68 @@ class Info extends React.Component {
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
class StartGame extends React.Component {
|
|
|
|
|
render() {
|
|
|
|
|
const { auditThreshold, downPayment, loanInterest, maxDebt, startingOtbs, startingCash, startingDebt } = this.props.game.settings;
|
|
|
|
|
const playerName = this.props.player.name;
|
|
|
|
|
const { color } = this.props.player;
|
|
|
|
|
const { name, host } = this.props.game;
|
|
|
|
|
return (
|
|
|
|
|
<>
|
|
|
|
|
<h1>Lobby</h1>
|
|
|
|
|
<p>
|
|
|
|
|
<b>Game</b>: {name}
|
|
|
|
|
</p>
|
|
|
|
|
<h3>Players</h3>
|
|
|
|
|
<ul>
|
|
|
|
|
<li><PlayerColorIcon color={color} /> {playerName}</li>
|
|
|
|
|
{this.props.game.otherPlayers.map((p, i) => (
|
|
|
|
|
<li key={i}>
|
|
|
|
|
<PlayerColorIcon color={p.player.color} /> {p.player.name}
|
|
|
|
|
{playerName === host ? (
|
|
|
|
|
<span title="Kick Player" className="kick-player" onClick={() => kickPlayer(p.player.name)}>
|
|
|
|
|
const StartGame = ({ game, player, toggleReady }) => {
|
|
|
|
|
const { auditThreshold, downPayment, loanInterest, maxDebt, startingOtbs, startingCash, startingDebt } = game.settings;
|
|
|
|
|
const playerName = player.name;
|
|
|
|
|
const { color } = player;
|
|
|
|
|
const { name, host } = game;
|
|
|
|
|
|
|
|
|
|
const birthdayClass = (player) =>
|
|
|
|
|
player.assets.birthday ? 'birthday-selected' : '';
|
|
|
|
|
|
|
|
|
|
return (
|
|
|
|
|
<>
|
|
|
|
|
<h1>Lobby</h1>
|
|
|
|
|
<p>
|
|
|
|
|
<b>Game</b>: {name}
|
|
|
|
|
</p>
|
|
|
|
|
<h3>Players</h3>
|
|
|
|
|
<ul>
|
|
|
|
|
<li>
|
|
|
|
|
<PlayerColorIcon color={color} /> {playerName}
|
|
|
|
|
{playerName === host ? (
|
|
|
|
|
<span title="Birthday Bonus" className={'lobby-icon ' + birthdayClass(player)} onClick={() => birthdayBonusPlayer(playerName)}>
|
|
|
|
|
<FontAwesomeIcon icon={faBirthdayCake} />
|
|
|
|
|
</span>
|
|
|
|
|
) : (<></>)}
|
|
|
|
|
</li>
|
|
|
|
|
{game.otherPlayers.map((p, i) => (
|
|
|
|
|
<li key={i}>
|
|
|
|
|
<PlayerColorIcon color={p.player.color} /> {p.player.name}
|
|
|
|
|
{playerName === host ? (
|
|
|
|
|
<>
|
|
|
|
|
<span title="Kick Player" className="lobby-icon kick-player" onClick={() => kickPlayer(p.player.name)}>
|
|
|
|
|
<FontAwesomeIcon icon={faBan} />
|
|
|
|
|
</span>
|
|
|
|
|
): (<></>)}
|
|
|
|
|
</li>
|
|
|
|
|
))}
|
|
|
|
|
<li>
|
|
|
|
|
<span className="add-ai" onClick={addAIPlayer}>
|
|
|
|
|
<FontAwesomeIcon icon={faPlusCircle} />AI
|
|
|
|
|
</span>
|
|
|
|
|
<span title="Birthday Bonus" className={"lobby-icon " + birthdayClass(p.player)} onClick={() => birthdayBonusPlayer(p.player.name)}>
|
|
|
|
|
<FontAwesomeIcon icon={faBirthdayCake} />
|
|
|
|
|
</span>
|
|
|
|
|
</>
|
|
|
|
|
): (<></>)}
|
|
|
|
|
</li>
|
|
|
|
|
</ul>
|
|
|
|
|
<h4>Game Settings</h4>
|
|
|
|
|
<ul>
|
|
|
|
|
<li><b>Audit Threshold</b>: ${formatMoney(auditThreshold)}</li>
|
|
|
|
|
<li><b>Max Debt</b>: ${formatMoney(maxDebt)}</li>
|
|
|
|
|
<li><b>Loan Interest</b>: {loanInterest * 100}%</li>
|
|
|
|
|
<li><b>Required Down Payment</b>: {downPayment * 100}%</li>
|
|
|
|
|
<li><b>Starting {itemCardShort}</b>: {startingOtbs}</li>
|
|
|
|
|
<li><b>Starting Cash</b>: ${formatMoney(startingCash)}</li>
|
|
|
|
|
<li><b>Starting Debt</b>: ${formatMoney(startingDebt)}</li>
|
|
|
|
|
</ul>
|
|
|
|
|
<label>
|
|
|
|
|
<input type="checkbox" onChange={this.props.toggleReady} />
|
|
|
|
|
Ready to start
|
|
|
|
|
</label>
|
|
|
|
|
</>
|
|
|
|
|
);
|
|
|
|
|
}
|
|
|
|
|
))}
|
|
|
|
|
<li>
|
|
|
|
|
<span className="add-ai" onClick={addAIPlayer}>
|
|
|
|
|
<FontAwesomeIcon icon={faPlusCircle} />AI
|
|
|
|
|
</span>
|
|
|
|
|
</li>
|
|
|
|
|
</ul>
|
|
|
|
|
<h4>Game Settings</h4>
|
|
|
|
|
<ul>
|
|
|
|
|
<li><b>Audit Threshold</b>: ${formatMoney(auditThreshold)}</li>
|
|
|
|
|
<li><b>Max Debt</b>: ${formatMoney(maxDebt)}</li>
|
|
|
|
|
<li><b>Loan Interest</b>: {loanInterest * 100}%</li>
|
|
|
|
|
<li><b>Required Down Payment</b>: {downPayment * 100}%</li>
|
|
|
|
|
<li><b>Starting {itemCardShort}</b>: {startingOtbs}</li>
|
|
|
|
|
<li><b>Starting Cash</b>: ${formatMoney(startingCash)}</li>
|
|
|
|
|
<li><b>Starting Debt</b>: ${formatMoney(startingDebt)}</li>
|
|
|
|
|
</ul>
|
|
|
|
|
<label>
|
|
|
|
|
<input type="checkbox" onChange={toggleReady} />
|
|
|
|
|
Ready to start
|
|
|
|
|
</label>
|
|
|
|
|
</>
|
|
|
|
|
);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
const SCREENS = { summary: 'summary', misc: 'misc', farms: 'farms',
|
|
|
|
|
@ -2246,7 +2262,7 @@ class BoardApp extends React.Component {
|
|
|
|
|
buttonText='Close'
|
|
|
|
|
hideHandler={() => 'nothing'}
|
|
|
|
|
handler={() => { return false; }}>
|
|
|
|
|
<Fragment>
|
|
|
|
|
<div className="game-over">
|
|
|
|
|
<h1>Game Over!</h1>
|
|
|
|
|
{alert.contents.results.map((e, i) => (
|
|
|
|
|
<p key={i}>{e}</p>
|
|
|
|
|
@ -2257,7 +2273,14 @@ class BoardApp extends React.Component {
|
|
|
|
|
<p>{alert.contents.stats.emergency}</p>
|
|
|
|
|
<p>{alert.contents.stats.highRoller}</p>
|
|
|
|
|
<p>{alert.contents.stats.lowRoller}</p>
|
|
|
|
|
</Fragment>
|
|
|
|
|
{alert.contents.stats.players.map(p => (
|
|
|
|
|
<div key={p.name}>
|
|
|
|
|
<p><b>{p.name} Harvests:</b></p>
|
|
|
|
|
<p>Total: ${formatMoney(p.harvestTotal)} Expenses: ${formatMoney(Math.abs(p.operatingExpenses))}</p>
|
|
|
|
|
<p>Avg ${formatMoney(p.harvestAverage)} rolling {p.harvestRoll} for {p.numHarvests} harvests</p>
|
|
|
|
|
<p>Hay: ${formatMoney(p.hay)} Grain: ${formatMoney(p.grain)} Fruit: ${formatMoney(p.fruit)} Cows: ${formatMoney(p.cows)}</p>
|
|
|
|
|
</div>))}
|
|
|
|
|
</div>
|
|
|
|
|
</AlertOverlay>
|
|
|
|
|
);
|
|
|
|
|
} else if (alert && alert.type === ALERTS.auditCalled) {
|
|
|
|
|
|
