diff --git a/src/components/simulation-view/leave-simulation-dialog.js b/src/components/simulation-view/leave-simulation-dialog.js index 6f3e2a9fd0dc1166307d8e19ba872c6cf3b1d7d7..d5211dd91c111dafc87c1ca906813548ceb63bab 100644 --- a/src/components/simulation-view/leave-simulation-dialog.js +++ b/src/components/simulation-view/leave-simulation-dialog.js @@ -16,10 +16,10 @@ class LeaveSimulationDialog extends React.Component{ <Modal.Body>Would you like to leave or stop the simulation?</Modal.Body> <Modal.Footer> <div> - <Button variant="light"> + <Button variant="light" onClick={() => this.props.leaveSimulation()}> Leave </Button> - <Button variant="danger" onClick={this.props.stopSimulation()}> + <Button variant="danger" onClick={() => this.props.stopSimulation()}> Stop </Button> </div> diff --git a/src/components/simulation-view/simulation-view.js b/src/components/simulation-view/simulation-view.js index 171b730fefb64cce486d852b4d21082cd14ae51c..d7fd6dcabc64873e487a4a336f1f3937556d2b91 100644 --- a/src/components/simulation-view/simulation-view.js +++ b/src/components/simulation-view/simulation-view.js @@ -10,6 +10,7 @@ import SimulationToolsService from './simulation-tools-service'; import ExperimentStorageService from '../../services/experiments/files/experiment-storage-service'; import RunningSimulationService from '../../services/experiments/execution/running-simulation-service'; import { EXPERIMENT_STATE } from '../../services/experiments/experiment-constants'; +import timeDDHHMMSS from '../../utility/time-filter'; import LeaveSimulationDialog from './leave-simulation-dialog'; @@ -58,9 +59,12 @@ export default class SimulationView extends React.Component { } async componentDidMount() { + console.info('componentDidMount'); await this.updateSimulationInfo(); let experiments = await ExperimentStorageService.instance.getExperiments(); + console.info(this.state); let experimentInfo = experiments.find(experiment => experiment.id === this.state.simulationInfo.experimentID); + console.info(experimentInfo); let experimentName = experimentInfo.configuration.name; this.setState({experimentName: experimentName}); @@ -74,15 +78,21 @@ export default class SimulationView extends React.Component { } async updateSimulationInfo() { + console.info('updateSimulationInfo'); let simInfo = await RunningSimulationService.instance.getInfo(this.serverURL, this.simulationID); - console.info(simInfo); this.setState({simulationInfo: simInfo}); + console.info('updateSimulationInfo - after setState'); + console.info(this.state); } async updateInternalPageInfo() { + if (!this.state.simulationInfo) { + return; + } + let dateNow = new Date(); let dateSimCreation = new Date(this.state.simulationInfo.creationDate); - console.info(dateNow - dateSimCreation); + this.setState({simulationTimingRealtime: timeDDHHMMSS((dateNow - dateSimCreation) / 1000)}); } async onButtonStartPause() { @@ -98,14 +108,25 @@ export default class SimulationView extends React.Component { this.setState({showLeaveDialog: show}); } + leaveSimulation() { + this.props.history.push({ + pathname: '/experiments-overview' + }); + } + render() { return ( <div> <LeaveSimulationDialog visible={this.state.showLeaveDialog} - setVisibility={this.showLeaveDialog.bind(this)} - stopSimulation={() => { - RunningSimulationService.instance.updateState(this.serverURL, this.simulationID, EXPERIMENT_STATE.STOPPED); - }}/> + setVisibility={(visible) => this.showLeaveDialog(visible)} + stopSimulation={async () => { + await RunningSimulationService.instance.updateState(this.serverURL, this.simulationID, + EXPERIMENT_STATE.STOPPED); + this.leaveSimulation(); + }} + leaveSimulation={() => { + this.leaveSimulation(); + }} /> <div className='simulation-view-wrapper'> <div className='simulation-view-header'> <div className='simulation-view-controls'> @@ -128,7 +149,7 @@ export default class SimulationView extends React.Component { <div>Simulation time:</div> <div>{'00 00:00:00'}</div> <div>Real time:</div> - <div>{'11 11:11:11'}</div> + <div>{this.state.simulationTimingRealtime}</div> <div>Real timeout:</div> <div>{'22 22:22:22'}</div> </div>