added losing move

backend/routes/room.js

@@ -57,7 +57,7 @@ router.post('/add', function (req, res) {
             if (players.length === 4) {
                 updateObj.full = true; // Room is full 
                 updateObj.started = true; // Game started
-                updateObj.nextMoveTime = Date.now()+15;
+                updateObj.nextMoveTime = Date.now()+30000;
                 updateObj.players[0].nowMoving = true; //First joined player moving
                 updateObj.pawns = getStartPositions();
             }
@@ -85,7 +85,37 @@ router.get('/', function(req,res){
                 console.log(err) 
             } 
             else{ 
-                res.send(docs); 
+                if(docs){
+                    if(docs.nextMoveTime <= Date.now()){ 
+                        RoomModel.findOne({_id: req.session.roomId}, function (err, doc){    
+                            if (err) {
+                                res.status(500).send(err)
+                            } else {
+                                const index = doc.players.findIndex( player => player.nowMoving === true);
+                                const roomSize = doc.players.length;
+                                doc.players[index].nowMoving = false;
+                                if(index + 1 === roomSize){
+                                    doc.players[0].nowMoving = true;
+                                }else{
+                                    doc.players[index + 1].nowMoving = true;
+                                }
+                                doc.nextMoveTime = Date.now()+30000;
+                                RoomModel.findOneAndUpdate({_id: req.session.roomId}, doc, function(err, docs){
+                                    if(err){
+                                        res.status(500).send(err)
+                                    }else{
+                                        console.log(docs.nextMoveTime);
+                                        res.send(docs); 
+                                    }
+                                });
+
+                            }
+                        });  
+                    }else{
+                        res.send(docs); 
+                    }
+                    
+                }
             } 
         }
     )

src/components/Gameboard.jsx

@@ -13,7 +13,7 @@ const Gameboard = () => {
     const [pawns, setPawns] = useState([]);
     const [players, setPlayers] = useState([]);
     // Game logic data
-    const [rolledNumber, setRolledNumber] = useState('');
+    const [rolledNumber, setRolledNumber] = useState(null);
     const [time, setTime] = useState();
     const [nowMoving, setNowMoving] = useState(false);
     const [started, setStarted] = useState(false);
@@ -28,10 +28,14 @@ const Gameboard = () => {
                 response.data.players.push({name: "...",});
             };
             // Checks if client is currently moving player by session ID
-            if(id===response.data.players.find(player => player.nowMoving === true)?._id){
-                setNowMoving(true);
-            }else{
-                setNowMoving(false);
+            const nowMovingPlayer = response.data.players.find(player => player.nowMoving === true)
+            if(nowMovingPlayer){
+                if(nowMovingPlayer._id === id){
+                    setNowMoving(true);
+                }else{
+                    setRolledNumber(null);
+                    setNowMoving(false);
+                }
             }
             setPlayers(response.data.players);
             setPawns(response.data.pawns);

src/components/game-board-components/Dice.jsx

@@ -7,11 +7,10 @@ import four from '../../images/dice/4.png';
 import five from '../../images/dice/5.png';
 import six from '../../images/dice/6.png';
 
-const Dice = ({rolledNumberCallback}) => {
+const Dice = ({ rolledNumberCallback, nowMoving }) => {
     const [rolledNumber, setRolledNumber] = useState()
     const [images] = useState([one, two, three, four, five, six]);
     const handleRoll = () => {
-        
         axios.get('http://localhost:3000/game/roll').then(response => {
             const utterance = new SpeechSynthesisUtterance(response.data.number);
             speechSynthesis.speak(utterance);
@@ -21,9 +20,7 @@ const Dice = ({rolledNumberCallback}) => {
     }
     return(
         <div>
-            {rolledNumber ? <img src={images[rolledNumber - 1]} width="100" height="100"/> : 
-            <button onClick={handleRoll}>Roll</button> }
-            
+            {rolledNumber ? <img src={images[rolledNumber - 1]} width="100" height="100"/> : nowMoving ? <button onClick={handleRoll}>Roll</button> : null  }
         </div>
     )
 }

src/components/navbar-components/NameContainer.jsx

@@ -2,7 +2,7 @@ import React from 'react';
 import './NameContainer.css';
 const NameContainer = ( {player, time} ) => {
     const getRemainingTime = () => {
-        return Math.floor((time - Date.now())/1000);
+        return Math.round((time - Date.now())/1000)+1;
     }
     return (
         <div className="name-container"