Set empty strings to "" instead of undefined

Signed-off-by: James Ketrenos <james_eikona@ketrenos.com>

client/src/Board.js

@@ -1,8 +1,10 @@
-import React, { useEffect, useState, useContext, useRef, useMemo } from "react";
+import React, { useEffect, useState, useContext, useRef, useMemo,
+  useCallback } from "react";
 import equal from "fast-deep-equal";
 import { assetsPath, debounce } from "./Common.js";
 import "./Board.css";
 import { GlobalContext } from "./GlobalContext.js";
+
 const rows = [3, 4, 5, 4, 3, 2]; /* The final row of 2 is to place roads and corners */
 
 const
@@ -214,11 +216,11 @@ const Board = () => {
     ><div className="Tile-Shape"/></div>;
   };
 
-  const sendPlacement = (type, index) => {
+  const sendPlacement = useCallback((type, index) => {
     ws.send(JSON.stringify({
       type, index
     }));
-  };
+  }, [ws]);
 
   const Road = ({road}) => {
     const onClick = (event) => {

client/src/Table.js

@@ -47,15 +47,7 @@ function withRouter(Component) {
 }
 /* end of withRouter polyfill */
   
-const Development = ({table, type, card, onClick}) => {
+
-  return (
-    <div className={`Development ${card.played ? 'Selected' : ''}`}
-      onClick={onClick}
-      style={{
-        backgroundImage:`url(${assetsPath}/gfx/card-${type}.png)`
-      }}/>
-  );
-};
 
 const StartButton = ({ table, game }) => {
   const startClick = (event) => {
@@ -67,42 +59,6 @@ const StartButton = ({ table, game }) => {
   );
 };
 
-const PlayerName = ({table, game}) => {
-  const [name, setName] = useState(game.name ? game.name : "");
-
-  const nameChange = (event) => {
-    setName(event.target.value);
-  }
-
-  const sendName = () => {
-    if (name !== game.name) {
-      table.setPlayerName(name);
-    } else {
-      table.setError("");
-      table.setState({ pickName: false });
-    }
-  }
-
-  const nameKeyPress = (event) => {
-    if (event.key === "Enter") {
-      sendName();
-    }
-  }
-
-  return (
-    <Paper className="PlayerName">
-      <TextField className="nameInput"
-        onChange={nameChange}
-        onKeyPress={nameKeyPress}
-        label="Enter your name"
-        variant="outlined"
-        value={name}
-        />
-        <Button onClick={() => sendName()}>Set</Button>
-    </Paper>
-  );
-};
-
 /* This needs to take in a mechanism to declare the
  * player's active item in the game */
 const Players = ({ table, game }) => {

server/routes/games.js

@@ -18,7 +18,7 @@ const debug = {
   audio: false,
   get: true,
   set: true,
-  update: false//true
+  update: true
 };
 
 let gameDB;
@@ -149,17 +149,6 @@ const processTies = (players) => {
   return !ties;
 }
 
-
-const playerFromName = (game, name) => {
-  for (let color in game.players) {
-    if (game.players[color].name === name) {
-      return game.players[color];
-    }
-  }
-  return undefined;
-};
-
-
 const processGameOrder = (game, player, dice) => {
   if (player.orderRoll) {
     return `You have already rolled for game order and are not in a tie.`;
@@ -433,7 +422,8 @@ const newPlayer = (color) => {
     brick: 0,
     army: 0,
     development: [],
-    color
+    color: color,
+    name: ""
   };
 }
 
@@ -446,8 +436,8 @@ const getSession = (game, id) => {
   if (!(id in game.sessions)) {
     game.sessions[id] = {
       id: `[${id.substring(0, 8)}]`,
-      name: undefined,
+      name: '',
-      color: undefined,
+      color: '',
       player: undefined,
       lastActive: Date.now(),
       live: true
@@ -544,7 +534,7 @@ const loadGame = async (id) => {
       session.player.status = 'Active';
       session.player.live = false;
     } else {
-      session.color = undefined;
+      session.color = '';
       session.player = undefined;
     }
    
@@ -575,7 +565,6 @@ const canGiveBuilding = (game) => {
   if (game.turn.actions && game.turn.actions.length !== 0) {
     return `Admin cannot give a building while other actions in play: ${game.turn.actions.join(', ')}.`
   }
-  return undefined;
 }
 
 const adminActions = (game, action, value) => {
@@ -722,9 +711,7 @@ const adminActions = (game, action, value) => {
     addChatMessage(game, null, `Admin rolling ${dice.join(', ')} for ${game.turn.name}.`);
     switch (game.state) {
     case 'game-order':
-      message = `${game.turn.name} rolled ${dice[0]}.`;
+      addActivity(game, session, `${game.turn.name} rolled ${dice[0]}.`);
-      addActivity(game, session, message);
-      message = undefined;
       processGameOrder(game, session.player, dice[0]);
       break;
     case 'normal':
@@ -769,7 +756,7 @@ const adminActions = (game, action, value) => {
         clearPlayer(player);
         session.player = undefined;
       }
-      session.color = undefined;
+      session.color = "";
       return;
     }
     return `Unable to find active session for ${colorToWord(color)} (${value})`;
@@ -889,7 +876,7 @@ const colorToWord = (color) => {
     case 'B': return 'blue';
     case 'R': return 'red';
     default:
-      return undefined;
+      return '';
   }
 }
 
@@ -935,7 +922,7 @@ const setPlayerColor = (game, session, color) => {
     /* Deselect currently active player for this session */
     clearPlayer(session.player);
     session.player = undefined;
-    session.color = undefined;
+    session.color = '';
     active--;
    
     /* If the player is not selecting a color, then return */
@@ -950,7 +937,7 @@ const setPlayerColor = (game, session, color) => {
       }
       sendUpdateToPlayer(session, {
         name: session.name,
-        color: undefined,
+        color: '',
         live: session.live,
         private: session.player
       });
@@ -1015,7 +1002,7 @@ const addActivity = (game, session, message) => {
   if (game.activities.length && game.activities[game.activities.length - 1].date === date) {
     date++;
   }
-  game.activities.push({ color: session ? session.color : undefined, message, date });
+  game.activities.push({ color: session ? session.color : '', message, date });
 }
 
 const addChatMessage = (game, session, message) => {
@@ -2454,7 +2441,6 @@ const placeRoad = (game, session, index) => {
     longestRoad: game.longestRoad,
     longestRoadLength: game.longestRoadLength
   });
-
 }
 
 const discard = (game, session, discards) => {
@@ -3003,12 +2989,23 @@ const sendGameToPlayers = (game) => {
 };
 
 const sendUpdateToPlayers = async (game, update) => {
+  /* Ensure clearing of a field actually gets sent by setting
+    * undefined to 'false' 
+    */
+  for (let key in update) {
+    if (update[key] === undefined) {
+      update[key] = false;
+    }
+  }
+
   if (debug.update) {
     console.log(`[   all  ]: -> sendUpdateToPlayers - `, update);
   } else {
     const keys = Object.getOwnPropertyNames(update);
     console.log(`[   all  ]: -> sendUpdateToPlayers - ${keys.join(',')}`);
   }
+
+  
   const message = JSON.stringify({
     type: 'game-update', 
     update
@@ -3024,12 +3021,23 @@ const sendUpdateToPlayers = async (game, update) => {
 }
 
 const sendUpdateToPlayer = async (session, update) => {
+
+  /* Ensure clearing of a field actually gets sent by setting
+    * undefined to 'false' 
+    */
+  for (let key in update) {
+    if (update[key] === undefined) {
+      update[key] = false;
+    }
+  }
+
   if (debug.update) {
     console.log(`${session.id}: -> sendUpdateToPlayer:${getName(session)} - `, update);
   } else {
     const keys = Object.getOwnPropertyNames(update);
     console.log(`${session.id}: -> sendUpdateToPlayer:${getName(session)} - ${keys.join(',')}`);
   }
+
   const message = JSON.stringify({
     type: 'game-update', 
     update
@@ -3689,12 +3697,11 @@ const resetGame = (game) => {
     signature: game.signature,
     players: game.players,
     stolen: {},
-    longestRoad: undefined,
+    longestRoad: '',
     longestRoadLength: 0,
-    largestArmy: undefined,
+    largestArmy: '',
     largestArmySize: 0,
     winner: undefined,
-    longestRoad: undefined
   });
 
   /* Populate the game corner and road placement data as cleared */  
@@ -3906,7 +3913,7 @@ router.get("/", (req, res/*, next*/) => {
     playerId = req.cookies.player;
   }
 
-  console.log(`[${req.cookies.player.substring(0, 8)}]: Browser hand-shake has started.`);
+  console.log(`[${req.cookies.player.substring(0, 8)}]: Browser hand-shake achieved.`);
 
   return res.status(200).send({ player: req.cookies.player });
 });