many ui improvements

openUC2 · Sep 22, 2024 · c4cec9d · c4cec9d
1 parent 8435b3c
commit c4cec9d
Show file tree

Hide file tree

Showing 4 changed files with 162 additions and 23 deletions.
diff --git a/src/components/AutofocusController.js b/src/components/AutofocusController.js
@@ -0,0 +1,89 @@
+import React, { useState } from "react";
+import { Paper, Grid, TextField, Button } from "@mui/material";
+
+const AutofocusController = ({ hostIP, hostPort }) => {
+  const [rangeZ, setRangeZ] = useState(10); // Default range for z
+  const [resolutionZ, setResolutionZ] = useState(1); // Default resolution for z
+  const [defocusZ, setDefocusZ] = useState(0); // Default defocus for z
+  const [isRunning, setIsRunning] = useState(false); // Autofocus state
+
+  const handleStart = () => {
+    const url = `${hostIP}:${hostPort}/AufofocusController/autoFocus?` +
+      `rangez=${rangeZ}&resolutionz=${resolutionZ}&defocusz=${defocusZ}`;
+        console.log("Autofocus started:", url);
+    fetch(url, { method: "GET" })
+      .then((response) => response.json())
+      .then((data) => {
+        console.log("Autofocus started:", data);
+        setIsRunning(true);
+      })
+      .catch((error) => {
+        console.error("Error starting autofocus:", error);
+      });
+  };
+
+  const handleStop = () => {
+    const url = `http://${hostIP}:${hostPort}/AufofocusController/stopAutoFocus`;
+
+    fetch(url, { method: "GET" })
+      .then((response) => response.json())
+      .then((data) => {
+        console.log("Autofocus stopped:", data);
+        setIsRunning(false);
+      })
+      .catch((error) => {
+        console.error("Error stopping autofocus:", error);
+      });
+  };
+
+  return (
+    <Paper style={{ padding: "20px" }}>
+      <Grid container spacing={2}>
+        <Grid item xs={4}>
+          <TextField
+            label="Range Z"
+            value={rangeZ}
+            onChange={(e) => setRangeZ(e.target.value)}
+            fullWidth
+          />
+        </Grid>
+        <Grid item xs={4}>
+          <TextField
+            label="Resolution Z"
+            value={resolutionZ}
+            onChange={(e) => setResolutionZ(e.target.value)}
+            fullWidth
+          />
+        </Grid>
+        <Grid item xs={4}>
+          <TextField
+            label="Defocus Z"
+            value={defocusZ}
+            onChange={(e) => setDefocusZ(e.target.value)}
+            fullWidth
+          />
+        </Grid>
+
+        <Grid item xs={12}>
+          <Button
+            variant="contained"
+            color="primary"
+            onClick={handleStart}
+          >
+            Start Autofocus
+          </Button>
+          <Button
+            variant="contained"
+            color="secondary"
+            onClick={handleStop}
+            style={{ marginLeft: "10px" }}
+          >
+            Stop Autofocus
+          </Button>
+        </Grid>
+      </Grid>
+    </Paper>
+  );
+};
+
+export default AutofocusController;
diff --git a/src/components/AxisControl.js b/src/components/AxisControl.js
@@ -1,5 +1,5 @@
 import { Button, Grid, Dialog, DialogTitle, List, ListItem, ListItemText, TextField } from '@mui/material';
-import React, { useState } from "react";
+import React, { useState, useEffect } from "react";
 
 const AxisControl = ({ axisLabel, onButtonPress, hostIP, hostPort }) => {
   const [sliderValue, setSliderValue] = useState(0);
@@ -11,15 +11,53 @@ const AxisControl = ({ axisLabel, onButtonPress, hostIP, hostPort }) => {
 
   const dialValues = [1, 5, 10, 50, 100, 500, 1000, 10000, 20000, 100000];
 
-  const handleIncrement = () => {
+  // Fetch positions from the server
+  const fetchPositions = async () => {
+    try {
+      const response = await fetch(`${hostIP}:${hostPort}/PositionerController/getPositionerPositions`);
+      const data = await response.json();
+
+      // Update position for the specific axis
+      setPosition(data.VirtualStage[axisLabel]);
+    } catch (error) {
+      console.error("Error fetching positioner positions:", error);
+    }
+  };
+
+  // Fetch the position on load
+  useEffect(() => {
+    fetchPositions();
+  }, []);
+
+  const handleIncrement = async () => {
     const url = `${hostIP}:${hostPort}/PositionerController/movePositioner?axis=${axisLabel}&dist=${Math.abs(steps)}&isAbsolute=false&isBlocking=false&speed=${speedValue}`;
-    onButtonPress(url);
+    await onButtonPress(url);
+    fetchPositions(); // Update position after button press
   };
 
-  const handleDecrement = () => {
+  const handleDecrement = async () => {
     const negativeSteps = -Math.abs(steps);
     const url = `${hostIP}:${hostPort}/PositionerController/movePositioner?axis=${axisLabel}&dist=${negativeSteps}&isAbsolute=false&isBlocking=false&speed=${speedValue}`;
-    onButtonPress(url);
+    await onButtonPress(url);
+    fetchPositions(); // Update position after button press
+  };
+
+  const handleGoTo = async () => {
+    const url = `${hostIP}:${hostPort}/PositionerController/movePositioner?axis=${axisLabel}&dist=${mPosition}&isAbsolute=true&isBlocking=false&speed=${speedValue}`;
+    await onButtonPress(url);
+    fetchPositions(); // Update position after button press
+  };
+
+  const handleStop = async () => {
+    const url = `${hostIP}:${hostPort}/PositionerController/stopAxis?axis=${axisLabel}`;
+    await onButtonPress(url);
+    fetchPositions(); // Update position after button press
+  };
+
+  const handleForever = async () => {
+    const url = `${hostIP}:${hostPort}/PositionerController/movePositionerForever?axis=${axisLabel}&speed=${speedValue}&is_stop=false`;
+    await onButtonPress(url);
+    fetchPositions(); // Update position after button press
   };
 
   const handleDialSelect = (value, type) => {
@@ -32,28 +70,12 @@ const AxisControl = ({ axisLabel, onButtonPress, hostIP, hostPort }) => {
     }
   };
 
-  const handleGoTo = () => {
-    const url = `${hostIP}:${hostPort}/PositionerController/movePositioner?axis=${axisLabel}&dist=${mPosition}&isAbsolute=true&isBlocking=false&speed=${speedValue}`;
-    onButtonPress(url);
-  };
-
-  const handleStop = () => {
-    ///PositionerController/stopAxis?positionerName=x&axis=X 
-    const url = `${hostIP}:${hostPort}/PositionerController/stopAxis?axis=${axisLabel}`;
-    onButtonPress(url);
-  };
-
-  const handleForever = () => {
-    // https://localhost:8001/PositionerController/movePositionerForever?axis=X&speed=0&is_stop=false
-    const url = `${hostIP}:${hostPort}/PositionerController/movePositionerForever?axis=${axisLabel}&speed=${speedValue}&is_stop=false`;
-    onButtonPress(url);
-  }
-
   return (
     <Grid container spacing={1} direction="column" alignItems="center">
       <Grid item xs={12}>
         <h2>{axisLabel} Axis</h2>
       </Grid>
+
       <Grid container item spacing={1} alignItems="center" xs={12}>
         <Grid item>
           <Button onClick={handleIncrement} variant="contained" color="primary">+</Button>

diff --git a/src/components/ReconnectController.js b/src/components/ReconnectController.js
@@ -43,6 +43,18 @@ const ReconnectController = ({ hostIP, hostPort, WindowTitle }) => {
       .catch(error => console.error('Error:', error));
   };
 
+  const btConnect = () => {
+    const url = `${hostIP}:${hostPort}/UC2ConfigController/btpairing`;
+
+    fetch(url, { method: 'GET' })
+      .then(response => response.json())
+      .then(data => {
+        console.log(data);
+        // Handle response data if needed
+      })
+      .catch(error => console.error('Error:', error));
+  };
+
   return (
     <Paper>
       <Tabs value={tabIndex} onChange={handleTabChange} aria-label="settings tabs">
@@ -52,7 +64,8 @@ const ReconnectController = ({ hostIP, hostPort, WindowTitle }) => {
       <TabPanel value={tabIndex} index={0}>
         <Grid container spacing={2}>
           <Grid item xs={12}>
-            <div>
+            <Typography variant="h6">Reconnect to UC2 board</Typography>
+          <div>
               <Button
                 style={{ marginBottom: '20px' }}
                 variant="contained"
@@ -61,9 +74,20 @@ const ReconnectController = ({ hostIP, hostPort, WindowTitle }) => {
                 Reconnect
               </Button>
             </div>
+            <Typography variant="h6">Bluetooth Pairing</Typography>
+            <div>
+              <Button
+                style={{ marginBottom: '20px' }}
+                variant="contained"
+                onClick={btConnect}
+              >
+                BT Pairing
+              </Button>
+            </div>
           </Grid>
         </Grid>
       </TabPanel>
+
     </Paper>
   );
 };

diff --git a/src/components/Tab_Widgets.js b/src/components/Tab_Widgets.js
@@ -8,6 +8,7 @@ import HistoScanController from './HistoScanController';
 import MCTController from './MCTController';
 import { MCTProvider } from '../context/MCTContext'; // Import the context provider
 import ReconnectController from './ReconnectController';
+import AutofocusController from './AutofocusController';
 import LiveViewController from './LiveViewController';
 import './Tab_Widgets.css'; // Import the CSS file
 
@@ -23,6 +24,9 @@ const Tab_Widgets = ({ hostIP, hostPort }) => {
       <Grid item xs={12} sm={6} md={4} className="grid-item">
         <ReconnectController hostIP={hostIP} hostPort={hostPort} title="Reconnect" />
       </Grid>
+      <Grid item xs={12} sm={6} md={4} className="grid-item">
+        <AutofocusController hostIP={hostIP} hostPort={hostPort} title="Autofocus" />
+      </Grid>
       <Grid item xs={12} sm={6} md={4} className="grid-item">
         <MCTProvider>
           <MCTController hostIP={hostIP} hostPort={hostPort} title="MCT" />