mirror of
https://git.rwth-aachen.de/acs/public/villas/web/
synced 2025-03-09 00:00:01 +01:00
TimeOffset Widget now displays the time offset between server and local time #208
This commit is contained in:
parent
207449bf56
commit
62840e939d
3 changed files with 27 additions and 7 deletions
|
@ -202,7 +202,7 @@ class WidgetFactory {
|
|||
widget.height = 100;
|
||||
widget.customProperties.threshold_yellow = 1;
|
||||
widget.customProperties.threshold_red = 2;
|
||||
widget.customProperties.ic = 1;
|
||||
widget.customProperties.icID = 1;
|
||||
|
||||
default:
|
||||
widget.width = 100;
|
||||
|
|
|
@ -227,6 +227,7 @@ class Widget extends React.Component {
|
|||
} else if (widget.type === 'TimeOffset') {
|
||||
return <WidgetTimeOffset
|
||||
widget={widget}
|
||||
data={this.state.icData}
|
||||
/>
|
||||
}
|
||||
|
||||
|
|
|
@ -24,23 +24,42 @@ class WidgetTimeOffset extends Component {
|
|||
super(props);
|
||||
|
||||
this.state = {
|
||||
redOn: false,
|
||||
yellowOn: false,
|
||||
greenOn: true,
|
||||
timeOffset: '',
|
||||
icID: ''
|
||||
};
|
||||
}
|
||||
|
||||
static getDerivedStateFromProps(props, state){
|
||||
|
||||
if(typeof props.widget.customProperties.icID !== "undefined" && state.icID !== props.widget.customProperties.icID){
|
||||
return {icID: props.widget.customProperties.icID};
|
||||
}
|
||||
|
||||
if (props.data == null
|
||||
|| props.data[state.icID] == null
|
||||
|| props.data[state.icID].output == null
|
||||
|| props.data[state.icID].output.timestamp == null) {
|
||||
return {timeOffset: ''};
|
||||
}
|
||||
|
||||
let serverTime = props.data[state.icID].output.timestamp;
|
||||
let localTime = Date.now();
|
||||
let absoluteOffset = Math.abs(serverTime - localTime);
|
||||
return {timeOffset: Number.parseFloat(absoluteOffset/1000).toPrecision(5)};
|
||||
}
|
||||
|
||||
render() {
|
||||
|
||||
return (
|
||||
<div>
|
||||
<TrafficLight
|
||||
RedOn={this.state.redOn}
|
||||
YellowOn={this.state.yellowOn}
|
||||
GreenOn={this.state.greenOn}
|
||||
RedOn={this.props.widget.customProperties.threshold_red <= this.state.timeOffset}
|
||||
YellowOn={(this.props.widget.customProperties.threshold_yellow <= this.state.timeOffset) && (this.state.timeOffset < this.props.widget.customProperties.threshold_red)}
|
||||
GreenOn={this.state.timeOffset < this.props.widget.customProperties.threshold_yellow}
|
||||
/>
|
||||
<div>Time offset:</div>
|
||||
<strong>{this.state.timeOffset}s</strong>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
|
Loading…
Add table
Reference in a new issue