Skip to content
This repository was archived by the owner on Dec 23, 2021. It is now read-only.

Decimal Precision for certain sensors on CPX and CLUE #346

Merged
xnkevinnguyen merged 5 commits into from
Apr 20, 2020
Merged

Decimal Precision for certain sensors on CPX and CLUE #346

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
609567d
Add precision to input slider
xnkevinnguyen Apr 20, 2020
32ec778
Refactor
xnkevinnguyen Apr 20, 2020
a03d3d8
Merge remote-tracking branch 'origin/dev' into users/t-xunguy/cpx-sen…
xnkevinnguyen Apr 20, 2020
08b35cf
Modify precision value for cpx and clue
xnkevinnguyen Apr 20, 2020
6414513
Merge branch 'dev' into users/t-xunguy/cpx-sensors
xnkevinnguyen Apr 20, 2020
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions src/view/components/toolbar/GenericSliderComponent.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -29,6 +29,7 @@ export const GenericSliderComponent: React.FC<IProps> = props => {
value={
props.axisValues[sliderProperties.axisLabel]
}
step={sliderProperties.step}
/>
<br />
</React.Fragment>
Expand Down
11 changes: 8 additions & 3 deletions src/view/components/toolbar/InputSlider.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -21,6 +21,9 @@ class InputSlider extends React.Component<ISliderProps, any, any> {

render() {
const isInputDisabled = this.context === VIEW_STATE.PAUSE;

const nbDecimals =
this.props.step.toString().split(".")[1]?.length || 0;
return (
<div className="input-slider">
<span>{this.props.axisLabel}</span>
Expand All @@ -31,8 +34,9 @@ class InputSlider extends React.Component<ISliderProps, any, any> {
onInput={this.handleOnChange}
defaultValue={this.props.minValue.toLocaleString()}
pattern={`^-?[0-9]{0,${
this.props.maxValue.toString().length
}}$`}
(this.props.maxValue / this.props.step).toString()
Copy link
Collaborator

@sagarmanchanda sagarmanchanda Apr 20, 2020

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

What is this pattern for?

Copy link
Contributor Author

@xnkevinnguyen xnkevinnguyen Apr 20, 2020

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It's to control the input of the user for sensor value. to limit the number of digit after the period also to limit the max value by limiting length of input.

.length
}}[.]{0,${nbDecimals > 0 ? 1 : 0}}[0-9]{0,${nbDecimals}}$`}
onKeyUp={this.handleOnChange}
aria-label={`${this.props.type} sensor input ${this.props.axisLabel}`}
/>
Expand All @@ -56,6 +60,7 @@ class InputSlider extends React.Component<ISliderProps, any, any> {
aria-label={`${this.props.type} sensor`}
defaultValue={this.props.minValue.toLocaleString()}
disabled={isInputDisabled}
step={this.props.step}
/>
<span className="downLabelArea">
<span className="minLabel">{this.props.minLabel}</span>
Expand Down Expand Up @@ -100,7 +105,7 @@ class InputSlider extends React.Component<ISliderProps, any, any> {
};

private validateRange = (valueString: string) => {
let valueInt = parseInt(valueString, 10);
let valueInt = parseFloat(valueString);
if (valueInt < this.props.minValue) {
valueInt = this.props.minValue;
this.setState({ value: valueInt });
Expand Down
23 changes: 20 additions & 3 deletions src/view/components/toolbar/clue/ClueSensorProperties.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,28 +4,31 @@ import { ISensorProps, ISliderProps } from "../../../viewUtils";
const CLUE_SLIDER_R: ISliderProps = {
axisLabel: "R",
maxLabel: "Max",
maxValue: 255,
maxValue: 65535,
minLabel: "Min",
minValue: 0,
type: SENSOR_LIST.LIGHT_R,
step: 1,
};

const CLUE_SLIDER_G: ISliderProps = {
axisLabel: "G",
maxLabel: "Max",
maxValue: 255,
maxValue: 65535,
minLabel: "Min",
minValue: 0,
type: SENSOR_LIST.LIGHT_G,
step: 1,
};

const CLUE_SLIDER_B: ISliderProps = {
axisLabel: "B",
maxLabel: "Max",
maxValue: 255,
maxValue: 65535,
minLabel: "Min",
minValue: 0,
type: SENSOR_LIST.LIGHT_B,
step: 1,
};
const CLUE_SLIDER_C: ISliderProps = {
axisLabel: "C",
Expand All @@ -34,6 +37,7 @@ const CLUE_SLIDER_C: ISliderProps = {
minLabel: "Min",
minValue: 0,
type: SENSOR_LIST.LIGHT_C,
step: 1,
};

export const CLUE_LIGHT_PROPERTIES: ISensorProps = {
Expand All @@ -50,6 +54,7 @@ const CLUE_MAGNET_X: ISliderProps = {
maxValue: 1000,
minValue: -1000,
type: SENSOR_LIST.MAGNET_X,
step: 0.1,
};
const CLUE_MAGNET_Y: ISliderProps = {
axisLabel: "Y",
Expand All @@ -58,6 +63,7 @@ const CLUE_MAGNET_Y: ISliderProps = {
maxValue: 1000,
minValue: -1000,
type: SENSOR_LIST.MAGNET_Y,
step: 0.1,
};
const CLUE_MAGNET_Z: ISliderProps = {
axisLabel: "Z",
Expand All @@ -66,6 +72,7 @@ const CLUE_MAGNET_Z: ISliderProps = {
maxValue: 1000,
minValue: -1000,
type: SENSOR_LIST.MAGNET_Z,
step: 0.1,
};

export const CLUE_MAGNET_PROPERTIES: ISensorProps = {
Expand All @@ -80,6 +87,7 @@ const CLUE_GYRO_X: ISliderProps = {
maxValue: 1000,
minValue: -1000,
type: SENSOR_LIST.GYRO_X,
step: 0.1,
};
const CLUE_GYRO_Y: ISliderProps = {
axisLabel: "Y",
Expand All @@ -88,6 +96,7 @@ const CLUE_GYRO_Y: ISliderProps = {
maxValue: 1000,
minValue: -1000,
type: SENSOR_LIST.GYRO_Y,
step: 0.1,
};
const CLUE_GYRO_Z: ISliderProps = {
axisLabel: "Z",
Expand All @@ -96,6 +105,7 @@ const CLUE_GYRO_Z: ISliderProps = {
maxValue: 1000,
minValue: -1000,
type: SENSOR_LIST.GYRO_Z,
step: 0.1,
};

export const CLUE_GYRO_PROPERTIES: ISensorProps = {
Expand All @@ -114,6 +124,7 @@ export const CLUE_HUMIDITY_PROPERTIES: ISensorProps = {
minLabel: "Min",
minValue: 0,
type: SENSOR_LIST.HUMIDITY,
step: 0.1,
},
],
unitLabel: "%",
Expand All @@ -128,6 +139,7 @@ export const CLUE__PROXIMITY_PROPERTIES: ISensorProps = {
minLabel: "Min",
minValue: 0,
type: SENSOR_LIST.PROXIMITY,
step: 1,
},
],
unitLabel: "",
Expand All @@ -142,6 +154,7 @@ export const CLUE_PRESSURE_PROPERTIES: ISensorProps = {
minLabel: "Min",
minValue: 800,
type: SENSOR_LIST.PRESSURE,
step: 0.1,
},
],
unitLabel: "hPa",
Expand All @@ -153,6 +166,7 @@ const MOTION_SLIDER_PROPS_X: ISliderProps = {
minLabel: "Left",
minValue: -1023,
type: SENSOR_LIST.MOTION_X,
step: 0.1,
};

const MOTION_SLIDER_PROPS_Y: ISliderProps = {
Expand All @@ -162,6 +176,7 @@ const MOTION_SLIDER_PROPS_Y: ISliderProps = {
minLabel: "Back",
minValue: -1023,
type: SENSOR_LIST.MOTION_Y,
step: 0.1,
};

const MOTION_SLIDER_PROPS_Z: ISliderProps = {
Expand All @@ -171,6 +186,7 @@ const MOTION_SLIDER_PROPS_Z: ISliderProps = {
minLabel: "Up",
minValue: -1023,
type: SENSOR_LIST.MOTION_Z,
step: 0.1,
};

export const MOTION_SENSOR_PROPERTIES: ISensorProps = {
Expand All @@ -190,6 +206,7 @@ const TEMPERATURE_SLIDER_PROPS: ISliderProps = {
minLabel: "Cold",
minValue: -55,
type: SENSOR_LIST.TEMPERATURE,
step: 0.1,
};

export const TEMPERATURE_SENSOR_PROPERTIES: ISensorProps = {
Expand Down
7 changes: 6 additions & 1 deletion src/view/components/toolbar/cpx/CpxSensorProperties.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,12 +2,13 @@ import { SENSOR_LIST } from "../../../constants";
import { ISensorProps, ISliderProps } from "../../../viewUtils";

const LIGHT_SLIDER_PROPS: ISliderProps = {
maxValue: 255,
maxValue: 320,
minValue: 0,
minLabel: "Dark",
maxLabel: "Bright",
type: "light",
axisLabel: "L",
step: 1,
};

export const LIGHT_SENSOR_PROPERTIES: ISensorProps = {
Expand All @@ -23,6 +24,7 @@ const TEMPERATURE_SLIDER_PROPS: ISliderProps = {
minLabel: "Cold",
minValue: -55,
type: SENSOR_LIST.TEMPERATURE,
step: 0.1,
};
export const TEMPERATURE_SENSOR_PROPERTIES: ISensorProps = {
LABEL: "Temperature sensor",
Expand All @@ -37,6 +39,7 @@ const MOTION_SLIDER_PROPS_X: ISliderProps = {
minLabel: "Left",
minValue: -78,
type: SENSOR_LIST.MOTION_X,
step: 1,
};
const MOTION_SLIDER_PROPS_Y: ISliderProps = {
axisLabel: "Y",
Expand All @@ -45,6 +48,7 @@ const MOTION_SLIDER_PROPS_Y: ISliderProps = {
minLabel: "Back",
minValue: -78,
type: SENSOR_LIST.MOTION_Y,
step: 1,
};
const MOTION_SLIDER_PROPS_Z: ISliderProps = {
axisLabel: "Z",
Expand All @@ -53,6 +57,7 @@ const MOTION_SLIDER_PROPS_Z: ISliderProps = {
minLabel: "Up",
minValue: -78,
type: SENSOR_LIST.MOTION_Z,
step: 1,
};

export const MOTION_SENSOR_PROPERTIES: ISensorProps = {
Expand Down
5 changes: 5 additions & 0 deletions src/view/components/toolbar/microbit/MicrobitSensorProperties.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,7 @@ const LIGHT_SLIDER_PROPS: ISliderProps = {
maxLabel: "Bright",
type: "light",
axisLabel: "L",
step: 1,
};

export const LIGHT_SENSOR_PROPERTIES: ISensorProps = {
Expand All @@ -23,6 +24,7 @@ const MOTION_SLIDER_PROPS_X: ISliderProps = {
minLabel: "Left",
minValue: -1023,
type: SENSOR_LIST.MOTION_X,
step: 1,
};

const MOTION_SLIDER_PROPS_Y: ISliderProps = {
Expand All @@ -32,6 +34,7 @@ const MOTION_SLIDER_PROPS_Y: ISliderProps = {
minLabel: "Back",
minValue: -1023,
type: SENSOR_LIST.MOTION_Y,
step: 1,
};

const MOTION_SLIDER_PROPS_Z: ISliderProps = {
Expand All @@ -41,6 +44,7 @@ const MOTION_SLIDER_PROPS_Z: ISliderProps = {
minLabel: "Up",
minValue: -1023,
type: SENSOR_LIST.MOTION_Z,
step: 1,
};

export const MOTION_SENSOR_PROPERTIES: ISensorProps = {
Expand All @@ -60,6 +64,7 @@ const TEMPERATURE_SLIDER_PROPS: ISliderProps = {
minLabel: "Cold",
minValue: -55,
type: SENSOR_LIST.TEMPERATURE,
step: 1,
};

export const TEMPERATURE_SENSOR_PROPERTIES: ISensorProps = {
Expand Down
1 change: 1 addition & 0 deletions src/view/viewUtils.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,7 @@ export interface ISliderProps {
axisLabel: string;
value?: number;
onUpdateValue?: (sensor: SENSOR_LIST, value: number) => void;
step: number;
}

export interface ISensorButtonProps {
Expand Down