feat(Ship Map): Adds volume as a property of rooms and adds a flag fo…

…r rooms to accept cargo. Closes #263
Thorium-Sim · Jun 14, 2022 · f8647f1 · f8647f1
1 parent f94f407
commit f8647f1
Show file tree

Hide file tree

Showing 7 changed files with 67 additions and 4 deletions.
diff --git a/client/src/components/ui/Checkbox.tsx b/client/src/components/ui/Checkbox.tsx
@@ -1,10 +1,10 @@
-import React from "react";
+import React, {ReactNode} from "react";
 
 const Checkbox = (
   props: React.DetailedHTMLProps<
     React.InputHTMLAttributes<HTMLInputElement>,
     HTMLInputElement
-  > & {label: string; helperText?: string}
+  > & {label: ReactNode; helperText?: string}
 ) => {
   const {label, ...otherProps} = props;
   return (

diff --git a/client/src/pages/Config/Ships/ShipMap/DeckConfig.tsx b/client/src/pages/Config/Ships/ShipMap/DeckConfig.tsx
@@ -28,6 +28,7 @@ export type updateNodeParams =
   | {isRoom: boolean}
   | {name: string}
   | {radius: number}
+  | {volume: number}
   | {flags: NodeFlag[]};
 const pixelRatio = window.devicePixelRatio;
 

diff --git a/client/src/pages/Config/Ships/ShipMap/NodeCircle.tsx b/client/src/pages/Config/Ships/ShipMap/NodeCircle.tsx
@@ -1,7 +1,7 @@
 import {MutableRefObject, useEffect, useState} from "react";
 import Button from "@thorium/ui/Button";
 import {useConfirm} from "@thorium/ui/AlertDialog";
-import {DeckNode} from "server/src/classes/Plugins/Ship/Deck";
+import {DeckNode, nodeFlags} from "server/src/classes/Plugins/Ship/Deck";
 import {useDrag} from "@use-gesture/react";
 import {autoUpdate, offset, shift, useFloating} from "@floating-ui/react-dom";
 import Input from "@thorium/ui/Input";
@@ -10,13 +10,17 @@ import {Portal} from "@headlessui/react";
 import useOnClickOutside from "client/src/hooks/useClickOutside";
 import {PanStateI, updateNodeParams} from "./DeckConfig";
 import {useTriggerEdgeRender} from "./EdgeContextProvider";
+import {capitalCase} from "change-case";
+import InfoTip from "@thorium/ui/InfoTip";
 const pixelRatio = window.devicePixelRatio;
 export function NodeCircle({
   id,
   x,
   y,
   isRoom,
   radius,
+  volume,
+  flags,
   name,
   icon,
   selected,
@@ -133,6 +137,25 @@ export function NodeCircle({
               defaultChecked={isRoom}
               onChange={e => updateNode({isRoom: e.target.checked})}
             />
+            {nodeFlags.map(flag => (
+              <Checkbox
+                key={flag}
+                label={
+                  <>
+                    {capitalCase(flag)}
+                    <FlagExplainer flag={flag} />
+                  </>
+                }
+                defaultChecked={flags.includes(flag)}
+                onChange={e => {
+                  if (e.target.checked) {
+                    updateNode({flags: [...flags, flag]});
+                  } else {
+                    updateNode({flags: flags.filter(f => f !== flag)});
+                  }
+                }}
+              />
+            ))}
             <Input
               label="Radius"
               type="range"
@@ -149,6 +172,14 @@ export function NodeCircle({
                 })
               }
             />
+            {isRoom && flags.includes("cargo") && (
+              <Input
+                label="Volume for cargo in cubic meters"
+                pattern="[0-9]*"
+                defaultValue={volume}
+                onChange={e => updateNode({volume: Number(e.target.value)})}
+              />
+            )}
             <Button
               className="btn-error btn-sm w-full"
               onClick={async () => {
@@ -170,3 +201,10 @@ export function NodeCircle({
     </>
   );
 }
+
+function FlagExplainer({flag}: {flag: string}) {
+  if (flag === "cargo") {
+    return <InfoTip>Whether the room accepts cargo.</InfoTip>;
+  }
+  return null;
+}
diff --git a/server/src/classes/Plugins/Ship/Deck.ts b/server/src/classes/Plugins/Ship/Deck.ts
@@ -1,4 +1,4 @@
-import {Flavor} from "server/src/utils/unitTypes";
+import {CubicMeter, Flavor} from "server/src/utils/unitTypes";
 
 export default class DeckPlugin {
   name: string;
@@ -24,6 +24,7 @@ export class DeckNode {
   isRoom: boolean;
   icon: string;
   radius: number;
+  volume: CubicMeter;
   flags: NodeFlag[];
   constructor(params: Partial<DeckNode>) {
     this.id = params.id || 0;
@@ -33,6 +34,7 @@ export class DeckNode {
     this.isRoom = params.isRoom || false;
     this.icon = params.icon || "";
     this.radius = params.radius || 0;
+    this.volume = params.volume || 12;
     this.flags = params.flags || [];
   }
 }

diff --git a/server/src/inputs/__test__/shipDecksPlugin.test.ts b/server/src/inputs/__test__/shipDecksPlugin.test.ts
@@ -237,6 +237,16 @@ describe("ship decks plugin input", () => {
         radius: 10,
       });
       expect(deck.nodes[0].radius).toEqual(10);
+
+      expect(deck.nodes[0].volume).toEqual(12);
+      decksPluginInputs.pluginShipDeckUpdateNode(mockDataContext, {
+        pluginId: "Test Plugin",
+        shipId: "Test Template",
+        deckId: "Deck 1",
+        nodeId: 1,
+        volume: 20,
+      });
+      expect(deck.nodes[0].volume).toEqual(20);
     });
   });
   describe("Deck Edges", () => {

diff --git a/server/src/inputs/plugins/ships/decks.ts b/server/src/inputs/plugins/ships/decks.ts
@@ -188,6 +188,7 @@ export const decksPluginInputs = {
       | {isRoom: boolean}
       | {icon: File | string}
       | {radius: number}
+      | {volume: number}
       | {flags: NodeFlag[]}
     )
   ) {
@@ -225,6 +226,12 @@ export const decksPluginInputs = {
     if ("flags" in params) {
       node.flags = params.flags;
     }
+    if ("volume" in params) {
+      if (params.volume < 0) {
+        node.volume = 0;
+      }
+      node.volume = params.volume;
+    }
 
     pubsub.publish("pluginShip", {
       pluginId: params.pluginId,

diff --git a/server/src/utils/unitTypes.ts b/server/src/utils/unitTypes.ts
@@ -41,6 +41,8 @@ export function lightYearToLightMinute(len: LightYear) {
   return len * (60 * 24 * 365.25);
 }
 
+export type CubicMeter = Flavor<number, "cubicMeter">;
+
 export type Kilograms = Flavor<number, "kilograms">;
 /**
  * Mass compared to the sun eg. 1 solar mass = the mass of the sun
@@ -72,3 +74,6 @@ export class Coordinates<T extends number> {
   y: T = 0 as T;
   z: T = 0 as T;
 }
+
+export type PowerUnit = Flavor<number, "powerUnit">;
+export type PowerUnitPerSecond = Flavor<number, "powerUnitPerSecond">;