Code cleanup

Ran prettier and added comments for the spectator rotate buttons
Comet-Robotics · Oct 31, 2024 · 0d7a46b · 0d7a46b
1 parent 51ce908
commit 0d7a46b
Show file tree

Hide file tree

Showing 5 changed files with 31 additions and 29 deletions.
diff --git a/src/client/chessboard/board-container.tsx b/src/client/chessboard/board-container.tsx
@@ -12,6 +12,7 @@ interface BoardContainerProps extends PropsWithChildren {
 export function BoardContainer(props: BoardContainerProps) {
     const [transform, setTransform] = useState<Transform | undefined>();
 
+    /** compute hight/width on change and set the board transform */
     const handleResize = (entries: ResizeEntry[]) => {
         const { height, width } = entries[0].contentRect;
         const transform = computeChessboardTransform(height, width, 0.85);
@@ -28,7 +29,7 @@ export function BoardContainer(props: BoardContainerProps) {
                         ...transform,
                         transform:
                             props.side === Side.SPECTATOR ?
-                                "rotate(" + (props.rotation%180) + "deg)"
+                                "rotate(" + (props.rotation % 180) + "deg)"
                             :   "",
                     }}
                 >

diff --git a/src/client/chessboard/chessboard-wrapper.tsx b/src/client/chessboard/chessboard-wrapper.tsx
@@ -69,28 +69,26 @@ export function ChessboardWrapper(props: ChessboardWrapperProps): JSX.Element {
         setLastClickedSquare(undefined);
     };
 
-
+    //set the side to their respective colors
     switch (props.side) {
         case Side.WHITE:
-            if(orientation !== "white")
-                setOrientation("white");
+            if (orientation !== "white") setOrientation("white");
             break;
         case Side.BLACK:
-            if(orientation !== "black")
-                setOrientation("black");
+            if (orientation !== "black") setOrientation("black");
             break;
+        //choose spectator side based on which is closer
         default:
-            if ((props.rotation%360) < 180) {
-                if(orientation !== "black"){
+            if (props.rotation % 360 < 180) {
+                if (orientation !== "black") {
                     setOrientation("black");
                 }
             } else {
-                if(orientation !== "white"){
+                if (orientation !== "white") {
                     setOrientation("white");
                 }
             }
     }
-
 
     // Don't render while width isn't set
     let chessboard: JSX.Element | null = null;

diff --git a/src/client/game/game.tsx b/src/client/game/game.tsx
@@ -122,13 +122,17 @@ export function Game(): JSX.Element {
 
     return (
         <>
-            <NavbarMenu sendMessage={sendMessage} side={side} setRotation={setRotation} />
+            <NavbarMenu
+                sendMessage={sendMessage}
+                side={side}
+                setRotation={setRotation}
+            />
             <div id="body-container">
                 <ChessboardWrapper
                     side={side}
                     chess={chess}
                     onMove={handleMove}
-                    rotation={rotation?rotation:0}
+                    rotation={rotation ? rotation : 0}
                 />
                 {gameEndDialog}
                 {gameOfferDialog}

diff --git a/src/client/game/navbar-menu.tsx b/src/client/game/navbar-menu.tsx
@@ -21,26 +21,27 @@ import { Dispatch } from "react";
 interface NavbarMenuProps {
     sendMessage: SendMessage;
     side: Side;
-    setRotation: Dispatch<React.SetStateAction<number>> //set state type
+    setRotation: Dispatch<React.SetStateAction<number>>; //set state type
 }
 
 export function NavbarMenu(props: NavbarMenuProps): JSX.Element {
     // Store react router state for game
     const navigate = useNavigate();
 
-    const rotateButton = props.side===Side.SPECTATOR?
-        <Button 
-            minimal
-            text="Rotate" 
-            intent="primary"
-            onClick={()=>{
-                props.setRotation(
-                    oldRotation=>{
-                        return((oldRotation+90));
-                    }
-                )
-            }} 
-        />:"";
+    /** create navbar rotate button */
+    const rotateButton =
+        props.side === Side.SPECTATOR ?
+            <Button
+                minimal
+                text="Rotate"
+                intent="primary"
+                onClick={() => {
+                    props.setRotation((oldRotation) => {
+                        return oldRotation + 90;
+                    });
+                }}
+            />
+        :   "";
 
     return (
         <Navbar>

diff --git a/src/server/api/client-manager.ts b/src/server/api/client-manager.ts
@@ -41,9 +41,7 @@ export class ClientManager {
         if (this.spectatorIds.size !== 0) {
             for (const item of this.spectatorIds) {
                 if (this.socketManager.getSocket(item))
-                    this.socketManager
-                        .getSocket(item)
-                        .send(message.toJson());
+                    this.socketManager.getSocket(item).send(message.toJson());
             }
             return true;
         }