Improving birthday bonus.

src/components/farm/Board.jsx

@@ -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'
 
 function netWorth(player) {
     return ((player.assets.hay + player.assets.grain) * 2000) +
@@ -121,10 +121,12 @@ class PlayerResources extends React.Component {
                               amount={player.assets.tractor}>
                     {player.assets.tractor}
                 </ResourceUnit>{' '}
-                <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>
+                {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>
         );
     }
@@ -1924,6 +1926,10 @@ const StartGame = ({ game, player, toggleReady }) => {
     const playerName = player.name;
     const { color } = player;
     const { name, host } = game;
+
+    const birthdayClass = (player) =>
+        player.assets.birthday ? 'birthday-selected' : '';
+
     return (
         <>
             <h1>Lobby</h1>
@@ -1932,14 +1938,26 @@ const StartGame = ({ game, player, toggleReady }) => {
             </p>
             <h3>Players</h3>
             <ul>
-                <li><PlayerColorIcon color={color} /> {playerName}</li>
+                <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="kick-player" onClick={() => kickPlayer(p.player.name)}>
-                                 <FontAwesomeIcon icon={faBan} />
-                             </span>
+                             <>
+                                 <span title="Kick Player" className="lobby-icon kick-player" onClick={() => kickPlayer(p.player.name)}>
+                                     <FontAwesomeIcon icon={faBan} />
+                                 </span>
+                                 <span title="Birthday Bonus" className={"lobby-icon " + birthdayClass(p.player)} onClick={() => birthdayBonusPlayer(p.player.name)}>
+                                     <FontAwesomeIcon icon={faBirthdayCake} />
+                                 </span>
+                             </>
                         ): (<></>)}
                     </li>
                 ))}

src/components/farm/interface.js

@@ -32,7 +32,7 @@ export { initialize, buy, roll, endTurn, loan, trade, submitTradeAccept,
          submitTradeDeny, submitTradeCancel, audit, handleMessage,
          nextAction, buyUncleBert, actionsFinished, skip, endAiTurn,
          startGame, readyToStart, leaveGame, kickPlayer, toggleRevealForTrade,
-         addAIPlayer }
+         addAIPlayer, birthdayBonusPlayer }
 
 let store;
 let movingTimer = 0;
@@ -218,6 +218,10 @@ function kickPlayer(name) {
     sendCommand({ type: 'kick-player', name });
 }
 
+function birthdayBonusPlayer(name) {
+    sendCommand({ type: 'birthday-bonus-player', name });
+}
+
 function addAIPlayer() {
     sendCommand({ type: 'add-ai-player' });
 }