Merge pull request #7 from bananu7/second-playtest-fixes

Second playtest fixes - 2nd PR with fixes
bananu7 · Oct 7, 2022 · 477326d · 477326d
2 parents 9b275b7 + 9381e15
commit 477326d
Show file tree

Hide file tree

Showing 5 changed files with 27 additions and 11 deletions.
diff --git a/packages/client/src/App.css b/packages/client/src/App.css
@@ -53,15 +53,15 @@
   position: absolute;
   right: 0;
   bottom: 0;
-  width: 350px;
-  height: 200px;
+  width: 320px;
+  height: 280px;
 
   display: grid;
-  grid-template-columns: 25% 25% 25% 25%;
-  grid-column-gap: 5px;
+  grid-template-columns: 75px 75px 75px;
+  grid-template-rows: 75px 75px 75px;
 
   padding: 10px;
-  gap: 5px;
+  gap: 10px;
   background-color: #555;
   color: white;
 

diff --git a/packages/client/src/App.tsx b/packages/client/src/App.tsx
@@ -266,10 +266,10 @@ function App() {
         lastUpdatePacket.state.id === "GameEnded" &&
         <div className="card">
           <h2>Game Over</h2>
-          <button onClick={() => {
+          <button onClick={async () => {
+            await multiplayer.leaveMatch();
             setLastUpdatePacket(null);
             setServerState(null);
-            multiplayer.leaveMatch();
           }}>Return to main menu</button>
         </div>
       }

diff --git a/packages/client/src/components/CommandPalette.tsx b/packages/client/src/components/CommandPalette.tsx
@@ -72,6 +72,7 @@ export function CommandPalette(props: Props) {
     // TODO browse all units?
     const canMove = Boolean(units[0].components.find(c => c.type === 'Mover'));
     const canAttack = Boolean(units[0].components.find(c => c.type === 'Attacker'));
+    const canHarvest = Boolean(units[0].components.find(c => c.type === 'Harvester'));
 
     const stop = () => {
         props.multiplayer.stopCommand(Array.from(props.selectedUnits));
@@ -108,7 +109,7 @@ export function CommandPalette(props: Props) {
             <Button
                 key={`produce_${up.unitType}`}
                 active={false}
-                y={2}
+                y={3}
                 onClick={click}
             >
             Produce {up.unitType}
@@ -162,7 +163,7 @@ export function CommandPalette(props: Props) {
             <Button
                 key={`build_${b}`}
                 active={active}
-                y={2}
+                y={3}
                 onClick={click}
             >
             Build {b}
@@ -214,6 +215,20 @@ export function CommandPalette(props: Props) {
                 </Button>
             }
 
+            {
+                canHarvest &&
+                <Button
+                    key="Harvest"
+                    x={1} y={2}
+                    active={props.selectedAction && props.selectedAction.action === 'Harvest' || false}
+                    onClick={() => props.setSelectedAction({ action: 'Harvest'})}
+                >
+                    <span style={{fontSize: "2.3em"}}>⛏️</span>
+                    <span className="tooltip">Harvest a resource node</span>
+                </Button>
+            }
+
+
             <Button
                 key="stop"
                 x={2} y={1}

diff --git a/packages/client/src/gfx/Map3D.tsx b/packages/client/src/gfx/Map3D.tsx
@@ -48,8 +48,6 @@ export function Map3D(props: Map3DProps) {
         }
         setDrag(undefined);
         setPointer(undefined);
-
-        props.click({x: e.point.x, y: e.point.z}, e.nativeEvent.button);
     }, [drag]);
 
     const selectionBoxSize = (drag && pointer) ? {
@@ -97,6 +95,7 @@ export function Map3D(props: Map3DProps) {
             <mesh 
                 name="Click Mesh"
                 onContextMenu={rawClick}
+                onClick={rawClick}
                 onPointerDown={pointerDown}
                 onPointerUp={pointerUp}
                 onPointerMove={pointerMove}

diff --git a/packages/client/src/index.css b/packages/client/src/index.css
@@ -43,6 +43,7 @@ button {
   font-weight: 500;
   font-family: inherit;
   background-color: #1a1a1a;
+  color: white;
   cursor: pointer;
   transition: border-color 0.2s;
 }
@@ -60,6 +61,7 @@ button:hover {
   }
   button {
     background-color: #f9f9f9;
+    color: black;
   }
 }