ITQC/pydase
24
0
Fork 0
mirror of https://github.com/tiqi-group/pydase.git synced 2025-06-03 20:30:40 +02:00
Code Issues Packages Projects Releases Wiki Activity

frontend: remote states from slider component

Browse Source
This commit is contained in:
Mose Müller 2023-08-02 12:06:20 +02:00
parent e48e33c948
commit 9c9e11ac51
2 changed files with 6 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
frontend/src/App.tsx
View File

@ -1,10 +1,10 @@
import { useEffect, useReducer } from 'react';
import { Component, ComponentLabel } from './components/component';
import { ButtonComponent } from './components/ButtonComponent';
import { socket } from './socket';
import { NumberComponent } from './components/NumberComponent';
import { SliderComponent } from './components/SliderComponent';
import { EnumComponent } from './components/EnumComponent';
import { socket } from './socket';
type AttributeType =
| 'str'

24
frontend/src/components/SliderComponent.tsx
View File

@ -1,15 +1,5 @@
import React, { useEffect, useRef, useState } from 'react';
import {
OverlayTrigger,
Badge,
Tooltip,
InputGroup,
Form,
Row,
Col,
Button,
Collapse
} from 'react-bootstrap';
import { InputGroup, Form, Row, Col, Button, Collapse } from 'react-bootstrap';
import { socket } from '../socket';
import RangeSlider from 'react-bootstrap-range-slider';
import { DocStringComponent } from './DocStringComponent';
@ -33,10 +23,7 @@ export const SliderComponent = React.memo((props: SliderComponentProps) => {
renderCount.current++;
});
const { name, parent_path, value, readOnly, docString } = props;
const [min, setMin] = useState(props.min);
const [max, setMax] = useState(props.max);
const [stepSize, setStepSize] = useState(props.stepSize);
const { name, parent_path, value, min, max, stepSize, readOnly, docString } = props;
const socketEmit = (
newNumber: number,
@ -56,18 +43,17 @@ export const SliderComponent = React.memo((props: SliderComponentProps) => {
const handleValueChange = (newValue: number, valueType: string) => {
switch (valueType) {
case 'min':
setMin(newValue);
socketEmit(value, newValue, max, stepSize);
break;
case 'max':
setMax(newValue);
socketEmit(value, min, newValue, stepSize);
break;
case 'stepSize':
setStepSize(newValue);
socketEmit(value, min, max, newValue);
break;
default:
break;
}
socketEmit(value, min, max, stepSize);
};
return (