1
0
Fork 0
mirror of https://git.rwth-aachen.de/acs/public/villas/web/ synced 2025-03-09 00:00:01 +01:00

Slider: do not send value update to DB during continuous update #311

This commit is contained in:
Sonja Happ 2021-05-04 17:22:36 +02:00
parent 1a688e6df9
commit fdd345e2ee
4 changed files with 18 additions and 16 deletions

View file

@ -94,18 +94,20 @@ class Widget extends React.Component {
};
}
inputDataChanged(widget, data, controlID, controlValue) {
inputDataChanged(widget, data, controlID, controlValue, isFinalChange) {
// controlID is the path to the widget customProperty that is changed (for example 'value')
// modify the widget customProperty
if (controlID !== '') {
let updatedWidget = JSON.parse(JSON.stringify(widget));
updatedWidget.customProperties[controlID] = controlValue;
AppDispatcher.dispatch({
type: 'widgets/start-edit',
token: this.state.sessionToken,
data: updatedWidget
});
if(isFinalChange) {
AppDispatcher.dispatch({
type: 'widgets/start-edit',
token: this.state.sessionToken,
data: updatedWidget
});
}
}
// The following assumes that a widget modifies/ uses exactly one signal
@ -185,21 +187,21 @@ class Widget extends React.Component {
return <WidgetButton
widget={widget}
editing={this.props.editing}
onInputChanged={(value, controlID, controlValue) => this.inputDataChanged(widget, value, controlID, controlValue)}
onInputChanged={(value, controlID, controlValue, isFinalChange) => this.inputDataChanged(widget, value, controlID, controlValue, isFinalChange)}
signals={this.state.signals}
/>
} else if (widget.type === 'NumberInput') {
return <WidgetInput
widget={widget}
editing={this.props.editing}
onInputChanged={(value, controlID, controlValue) => this.inputDataChanged(widget, value, controlID, controlValue)}
onInputChanged={(value, controlID, controlValue, isFinalChange) => this.inputDataChanged(widget, value, controlID, controlValue, isFinalChange)}
signals={this.state.signals}
/>
} else if (widget.type === 'Slider') {
return <WidgetSlider
widget={widget}
editing={this.props.editing}
onInputChanged={(value, controlID, controlValue) => this.inputDataChanged(widget, value, controlID, controlValue)}
onInputChanged={(value, controlID, controlValue, isFinalChange) => this.inputDataChanged(widget, value, controlID, controlValue, isFinalChange)}
signals={this.state.signals}
/>
} else if (widget.type === 'Gauge') {

View file

@ -54,14 +54,14 @@ class WidgetButton extends Component {
valueChanged(newValue, pressed) {
if (this.props.onInputChanged) {
this.props.onInputChanged(newValue, 'pressed', pressed);
this.props.onInputChanged(newValue, 'pressed', pressed, true);
}
}
render() {
const buttonStyle = {
backgroundColor: this.props.widget.customProperties.background_color,
backgroundColor: this.props.widget.customProperties.background_color,
borderColor: this.props.widget.customProperties.border_color,
color: this.props.widget.customProperties.font_color,
opacity: this.props.widget.customProperties.background_color_opacity

View file

@ -73,7 +73,7 @@ class WidgetInput extends Component {
valueChanged(newValue) {
if (this.props.onInputChanged) {
this.props.onInputChanged(Number(newValue), 'value', Number(newValue));
this.props.onInputChanged(Number(newValue), 'value', Number(newValue), true);
}
}

View file

@ -79,14 +79,14 @@ class WidgetSlider extends Component {
valueIsChanging(newValue) {
this.props.widget.customProperties.value = newValue;
if (this.props.widget.customProperties.continous_update)
this.valueChanged(newValue);
this.valueChanged(newValue, false);
this.setState({ value: newValue });
}
valueChanged(newValue) {
valueChanged(newValue, isFinalChange) {
if (this.props.onInputChanged) {
this.props.onInputChanged(newValue, 'value', newValue);
this.props.onInputChanged(newValue, 'value', newValue, isFinalChange);
}
}
@ -95,7 +95,7 @@ class WidgetSlider extends Component {
let isVertical = this.props.widget.customProperties.orientation === WidgetSlider.OrientationTypes.VERTICAL.value;
let fields = {
name: this.props.widget.name,
control: <Slider min={ this.props.widget.customProperties.rangeMin } max={ this.props.widget.customProperties.rangeMax } step={ this.props.widget.customProperties.step } value={ this.state.value } disabled={ this.props.editing } vertical={ isVertical } onChange={ (v) => this.valueIsChanging(v) } onAfterChange={ (v) => this.valueChanged(v) }/>,
control: <Slider min={ this.props.widget.customProperties.rangeMin } max={ this.props.widget.customProperties.rangeMax } step={ this.props.widget.customProperties.step } value={ this.state.value } disabled={ this.props.editing } vertical={ isVertical } onChange={ (v) => this.valueIsChanging(v) } onAfterChange={ (v) => this.valueChanged(v, true) }/>,
value: <span>{ format('.2f')(Number.parseFloat(this.state.value)) }</span>,
unit: <span className="signal-unit">{ this.state.unit }</span>
}