Mirrors/VILLASweb
1
0
Fork 0
mirror of https://git.rwth-aachen.de/acs/public/villas/web/ synced 2025-03-09 00:00:01 +01:00
Code Issues Releases Wiki Activity

add more properties to slider widget

Browse source
This commit is contained in:
Steffen Vogel 2018-06-05 18:16:48 +02:00
parent 3371847f0d
commit 87c0b5b95f
2 changed files with 28 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

7
src/components/dialog/edit-widget-control-creator.js
View file

@ -22,6 +22,7 @@
import React from 'react';
import EditWidgetTextControl from './edit-widget-text-control';
import EditWidgetNumberControl from './edit-widget-number-control';
import EditWidgetColorControl from './edit-widget-color-control';
import EditWidgetTimeControl from './edit-widget-time-control';
import EditImageWidgetControl from './edit-widget-image-control';
@ -121,7 +122,11 @@ export default function createControls(widgetType = null, widget = null, session
<EditWidgetOrientation key={1} widget={widget} validate={(id) => validateForm(id)} simulationModels={simulationModels} handleChange={(e) => handleChange(e)} />,
<EditWidgetSimulatorControl key={2} widget={widget} validate={(id) => validateForm(id)} simulationModels={simulationModels} handleChange={(e) => handleChange(e)} />,
<EditWidgetSignalControl key={3} widget={widget} input validate={(id) => validateForm(id)} simulationModels={simulationModels} handleChange={(e) => handleChange(e)} />,
<EditWidgetCheckboxControl key={4} text={'Continous Update'} controlId={'continous_update'} widget={widget} input simulationModels={simulationModels} handleChange={(e) => handleChange(e)} />
<EditWidgetCheckboxControl key={4} text={'Continous Update'} controlId={'continous_update'} widget={widget} input simulationModels={simulationModels} handleChange={(e) => handleChange(e)} />,
<EditWidgetCheckboxControl key={5} widget={widget} controlId={'showUnit'} text="Show unit" handleChange={e => handleChange(e)} />,
<EditWidgetMinMaxControl key={6} widget={widget} controlId={'range'} handleChange={e => handleChange(e)} />,
<EditWidgetNumberControl key={7} widget={widget} controlId={'step'} label={'Step Size'} placeholder={0.1} handleChange={(e) => handleChange(e)} />,
<EditWidgetNumberControl key={8} widget={widget} controlId={'default_value'} label={'Default Value'} placeholder={50} handleChange={(e) => handleChange(e)} />
);
break;
case 'Button':

26
src/components/widget-slider.js
View file

@ -25,15 +25,30 @@ class WidgetSlider extends Component {
super(props);
this.state = {
value: 50
value: Number.parseFloat(this.props.widget.default_value),
unit: ''
};
}
componentWillReceiveProps(nextProps) {
if (nextProps.simulationModel == null) {
return;
}
// Update value
if (nextProps.widget.value && this.state.value !== nextProps.widget.value) {
this.setState({ value: nextProps.widget.value })
this.setState({
value: nextProps.widget.value,
});
}
// Update unit
if (nextProps.widget.simulationModel && this.state.unit !== nextProps.simulationModel.inputMapping[nextProps.widget.signal].type) {
this.setState({
unit: nextProps.simulationModel.inputMapping[nextProps.widget.signal].type
});
}
// Check if the orientation changed, update the size if it did
if (this.props.widget.orientation !== nextProps.widget.orientation) {
let baseWidget = nextProps.widget;
@ -68,10 +83,13 @@ class WidgetSlider extends Component {
let fields = {
'name': this.props.widget.name,
'control': <Slider min={0} max={100} value={ this.state.value } step={ 0.1 } disabled={ this.props.editing } vertical={ isVertical } onChange={ (v) => this.valueIsChanging(v) } onAfterChange={ (v) => this.valueChanged(v) }/>,
'value': this.state.value
'control': <Slider min={ this.props.widget.rangeMin } max={ this.props.widget.rangeMax } step={ Number.parseFloat(this.props.widget.step) } value={ this.state.value } disabled={ this.props.editing } vertical={ isVertical } onChange={ (v) => this.valueIsChanging(v) } onAfterChange={ (v) => this.valueChanged(v) }/>,
'value': Number.parseFloat(this.state.value).toPrecision(3)
}
if (this.props.widget.showUnit)
fields.value += ' [' + this.state.unit + ']';
var widgetClasses = classNames({
'slider-widget': true,
'full': true,