Adding kick player support.

src/components/farm/Board.jsx

@@ -34,7 +34,7 @@ import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
 import { faUser, faUsers, faTractor, faWindowRestore,
          faDollarSign, faTimes, faAsterisk, faExchangeAlt,
          faInfoCircle, faArrowUp, faArrowDown, faAward,
-         faTimesCircle } from '@fortawesome/free-solid-svg-icons'
+         faTimesCircle, faBan } from '@fortawesome/free-solid-svg-icons'
 
 import { GroupBox, Row, Col, Button } from '../widgets.jsx'
 import SpaceNode from './SpaceNode.jsx'
@@ -48,7 +48,7 @@ import { setSelectedCard, setMessagePanelSpace, setMPDims, movePlayer,
 import { buy, roll, endTurn, loan, trade, submitTradeAccept,
          submitTradeDeny, submitTradeCancel, audit,
          buyUncleBert, skip, endAiTurn, startGame, readyToStart,
-         leaveGame } from './interface.js'
+         leaveGame, kickPlayer } from './interface.js'
 
 function netWorth(player) {
     return ((player.assets.hay + player.assets.grain) * 2000) +
@@ -1935,7 +1935,8 @@ class Info extends React.Component {
 class StartGame extends React.Component {
     render() {
         const { auditThreshold, downPayment, loanInterest, maxDebt, startingOtbs, startingCash, startingDebt } = this.props.game.settings;
-        const { name } = this.props.game;
+        const playerName = this.props.player.name;
+        const { name, host } = this.props.game;
         return (
             <>
                 <h1>Lobby</h1>
@@ -1948,6 +1949,11 @@ class StartGame extends React.Component {
                     {this.props.game.otherPlayers.map((p, i) => (
                         <li key={i}>
                             {p.player.name}
+                            {playerName === host ? (
+                                 <span title="Kick Player" className="kick-player" onClick={() => kickPlayer(p.player.name)}>
+                                     <FontAwesomeIcon icon={faBan} />
+                                 </span>
+                            ): (<></>)}
                         </li>
                     ))}
                 </ul>

src/components/farm/interface.js

@@ -31,7 +31,7 @@ import { itemCard, fateCard } from 'game.js'
 export { initialize, buy, roll, endTurn, loan, trade, submitTradeAccept,
          submitTradeDeny, submitTradeCancel, audit, handleMessage,
          nextAction, buyUncleBert, actionsFinished, skip, endAiTurn,
-         startGame, readyToStart, leaveGame }
+         startGame, readyToStart, leaveGame, kickPlayer }
 
 let store;
 let movingTimer = 0;
@@ -213,6 +213,10 @@ function leaveGame() {
     sendCommand({ type: 'leave-game' });
 }
 
+function kickPlayer(name) {
+    sendCommand({ type: 'kick-player', name });
+}
+
 // TODO share with Board.jsx
 // http://stackoverflow.com/questions/149055
 function formatMoney(n) {

src/components/farm/reducers.js

@@ -106,6 +106,7 @@ const initialState = {
             turn: 0,
             oldMessages: [],
             name: '',
+            host: '',
             settings: { downPayment: 0.2,
                         loanInterest: 0.2,
                         maxDebt: 50000,

src/server/farm.scm

@@ -577,7 +577,8 @@
              (readyToStart . ,(fold (lambda (p r)
                                       (and (player-ready-to-start p) r))
                                     #t
-                                    (game-players g)))))))
+                                    (game-players g)))
+             (host . ,(player-name (car (game-players g))))))))
 
 (define (buy-crop crop unnormalized-crop amount cash-value player game)
   (let ((total-cost (* amount (alist-ref unnormalized-crop
@@ -1448,11 +1449,13 @@
                               (player-otbs kicked-player)))
            (safe-set! (game-players (*game*))
                       (filter (lambda (p)
-                                (eq? p kicked-player))
+                                (not (eq? p kicked-player)))
                               (game-players (*game*))))
-           (db-remove-user-game (player-user-id kicked-player) (game-id (*game*))))
+           (db-remove-user-game (player-user-id kicked-player) (game-id (*game*)))
-         (message-players! (*game*) (*player*) '() type: "update")
+           (mailbox-send! (player-mailbox kicked-player) '((type . "left-game") (value . ())))
-         (create-ws-response (*player*) "update" '()))
+           (message-players! (*game*) (*player*) `((color . ,(symbol->string (player-color kicked-player))))
+                             type: "player-left-game")
+           (create-ws-response (*player*) "player-left-game" `((color . ,(symbol->string (player-color kicked-player)))))))
         ((string=? type "leave-game")
          (safe-set! (game-colors (*game*))
                     (cons (player-color (*player*)) (game-colors (*game*))))

src/style.scss

@@ -928,70 +928,11 @@ $intro-time: 6s;
     position: absolute;
     bottom: 1rem; }
 
-/* -------- MENU ------- */
+.kick-player {
-/* Position and sizing of burger button */
+    cursor: pointer;
-.bm-burger-button {
+    color: red;
-  position: fixed;
+    margin-left: 0.2rem; }
-  width: 36px;
-  height: 30px;
-  left: 36px;
-  top: 36px;
-}
 
-/* Color/shape of burger icon bars */
+ul {
-.bm-burger-bars {
+    margin-left: 0;
-  background: #373a47;
+    list-style-type: none; }
-}
-
-/* Color/shape of burger icon bars on hover*/
-.bm-burger-bars-hover {
-  background: #a90000;
-}
-
-/* Position and sizing of clickable cross button */
-.bm-cross-button {
-  height: 24px;
-  width: 24px;
-}
-
-/* Color/shape of close button cross */
-.bm-cross {
-  background: #bdc3c7;
-}
-
-/*
-Sidebar wrapper styles
-Note: Beware of modifying this element as it can break the animations - you should not need to touch it in most cases
-*/
-.bm-menu-wrap {
-  position: fixed;
-  height: 100%;
-}
-
-/* General sidebar styles */
-.bm-menu {
-  background: #373a47;
-  padding: 2.5em 1.5em 0;
-  font-size: 1.15em;
-}
-
-/* Morph shape necessary with bubble or elastic */
-.bm-morph-shape {
-  fill: #373a47;
-}
-
-/* Wrapper for item list */
-.bm-item-list {
-  color: #b8b7ad;
-  padding: 0.8em;
-}
-
-/* Individual item */
-.bm-item {
-  display: inline-block;
-}
-
-/* Styling of overlay */
-.bm-overlay {
-  background: rgba(0, 0, 0, 0.3);
-}