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

some tweaks to the slider widget

Browse source
This commit is contained in:
Steffen Vogel 2018-06-09 15:01:53 +02:00
parent 223ee785eb
commit ee83dbdbce
3 changed files with 12 additions and 14 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

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

@ -125,8 +125,8 @@ export default function createControls(widgetType = null, widget = null, session
<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)} />
<EditWidgetNumberControl key={7} widget={widget} controlId={'step'} label={'Step Size'} defaultValue={0.1} handleChange={(e) => handleChange(e)} />,
<EditWidgetNumberControl key={8} widget={widget} controlId={'default_value'} label={'Default Value'} defaultValue={50} handleChange={(e) => handleChange(e)} />
);
break;
case 'Button':

2
src/components/dialog/edit-widget-number-control.js
View file

@ -40,7 +40,7 @@ class EditWidgetNumberControl extends Component {
return (
<FormGroup controlId={this.props.controlId} validationState={this.props.validate ? this.props.validate(this.props.controlId) : null}>
<ControlLabel>{this.props.label}</ControlLabel>
<FormControl type="number" placeholder={this.props.defaultValue} value={this.state.widget[this.props.controlId] || ''} onChange={e => this.props.handleChange(e)} />
<FormControl type="number" defaultValue={this.props.defaultValue} value={this.state.widget[this.props.controlId]} onChange={e => this.props.handleChange(e)} />
<FormControl.Feedback />
</FormGroup>
);

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

@ -38,7 +38,6 @@ class WidgetSlider extends Component {
super(props);
this.state = {
value: Number.parseFloat(this.props.widget.default_value),
unit: ''
};
}
@ -49,14 +48,14 @@ class WidgetSlider extends Component {
}
// Update value
if (nextProps.widget.value && this.state.value !== nextProps.widget.value) {
if (nextProps.widget.default_value && this.state.value === undefined) {
this.setState({
value: nextProps.widget.value,
value: nextProps.widget.default_value,
});
}
// Update unit
if (nextProps.widget.simulationModel && this.state.unit !== nextProps.simulationModel.inputMapping[nextProps.widget.signal].type) {
if (nextProps.widget.simulationModel && nextProps.simulationModel.inputMapping && this.state.unit !== nextProps.simulationModel.inputMapping[nextProps.widget.signal].type) {
this.setState({
unit: nextProps.simulationModel.inputMapping[nextProps.widget.signal].type
});
@ -95,14 +94,12 @@ class WidgetSlider extends Component {
let isVertical = this.props.widget.orientation === WidgetSlider.OrientationTypes.VERTICAL.value;
let fields = {
'name': this.props.widget.name,
'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)
name: this.props.widget.name,
control: <Slider min={ this.props.widget.rangeMin } max={ this.props.widget.rangeMax } step={ 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: <span>{ Number.parseFloat(this.state.value).toPrecision(3) }</span>,
unit: <span className="signal-unit">{ this.state.unit }</span>
}
if (this.props.widget.showUnit)
fields.value += ' [' + this.state.unit + ']';
var widgetClasses = classNames({
'slider-widget': true,
'full': true,
@ -121,7 +118,8 @@ class WidgetSlider extends Component {
<div className={widgetClasses}>
<label>{ fields.name }</label>
{ fields.control }
<span>{ fields.value }</span>
{ fields.value }
{ this.props.widget.showUnit && fields.unit }
</div>
)
);