Merge pull request #66 from tiqi-group/12-add-scan-pattern-selection-dropdown-to-replace-scatter-checkbox

12 add scan pattern selection dropdown to replace scatter checkbox

Author: antti-ethz

frontend/src/components/scanInterface/ParameterCard.tsx

@@ -13,19 +13,54 @@ import { useContext, useMemo, useState } from "react";
 import { DeviceInfoContext } from "../../contexts/DeviceInfoContext";
 import { ParameterDisplayGroupsContext } from "../../contexts/ParameterDisplayGroupsContext";
 import { useScanContext } from "../../hooks/useScanContext";
-import { ScanParameterInfo } from "../../types/ScanParameterInfo";
+import {
+  ScanParameterInfo,
+  ScanPattern,
+  scanPatterns,
+} from "../../types/ScanParameterInfo";
 
 const generateScanValues = (
   start: number,
   stop: number,
   points: number,
-  scatter: boolean,
+  pattern: ScanPattern,
 ) => {
-  const values = Array.from(
-    { length: points },
-    (_, i) => start + (i * (stop - start)) / (points - 1),
-  );
-  return scatter ? values.sort(() => Math.random() - 0.5) : values;
+  const linspace = (n: number) =>
+    Array.from({ length: n }, (_, i) => start + (i * (stop - start)) / (n - 1));
+
+  switch (pattern) {
+    case "linear":
+      return linspace(points);
+    case "scatter":
+      return linspace(points).sort(() => Math.random() - 0.5);
+    case "centred": {
+      const base = linspace(points);
+      const mid = Math.floor((points - 1) / 2);
+      const order = [mid];
+      for (let k = 1; order.length < points; k++) {
+        if (mid - k >= 0) order.push(mid - k);
+        if (mid + k < points) order.push(mid + k);
+      }
+      return order.map((i) => base[i]);
+    }
+    case "forwardReverse": {
+      const base = linspace(points);
+      return [...base, ...base.reverse()];
+    }
+  }
+};
+
+const renderPatternLabel = (pattern: ScanPattern): string => {
+  switch (pattern) {
+    case "linear":
+      return "Linear";
+    case "scatter":
+      return "Scatter";
+    case "centred":
+      return "Centred";
+    case "forwardReverse":
+      return "Forward and reverse";
+  }
 };
 
 export const ParameterCard = ({
@@ -96,6 +131,8 @@ export const ParameterCard = ({
     );
   }, [param, parameterDisplayGroups, deviceInfo]);
 
+  const pattern = param.generation.pattern ?? "linear";
+
   return (
     <div style={{ display: "flex", flexDirection: "column", gap: 8 }}>
       <div
@@ -196,9 +233,7 @@ export const ParameterCard = ({
                 dispatchScanInfoStateUpdate({
                   type: "UPDATE_PARAMETER",
                   index,
-                  payload: {
-                    id: e.target.value,
-                  },
+                  payload: { id: e.target.value },
                 });
               }}
               renderValue={(value) => {
@@ -238,7 +273,7 @@ export const ParameterCard = ({
                       Number(e.target.value),
                       param.generation.stop,
                       param.generation.points,
-                      param.generation.scatter,
+                      pattern,
                     ),
                   },
                 })
@@ -273,7 +308,7 @@ export const ParameterCard = ({
                       param.generation.start,
                       Number(e.target.value),
                       param.generation.points,
-                      param.generation.scatter,
+                      pattern,
                     ),
                   },
                 })
@@ -309,7 +344,7 @@ export const ParameterCard = ({
                       param.generation.start,
                       param.generation.stop,
                       Number(e.target.value),
-                      param.generation.scatter,
+                      pattern,
                     ),
                   },
                 })
@@ -324,26 +359,32 @@ export const ParameterCard = ({
               }}
             />
           </div>
-          <FormControlLabel
-            control={
-              <Checkbox
-                checked={param.generation.scatter ?? false}
-                onChange={(e) => {
-                  dispatchScanInfoStateUpdate({
-                    type: "UPDATE_PARAMETER",
-                    index: index!,
-                    payload: {
-                      generation: {
-                        ...param.generation,
-                        scatter: e.target.checked,
-                      },
+          <FormControl fullWidth size="small">
+            <InputLabel>Scan pattern</InputLabel>
+            <Select
+              label="Scan pattern"
+              value={pattern}
+              onChange={(e) => {
+                dispatchScanInfoStateUpdate({
+                  type: "UPDATE_PARAMETER",
+                  index: index!,
+                  payload: {
+                    generation: {
+                      ...param.generation,
+                      pattern: e.target.value as ScanPattern,
                     },
-                  });
-                }}
-              />
-            }
-            label="Scatter"
-          />
+                  },
+                });
+              }}
+              renderValue={(selected) => renderPatternLabel(selected as ScanPattern)}
+            >
+              {scanPatterns.map((pattern) => (
+                <MenuItem key={pattern} value={pattern}>
+                  {renderPatternLabel(pattern)}
+                </MenuItem>
+              ))}
+            </Select>
+          </FormControl>
         </>
       ) : (
         <>

frontend/src/hooks/useScanInfoState.tsx

@@ -18,7 +18,7 @@ export type ScanInfoAction =
 const defaultParameter: ScanParameterInfo = {
   id: "",
   values: [0, 1],
-  generation: { start: 0, stop: 1, points: 2, scatter: false },
+  generation: { start: 0, stop: 1, points: 2, pattern: "linear" },
   namespace: "",
   deviceNameOrDisplayGroup: "",
 };

frontend/src/types/ScanParameterInfo.ts

@@ -1,3 +1,6 @@
+export const scanPatterns = ["linear", "scatter", "centred", "forwardReverse"] as const;
+export type ScanPattern = (typeof scanPatterns)[number];
+
 export interface ScanParameterInfo {
   id: string;
   deviceNameOrDisplayGroup: string;
@@ -7,7 +10,7 @@ export interface ScanParameterInfo {
     start: number;
     stop: number;
     points: number;
-    scatter: boolean;
+    pattern: ScanPattern;
   };
   n_scan_points?: number;
 }

frontend/src/utils/windowUtils.ts

@@ -1,7 +1,7 @@
-import { authority, forwardedProto } from "../socket";
+import { forwardedPrefix } from "../socket";
 
 export function openJobWindow(jobId: string | number, experimentId: string) {
-  const baseUrl = `${forwardedProto}://${authority}`;
+  const baseUrl = `${window.location.origin}${forwardedPrefix}`;
   const url = `${baseUrl}/data/${jobId}`;
   const storageKey = `jobWindow:${experimentId}`;
 

frontend/tsconfig.json

@@ -14,7 +14,8 @@
     "resolveJsonModule": true,
     "isolatedModules": true,
     "noEmit": true,
-    "jsx": "react-jsx"
+    "jsx": "react-jsx",
+    "noImplicitReturns": true
   },
   "include": ["src"]
 }

src/icon/server/data_access/repositories/experiment_data_repository.py

@@ -124,7 +124,6 @@ class ExperimentData:
     parameters: dict[str, ParameterValue]
     """Mapping of parameter id to time series (tuple of timestamp str and value)."""
 
-
 def get_filename_by_job_id(job_id: int) -> str:
     """Return the HDF5 filename for a job.