109 lines
3.3 KiB
TypeScript
109 lines
3.3 KiB
TypeScript
import * as React from "react";
|
|
import {
|
|
BlurableInput,
|
|
Row, Col,
|
|
FBSelect, NULL_CHOICE, DropDownItem
|
|
} from "../../ui/index";
|
|
import { SettingsMenuProps } from "./interfaces";
|
|
import {
|
|
SPECIAL_VALUE_DDI, CALIBRATION_DROPDOWNS, ORIGIN_DROPDOWNS
|
|
} from "./constants";
|
|
import { WD_ENV } from "./remote_env/interfaces";
|
|
import { envGet } from "./remote_env/selectors";
|
|
import { SPECIAL_VALUES } from "./remote_env/constants";
|
|
import { isNumber } from "lodash";
|
|
import { t } from "../../i18next_wrapper";
|
|
|
|
export class WeedDetectorConfig extends React.Component<SettingsMenuProps, {}> {
|
|
NumberBox = ({ conf, label }: {
|
|
conf: keyof WD_ENV;
|
|
label: string;
|
|
}) => {
|
|
return <div>
|
|
<label htmlFor={conf}>
|
|
{label}
|
|
</label>
|
|
<BlurableInput type="number"
|
|
id={conf}
|
|
value={"" + envGet(conf, this.props.values)}
|
|
onCommit={e =>
|
|
this.props.onChange(conf, parseFloat(e.currentTarget.value))}
|
|
placeholder={label} />
|
|
</div>;
|
|
};
|
|
|
|
setDDI = (k: keyof WD_ENV) => (d: DropDownItem) => {
|
|
if (isNumber(d.value)) {
|
|
this.props.onChange(k, d.value);
|
|
} else {
|
|
throw new Error("Weed detector got a non-numeric value");
|
|
}
|
|
};
|
|
|
|
find = (needle: keyof WD_ENV): DropDownItem => {
|
|
const wow = envGet(needle, this.props.values);
|
|
const ok = SPECIAL_VALUE_DDI[wow];
|
|
return ok || NULL_CHOICE;
|
|
};
|
|
|
|
render() {
|
|
return <div>
|
|
<label htmlFor="invert_hue_selection">
|
|
{t("Invert Hue Range Selection")}
|
|
</label>
|
|
<div>
|
|
<input
|
|
type="checkbox"
|
|
id="invert_hue_selection"
|
|
checked={!!envGet("CAMERA_CALIBRATION_invert_hue_selection",
|
|
this.props.values)}
|
|
onChange={e =>
|
|
this.props.onChange("CAMERA_CALIBRATION_invert_hue_selection",
|
|
e.currentTarget.checked ?
|
|
SPECIAL_VALUES.TRUE : SPECIAL_VALUES.FALSE)} />
|
|
</div>
|
|
<this.NumberBox
|
|
conf={"CAMERA_CALIBRATION_calibration_object_separation"}
|
|
label={t(`Calibration Object Separation`)} />
|
|
<label>
|
|
{t(`Calibration Object Separation along axis`)}
|
|
</label>
|
|
<FBSelect
|
|
onChange={this.setDDI("CAMERA_CALIBRATION_calibration_along_axis")}
|
|
selectedItem={this.find("CAMERA_CALIBRATION_calibration_along_axis")}
|
|
list={CALIBRATION_DROPDOWNS} />
|
|
<Row>
|
|
<Col xs={6}>
|
|
<this.NumberBox
|
|
conf={"CAMERA_CALIBRATION_camera_offset_x"}
|
|
label={t(`Camera Offset X`)} />
|
|
</Col>
|
|
<Col xs={6}>
|
|
<this.NumberBox
|
|
conf={"CAMERA_CALIBRATION_camera_offset_y"}
|
|
label={t(`Camera Offset Y`)} />
|
|
</Col>
|
|
</Row>
|
|
<label htmlFor="image_bot_origin_location">
|
|
{t(`Origin Location in Image`)}
|
|
</label>
|
|
<FBSelect
|
|
list={ORIGIN_DROPDOWNS}
|
|
onChange={this.setDDI("CAMERA_CALIBRATION_image_bot_origin_location")}
|
|
selectedItem={this.find("CAMERA_CALIBRATION_image_bot_origin_location")} />
|
|
<Row>
|
|
<Col xs={6}>
|
|
<this.NumberBox
|
|
conf={"CAMERA_CALIBRATION_coord_scale"}
|
|
label={t(`Pixel coordinate scale`)} />
|
|
</Col>
|
|
<Col xs={6}>
|
|
<this.NumberBox
|
|
conf={"CAMERA_CALIBRATION_total_rotation_angle"}
|
|
label={t(`Camera rotation`)} />
|
|
</Col>
|
|
</Row>
|
|
</div>;
|
|
}
|
|
}
|