v1.0.0-rc.99 (#4)

This is an UNSTABLE release.

jfjoch_broker: Fix output during mask data collection

Reviewed-on: #4
Co-authored-by: Filip Leonarski <filip.leonarski@psi.ch>
Co-committed-by: Filip Leonarski <filip.leonarski@psi.ch>

frontend/src/components/DarkMaskSettings.tsx

@@ -0,0 +1,232 @@
+import React, { Component } from 'react';
+import Paper from '@mui/material/Paper';
+import {Checkbox, FormControlLabel, Stack} from '@mui/material';
+import _ from 'lodash';
+import NumberTextField from './NumberTextField';
+import ButtonWithSnackbar from './ButtonWithSnackbar';
+import { dark_mask_settings } from '../openapi';
+
+type MyProps = {
+    s?: dark_mask_settings;
+};
+
+type MyState = {
+    s: dark_mask_settings;
+    last_downloaded_s: dark_mask_settings;
+    download_counter: number;
+    threshold_err: boolean;
+    frame_time_err: boolean;
+    number_of_frames_err: boolean;
+    number_of_frames_old: number;
+    max_pixel_count_err: boolean;
+    max_frames_with_signal_err: boolean;
+};
+
+const default_dark_mask_settings: dark_mask_settings = {
+    detector_threshold_keV: 4.0,
+    frame_time_us: 1000,
+    number_of_frames: 1000,
+    max_allowed_pixel_count: 1,
+    max_frames_with_signal: 10,
+};
+
+class DarkMaskSettings extends Component<MyProps, MyState> {
+    state: MyState = {
+        s: default_dark_mask_settings,
+        last_downloaded_s: default_dark_mask_settings,
+        download_counter: 0,
+        threshold_err: false,
+        frame_time_err: false,
+        number_of_frames_err: false,
+        max_pixel_count_err: false,
+        max_frames_with_signal_err: false,
+        number_of_frames_old: 1000
+    };
+
+    getValues = () => {
+        if (this.props.s !== undefined) {
+            let incoming: dark_mask_settings = this.props.s;
+            if (!_.isEqual(incoming, this.state.last_downloaded_s)) {
+                this.setState((prev) => ({
+                    s: incoming,
+                    last_downloaded_s: incoming,
+                    download_counter: prev.download_counter + 1,
+                    threshold_err: false,
+                    frame_time_err: false,
+                    number_of_frames_err: false,
+                    number_of_frames_old:
+                        incoming.number_of_frames === 0 ? prev.number_of_frames_old : incoming.number_of_frames,
+                    max_pixel_count_err: false,
+                    max_frames_with_signal_err: false,
+                    enable: (this.props.s?.number_of_frames !== 0)
+                }));
+            }
+        }
+    };
+
+    componentDidMount() {
+        this.getValues();
+    }
+
+    componentDidUpdate() {
+        this.getValues();
+    }
+
+    hasError = () =>
+        this.state.threshold_err ||
+        this.state.frame_time_err ||
+        this.state.number_of_frames_err ||
+        this.state.max_pixel_count_err ||
+        this.state.max_frames_with_signal_err;
+
+    render() {
+        return (
+            <Paper style={{ textAlign: 'center' }} sx={{ width: '100%' }}>
+                <br />
+                <Stack
+                    spacing={3}
+                    sx={{
+                        justifyContent: 'center',
+                        alignItems: 'center',
+                    }}
+                >
+                    <strong>Dark data collection settings for mask</strong>
+                    <div>(DECTRIS detectors only)</div>
+
+                    <FormControlLabel
+                        control={
+                            <Checkbox
+                                checked={this.state.s.number_of_frames !== 0}
+                                onChange={(event) => {
+                                    if (!event.target.checked)
+                                        this.setState(prevState => ({
+                                            download_counter: this.state.download_counter + 1,
+                                            number_of_frames_err: false,
+                                            s: {
+                                                ...prevState.s,
+                                                number_of_frames: 0
+                                            }
+                                        }));
+                                    else
+                                        this.setState(prevState => ({
+                                            download_counter: this.state.download_counter + 1,
+                                            number_of_frames_err: false,
+                                            s: {
+                                                ...prevState.s,
+                                                number_of_frames: this.state.number_of_frames_old
+                                            }
+                                        }));
+                                }}
+                            />
+                        }
+                        label="Enable dark data collection"
+                    />
+
+                    <Stack spacing={3} direction="row" sx={{ width: '80%' }}>
+
+                        <NumberTextField
+                            start_val={this.state.s.detector_threshold_keV}
+                            label={'Detector threshold'}
+                            units={'keV'}
+                            float={true}
+                            min={0.001}
+                            default={4.0}
+                            counter={this.state.download_counter}
+                            disabled={this.state.s.number_of_frames === 0}
+                            callback={(val: number, err: boolean) => {
+                                this.setState((prev) => ({
+                                    threshold_err: err,
+                                    s: { ...prev.s, detector_threshold_keV: val },
+                                }));
+                            }}
+                        />
+
+                        <NumberTextField
+                            start_val={this.state.s.frame_time_us / 1000.0}
+                            label={'Frame time'}
+                            units={'ms'}
+                            float={false}
+                            min={1}
+                            max={1000}
+                            default={10}
+                            counter={this.state.download_counter}
+                            disabled={this.state.s.number_of_frames === 0}
+                            callback={(val: number, err: boolean) => {
+                                this.setState((prev) => ({
+                                    frame_time_err: err,
+                                    s: { ...prev.s, frame_time_us: val * 1000 },
+                                }));
+                            }}
+                        />
+                        <NumberTextField
+                            start_val={this.state.s.number_of_frames}
+                            label={'Number of frames'}
+                            float={false}
+                            min={1}
+                            default={1000}
+                            counter={this.state.download_counter}
+                            disabled={this.state.s.number_of_frames === 0}
+                            callback={(val: number, err: boolean) => {
+                                let old: number = this.state.number_of_frames_old;
+                                if (!err)
+                                    old = val;
+                                this.setState(prevState => ({
+                                    number_of_frames_err: err,
+                                    number_of_frames_old: old,
+                                    s: {...prevState.s, number_of_frames: val}
+                                }));
+                            }}
+
+                        />
+                    </Stack>
+                    <Stack spacing={3} direction="row" sx={{ width: '80%' }}>
+                        <NumberTextField
+                            start_val={this.state.s.max_allowed_pixel_count}
+                            label={'Max allowed pixel count for valid pixel'}
+                            float={false}
+                            min={0}
+                            default={1}
+                            fullWidth={true}
+                            disabled={this.state.s.number_of_frames === 0}
+                            counter={this.state.download_counter}
+                            callback={(val: number, err: boolean) => {
+                                this.setState((prev) => ({
+                                    max_pixel_count_err: err,
+                                    s: { ...prev.s, max_allowed_pixel_count: val },
+                                }));
+                            }}
+                        />
+
+                        <NumberTextField
+                            start_val={this.state.s.max_frames_with_signal}
+                            label={'Max frames with invalid pixel'}
+                            float={false}
+                            min={0}
+                            default={0}
+                            fullWidth={true}
+                            counter={this.state.download_counter}
+                            disabled={this.state.s.number_of_frames === 0}
+                            callback={(val: number, err: boolean) => {
+                                this.setState((prev) => ({
+                                    max_frames_with_signal_err: err,
+                                    s: { ...prev.s, max_frames_with_signal: val },
+                                }));
+                            }}
+                        />
+                    </Stack>
+                    <ButtonWithSnackbar
+                        path={'/config/dark_mask'}
+                        color={'primary'}
+                        method={'PUT'}
+                        disabled={this.hasError()}
+                        text={'Upload'}
+                        input={JSON.stringify(this.state.s)}
+                    />
+                </Stack>
+                <br />
+            </Paper>
+        );
+    }
+}
+
+export default DarkMaskSettings;