diff options
Diffstat (limited to 'src/pages/App.js')
| -rw-r--r-- | src/pages/App.js | 168 |
1 files changed, 89 insertions, 79 deletions
diff --git a/src/pages/App.js b/src/pages/App.js index 801aefcd..ad201e7d 100644 --- a/src/pages/App.js +++ b/src/pages/App.js @@ -1,11 +1,11 @@ import PropTypes from "prop-types"; import React from "react"; import DocumentTitle from "react-document-title"; -import {connect} from "react-redux"; -import {ShortcutManager} from "react-shortcuts"; -import {openExperimentSucceeded} from "../actions/experiments"; -import {openSimulationSucceeded} from "../actions/simulations"; -import {resetCurrentDatacenter} from "../actions/topology/building"; +import { connect } from "react-redux"; +import { ShortcutManager } from "react-shortcuts"; +import { openExperimentSucceeded } from "../actions/experiments"; +import { openSimulationSucceeded } from "../actions/simulations"; +import { resetCurrentDatacenter } from "../actions/topology/building"; import ToolPanelComponent from "../components/app/map/controls/ToolPanelComponent"; import LoadingScreen from "../components/app/map/LoadingScreen"; import SimulationSidebarComponent from "../components/app/sidebars/simulation/SimulationSidebarComponent"; @@ -24,92 +24,102 @@ import KeymapConfiguration from "../shortcuts/keymap"; const shortcutManager = new ShortcutManager(KeymapConfiguration); class AppComponent extends React.Component { - static propTypes = { - simulationId: PropTypes.number.isRequired, - inSimulation: PropTypes.bool, - experimentId: PropTypes.number, - simulationName: PropTypes.string, - }; - static childContextTypes = { - shortcuts: PropTypes.object.isRequired - }; + static propTypes = { + simulationId: PropTypes.number.isRequired, + inSimulation: PropTypes.bool, + experimentId: PropTypes.number, + simulationName: PropTypes.string + }; + static childContextTypes = { + shortcuts: PropTypes.object.isRequired + }; - componentDidMount() { - this.props.resetCurrentDatacenter(); - if (this.props.inSimulation) { - this.props.openExperimentSucceeded(this.props.simulationId, this.props.experimentId); - return; - } - this.props.openSimulationSucceeded(this.props.simulationId); + componentDidMount() { + this.props.resetCurrentDatacenter(); + if (this.props.inSimulation) { + this.props.openExperimentSucceeded( + this.props.simulationId, + this.props.experimentId + ); + return; } + this.props.openSimulationSucceeded(this.props.simulationId); + } - getChildContext() { - return { - shortcuts: shortcutManager - } - } + getChildContext() { + return { + shortcuts: shortcutManager + }; + } - render() { - return ( - <DocumentTitle - title={this.props.simulationName ? this.props.simulationName + " - OpenDC" : "Simulation - OpenDC"} - > - <div className="page-container full-height"> - <AppNavbar simulationId={this.props.simulationId} inSimulation={true} fullWidth={true}/> - {this.props.datacenterIsLoading ? - <div className="full-height d-flex align-items-center justify-content-center"> - <LoadingScreen/> - </div> : - <div className="full-height"> - <MapStage/> - <ScaleIndicatorContainer/> - <ToolPanelComponent/> - <TopologySidebar/> - {this.props.inSimulation ? - <TimelineContainer/> : - undefined - } - {this.props.inSimulation ? - <SimulationSidebarComponent/> : - undefined - } - </div> - } - <EditRoomNameModal/> - <DeleteRoomModal/> - <EditRackNameModal/> - <DeleteRackModal/> - <DeleteMachineModal/> - </div> - </DocumentTitle> - ); - } + render() { + return ( + <DocumentTitle + title={ + this.props.simulationName + ? this.props.simulationName + " - OpenDC" + : "Simulation - OpenDC" + } + > + <div className="page-container full-height"> + <AppNavbar + simulationId={this.props.simulationId} + inSimulation={true} + fullWidth={true} + /> + {this.props.datacenterIsLoading ? ( + <div className="full-height d-flex align-items-center justify-content-center"> + <LoadingScreen /> + </div> + ) : ( + <div className="full-height"> + <MapStage /> + <ScaleIndicatorContainer /> + <ToolPanelComponent /> + <TopologySidebar /> + {this.props.inSimulation ? <TimelineContainer /> : undefined} + {this.props.inSimulation ? ( + <SimulationSidebarComponent /> + ) : ( + undefined + )} + </div> + )} + <EditRoomNameModal /> + <DeleteRoomModal /> + <EditRackNameModal /> + <DeleteRackModal /> + <DeleteMachineModal /> + </div> + </DocumentTitle> + ); + } } const mapStateToProps = state => { - let simulationName = undefined; - if (state.currentSimulationId !== -1 && state.objects.simulation[state.currentSimulationId]) { - simulationName = state.objects.simulation[state.currentSimulationId].name; - } + let simulationName = undefined; + if ( + state.currentSimulationId !== -1 && + state.objects.simulation[state.currentSimulationId] + ) { + simulationName = state.objects.simulation[state.currentSimulationId].name; + } - return { - datacenterIsLoading: state.currentDatacenterId === -1, - simulationName, - }; + return { + datacenterIsLoading: state.currentDatacenterId === -1, + simulationName + }; }; const mapDispatchToProps = dispatch => { - return { - resetCurrentDatacenter: () => dispatch(resetCurrentDatacenter()), - openSimulationSucceeded: id => dispatch(openSimulationSucceeded(id)), - openExperimentSucceeded: (simulationId, experimentId) => - dispatch(openExperimentSucceeded(simulationId, experimentId)), - }; + return { + resetCurrentDatacenter: () => dispatch(resetCurrentDatacenter()), + openSimulationSucceeded: id => dispatch(openSimulationSucceeded(id)), + openExperimentSucceeded: (simulationId, experimentId) => + dispatch(openExperimentSucceeded(simulationId, experimentId)) + }; }; -const App = connect( - mapStateToProps, - mapDispatchToProps -)(AppComponent); +const App = connect(mapStateToProps, mapDispatchToProps)(AppComponent); export default App; |