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

Commit 662e3ed

Browse files
xnkevinnguyenxnkevinnguyen
committed
Refactor accelerometer component
1 parent a4fbab1 commit 662e3ed

File tree

5 files changed

+42
-80
lines changed

5 files changed

+42
-80
lines changed

‎src/view/components/toolbar/SensorModalUtils.tsx

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -164,9 +164,9 @@ export const MOTION_MODAL_CONTENT = (
164164
sensorValues: { [key: string]: number }
165165
): IModalContent => {
166166
const motionSensorValues = {
167-
X_AXIS: sensorValues[SENSOR_LIST.MOTION_X],
168-
Y_AXIS: sensorValues[SENSOR_LIST.MOTION_Y],
169-
Z_AXIS: sensorValues[SENSOR_LIST.MOTION_Z],
167+
X: sensorValues[SENSOR_LIST.MOTION_X],
168+
Y: sensorValues[SENSOR_LIST.MOTION_Y],
169+
Z: sensorValues[SENSOR_LIST.MOTION_Z],
170170
};
171171
return {
172172
descriptionTitle: "toolbar-motion-sensor.title",
@@ -296,9 +296,9 @@ export const ACCELEROMETER_MODAL_CONTENT = (
296296
sendGesture?: (isActive: boolean) => void
297297
): IModalContent => {
298298
const accelerometerSensorValues = {
299-
X_AXIS: sensorValues[SENSOR_LIST.MOTION_X],
300-
Y_AXIS: sensorValues[SENSOR_LIST.MOTION_Y],
301-
Z_AXIS: sensorValues[SENSOR_LIST.MOTION_Z],
299+
X: sensorValues[SENSOR_LIST.MOTION_X],
300+
Y: sensorValues[SENSOR_LIST.MOTION_Y],
301+
Z: sensorValues[SENSOR_LIST.MOTION_Z],
302302
};
303303
return {
304304
components: (

‎src/view/components/toolbar/clue/ClueModalContent.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -48,9 +48,9 @@ export const CLUE_ACCELEROMETER_MODAL_CONTENT = (
4848
sendGesture?: (isActive: boolean) => void
4949
): IModalContent => {
5050
const accelerometerSensorValues = {
51-
X_AXIS: sensorValues[SENSOR_LIST.MOTION_X],
52-
Y_AXIS: sensorValues[SENSOR_LIST.MOTION_Y],
53-
Z_AXIS: sensorValues[SENSOR_LIST.MOTION_Z],
51+
X: sensorValues[SENSOR_LIST.MOTION_X],
52+
Y: sensorValues[SENSOR_LIST.MOTION_Y],
53+
Z: sensorValues[SENSOR_LIST.MOTION_Z],
5454
};
5555
return {
5656
components: (

‎src/view/components/toolbar/motion/Accelerometer.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -43,9 +43,9 @@ const MOTION_SENSOR_PROPERTIES: ISensorProps = {
4343

4444
interface IProps {
4545
axisValues: {
46-
X_AXIS: number;
47-
Y_AXIS: number;
48-
Z_AXIS: number;
46+
X: number;
47+
Y: number;
48+
Z: number;
4949
};
5050
onUpdateValue: (sensor: SENSOR_LIST, value: number) => void;
5151
onSelectGestures?: (event: React.ChangeEvent<HTMLSelectElement>) => void;

‎src/view/components/toolbar/motion/MotionSensorBar.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -46,9 +46,9 @@ const MOTION_SENSOR_PROPERTIES: ISensorProps = {
4646
};
4747
interface IProps {
4848
axisValues: {
49-
X_AXIS: number;
50-
Y_AXIS: number;
51-
Z_AXIS: number;
49+
X: number;
50+
Y: number;
51+
Z: number;
5252
};
5353
onUpdateValue: (sensor: SENSOR_LIST, value: number) => void;
5454
}

‎src/view/components/toolbar/motion/threeDimensionSlider/ThreeDimensionSlider.tsx

Lines changed: 27 additions & 65 deletions
Original file line numberDiff line numberDiff line change
@@ -5,83 +5,45 @@ import {
55
X_SLIDER_INDEX,
66
Y_SLIDER_INDEX,
77
Z_SLIDER_INDEX,
8+
ISliderProps,
89
} from "../../../../viewUtils";
910
import InputSlider from "../../InputSlider";
1011

1112
interface IProps {
1213
axisProperties: ISensorProps;
1314
axisValues: {
14-
X_AXIS: number;
15-
Y_AXIS: number;
16-
Z_AXIS: number;
15+
X: number;
16+
Y: number;
17+
Z: number;
1718
};
1819
onUpdateValue: (sensor: SENSOR_LIST, value: number) => void;
1920
}
2021
export const ThreeDimensionSlider: React.FC<IProps> = props => {
2122
return (
2223
<div className="ThreeDimensionSlider">
23-
<InputSlider
24-
minValue={
25-
props.axisProperties.sliderProps[X_SLIDER_INDEX].minValue
26-
}
27-
maxValue={
28-
props.axisProperties.sliderProps[X_SLIDER_INDEX].maxValue
29-
}
30-
type={props.axisProperties.sliderProps[X_SLIDER_INDEX].type}
31-
minLabel={
32-
props.axisProperties.sliderProps[X_SLIDER_INDEX].minLabel
33-
}
34-
maxLabel={
35-
props.axisProperties.sliderProps[X_SLIDER_INDEX].maxLabel
36-
}
37-
axisLabel={
38-
props.axisProperties.sliderProps[X_SLIDER_INDEX].axisLabel
39-
}
40-
onUpdateValue={props.onUpdateValue}
41-
value={props.axisValues.X_AXIS}
42-
/>
43-
<br />
44-
<InputSlider
45-
minValue={
46-
props.axisProperties.sliderProps[Y_SLIDER_INDEX].minValue
47-
}
48-
maxValue={
49-
props.axisProperties.sliderProps[Y_SLIDER_INDEX].maxValue
50-
}
51-
type={props.axisProperties.sliderProps[Y_SLIDER_INDEX].type}
52-
minLabel={
53-
props.axisProperties.sliderProps[Y_SLIDER_INDEX].minLabel
54-
}
55-
maxLabel={
56-
props.axisProperties.sliderProps[Y_SLIDER_INDEX].maxLabel
57-
}
58-
axisLabel={
59-
props.axisProperties.sliderProps[Y_SLIDER_INDEX].axisLabel
60-
}
61-
onUpdateValue={props.onUpdateValue}
62-
value={props.axisValues.Y_AXIS}
63-
/>
64-
<br />
65-
<InputSlider
66-
minValue={
67-
props.axisProperties.sliderProps[Z_SLIDER_INDEX].minValue
68-
}
69-
maxValue={
70-
props.axisProperties.sliderProps[Z_SLIDER_INDEX].maxValue
71-
}
72-
type={props.axisProperties.sliderProps[Z_SLIDER_INDEX].type}
73-
minLabel={
74-
props.axisProperties.sliderProps[Z_SLIDER_INDEX].minLabel
75-
}
76-
maxLabel={
77-
props.axisProperties.sliderProps[Z_SLIDER_INDEX].maxLabel
78-
}
79-
axisLabel={
80-
props.axisProperties.sliderProps[Z_SLIDER_INDEX].axisLabel
81-
}
82-
onUpdateValue={props.onUpdateValue}
83-
value={props.axisValues.Z_AXIS}
84-
/>
24+
{props.axisProperties.sliderProps.map(
25+
(sliderProperties: ISliderProps, index: number) => {
26+
return (
27+
<React.Fragment key={index}>
28+
<InputSlider
29+
minValue={sliderProperties.minValue}
30+
maxValue={sliderProperties.maxValue}
31+
type={sliderProperties.type}
32+
minLabel={sliderProperties.minLabel}
33+
maxLabel={sliderProperties.maxLabel}
34+
axisLabel={sliderProperties.axisLabel}
35+
onUpdateValue={props.onUpdateValue}
36+
value={
37+
props.axisValues[
38+
sliderProperties.axisLabel as keyof IProps["axisValues"]
39+
]
40+
}
41+
/>
42+
<br />
43+
</React.Fragment>
44+
);
45+
}
46+
)}
8547
</div>
8648
);
8749
};

0 commit comments

Comments
 (0)