tweaks to camera length textbox

DiamondLightSource · Sep 4, 2023 · 664c9c5 · 664c9c5
1 parent 0d3024b
commit 664c9c5
Show file tree

Hide file tree

Showing 7 changed files with 54 additions and 17 deletions.
diff --git a/README.md b/README.md
@@ -2,7 +2,7 @@
 
 [![dedi-web code CI](https://github.com/tizayi/dedi-web/actions/workflows/code.yml/badge.svg)](https://github.com/tizayi/dedi-web/actions/workflows/code.yml)
 
-A browser tool to calculate the beam centering parameters. Like dedi within dawn science. Built using react and vite.
+A browser tool to calculate the beam centering parameters. Like dedi within dawn science. Built using react, mui, and zustand.
 
 ## Start dev server
 

diff --git a/src/data-entry/beamProperties.tsx b/src/data-entry/beamProperties.tsx
@@ -11,10 +11,28 @@ import { AngleUnits, EnergyUnits, WavelengthUnits } from "../utils/units";
 import { useBeamlineConfigStore } from "./beamlineconfigStore";
 
 export default function BeampropertiesDataEntry() {
-    const minWavelength = useBeamlineConfigStore((state) => state.minWavelength);
-    const maxWavelength = useBeamlineConfigStore((state) => state.maxWavelength);
+    const minWavelength = useBeamlineConfigStore((state) => {
+        if (
+            state.wavelengthUnits === WavelengthUnits.angstroms
+        ) {
+            return state.maxWavelength * 10;
+        }
+        return state.maxWavelength;
+    });
+
+    const maxWavelength = useBeamlineConfigStore((state) => {
+        if (
+            state.wavelengthUnits === WavelengthUnits.angstroms
+        ) {
+            return state.maxWavelength * 10;
+        }
+        return state.maxWavelength;
+    });
 
     const cameraLength = useBeamlineConfigStore((state) => state.cameraLength);
+    const minCameraLength = useBeamlineConfigStore((state) => state.minCameraLength);
+    const maxCameraLength = useBeamlineConfigStore((state) => state.maxCameraLength);
+
 
     const energy = useBeamlineConfigStore((state) => {
         if (state.energy && state.beamEnergyUnits === EnergyUnits.electronVolts) {
@@ -81,6 +99,12 @@ export default function BeampropertiesDataEntry() {
         }
     };
 
+    const updateCameraLength = useBeamlineConfigStore((state) => state.updateCameraLength);
+    const handleCameraLength = (event: React.ChangeEvent<HTMLInputElement>) => {
+        updateCameraLength(parseFloat(event.target.value) ? parseFloat(event.target.value) : null);
+
+    };
+
     return (
         <Stack spacing={2}>
             <Typography variant="h6">Beam properties</Typography>
@@ -138,10 +162,21 @@ export default function BeampropertiesDataEntry() {
                     </Select>
                 </FormControl>
             </Stack>
-            <Typography>Minimum allowed wavelength: {minWavelength} </Typography>
-            <Typography>Maximum allowed wavelength: {maxWavelength}</Typography>
+            <Typography>Minimum allowed wavelength: {minWavelength} {wavelengthUnits} </Typography>
+            <Typography>Maximum allowed wavelength: {maxWavelength} {wavelengthUnits}</Typography>
             <Stack direction="row" spacing={2}>
-                <Typography>Camera Length: {cameraLength}</Typography>
+                <Typography>Camera Length: </Typography>
+                <TextField
+                    type="number"
+                    size="small"
+                    value={cameraLength ?? ""}
+                    InputProps={{
+                        inputProps: {
+                            max: maxCameraLength, min: minCameraLength
+                        }
+                    }}
+                    onChange={handleCameraLength}
+                />
                 <Typography>m</Typography>
             </Stack>
             <Stack direction="row" spacing={2}>

diff --git a/src/data-entry/beamlineconfigStore.ts b/src/data-entry/beamlineconfigStore.ts
@@ -18,6 +18,7 @@ export interface BeamlineConfigStore extends BeamlineConfig {
     updateWavelength: (newWavelength: number | null) => void;
     updatePreset: (newPreset: string) => void;
     updateBeamlineConfig: (newConfig: BeamlineConfig) => void;
+    updateCameraLength: (cameraLength: number | null) => void;
 }
 
 
@@ -28,8 +29,8 @@ export const useBeamlineConfigStore = create<BeamlineConfigStore>((set) => ({
     cameraLength: 1,
     minWavelength: 1,
     maxWavelength: 2,
-    minCameraLength: 1,
-    maxCameraLength: 2,
+    minCameraLength: 10,
+    maxCameraLength: 100,
     energy: null,
     wavelength: null,
     beamEnergyUnits: EnergyUnits.kiloElectronVolts,
@@ -49,6 +50,7 @@ export const useBeamlineConfigStore = create<BeamlineConfigStore>((set) => ({
     },
     updatePreset: (preset: string) => {
         set({ preset: preset })
-    }
+    },
+    updateCameraLength: (length: number | null) => set({ cameraLength: length })
 }));
 
diff --git a/src/data-entry/beamstop.tsx b/src/data-entry/beamstop.tsx
@@ -68,7 +68,7 @@ export default function BeamStopDataEntry(): JSX.Element {
         </FormControl>
       </Stack>
       <Typography>Position:</Typography>
-      <Stack direction={"row"}>
+      <Stack direction={"row"} spacing={2}>
         <Typography flexGrow={2}>x: </Typography>
         <TextField
           type="number"
@@ -84,7 +84,7 @@ export default function BeamStopDataEntry(): JSX.Element {
           Centre detector
         </Button>
       </Stack>
-      <Stack direction={"row"}>
+      <Stack direction={"row"} spacing={2}>
         <Typography flexGrow={2}>y: </Typography>
         <TextField
           type="number"

diff --git a/src/data-entry/dataSideBar.tsx b/src/data-entry/dataSideBar.tsx
@@ -89,7 +89,7 @@ export default function DataSideBar(): JSX.Element {
             }}
           />
           <Typography>
-            Resolution: {resolution.height} x {resolution.width}
+            Resolution (hxw): {resolution.height} x {resolution.width}
           </Typography>
           <Stack direction="row">
             <Typography flexGrow={2}>Pixel size: {pixelSize} </Typography>

diff --git a/src/presets/presetConfigs.json b/src/presets/presetConfigs.json
@@ -20,8 +20,8 @@
     "cameraLength": 1,
     "minWavelength": 1,
     "maxWavelength": 3,
-    "minCameraLength": 2,
-    "maxCameraLength": 4
+    "minCameraLength": 10,
+    "maxCameraLength": 100
   },
   "second": {
     "detector": "Pilatus P3-2M",
@@ -44,7 +44,7 @@
     "cameraLength": 1,
     "minWavelength": 1,
     "maxWavelength": 1,
-    "minCameraLength": 1,
-    "maxCameraLength": 1
+    "minCameraLength": 10,
+    "maxCameraLength": 100
   }
 }
diff --git a/src/utils/types.ts b/src/utils/types.ts
@@ -19,7 +19,7 @@ export interface Beamstop extends CircularDevice {
 
 export interface BeamlineConfig {
   angle: number | null;
-  cameraLength: number;
+  cameraLength: number | null;
   minWavelength: number;
   maxWavelength: number;
   minCameraLength: number;