1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
|
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 { openPortfolioSucceeded } from '../actions/portfolios'
import { openProjectSucceeded } from '../actions/projects'
import ToolPanelComponent from '../components/app/map/controls/ToolPanelComponent'
import LoadingScreen from '../components/app/map/LoadingScreen'
import ScaleIndicatorContainer from '../containers/app/map/controls/ScaleIndicatorContainer'
import MapStage from '../containers/app/map/MapStage'
import TopologySidebarContainer from '../containers/app/sidebars/topology/TopologySidebarContainer'
import DeleteMachineModal from '../containers/modals/DeleteMachineModal'
import DeleteRackModal from '../containers/modals/DeleteRackModal'
import DeleteRoomModal from '../containers/modals/DeleteRoomModal'
import EditRackNameModal from '../containers/modals/EditRackNameModal'
import EditRoomNameModal from '../containers/modals/EditRoomNameModal'
import KeymapConfiguration from '../shortcuts/keymap'
import NewTopologyModal from '../containers/modals/NewTopologyModal'
import AppNavbarContainer from '../containers/navigation/AppNavbarContainer'
import ProjectSidebarContainer from '../containers/app/sidebars/project/ProjectSidebarContainer'
import { openScenarioSucceeded } from '../actions/scenarios'
import NewPortfolioModal from '../containers/modals/NewPortfolioModal'
import NewScenarioModal from '../containers/modals/NewScenarioModal'
import PortfolioResultsContainer from '../containers/app/results/PortfolioResultsContainer'
const shortcutManager = new ShortcutManager(KeymapConfiguration)
class AppComponent extends React.Component {
static propTypes = {
projectId: PropTypes.string.isRequired,
portfolioId: PropTypes.string,
scenarioId: PropTypes.string,
projectName: PropTypes.string,
}
static childContextTypes = {
shortcuts: PropTypes.object.isRequired,
}
componentDidMount() {
if (this.props.scenarioId) {
this.props.openScenarioSucceeded(this.props.projectId, this.props.portfolioId, this.props.scenarioId)
} else if (this.props.portfolioId) {
this.props.openPortfolioSucceeded(this.props.projectId, this.props.portfolioId)
} else {
this.props.openProjectSucceeded(this.props.projectId)
}
}
getChildContext() {
return {
shortcuts: shortcutManager,
}
}
render() {
const constructionElements = this.props.topologyIsLoading ? (
<div className="full-height d-flex align-items-center justify-content-center">
<LoadingScreen />
</div>
) : (
<div className="full-height">
<MapStage />
<ScaleIndicatorContainer />
<ToolPanelComponent />
<ProjectSidebarContainer />
<TopologySidebarContainer />
</div>
)
const portfolioElements = (
<div className="full-height app-page-container">
<ProjectSidebarContainer />
<div className="container-fluid full-height">
<PortfolioResultsContainer />
</div>
</div>
)
const scenarioElements = (
<div className="full-height app-page-container">
<ProjectSidebarContainer />
<div className="container-fluid full-height">
<h2>Scenario loading</h2>
</div>
</div>
)
return (
<DocumentTitle
title={this.props.projectName ? this.props.projectName + ' - OpenDC' : 'Simulation - OpenDC'}
>
<div className="page-container full-height">
<AppNavbarContainer fullWidth={true} />
{this.props.scenarioId
? scenarioElements
: this.props.portfolioId
? portfolioElements
: constructionElements}
<NewTopologyModal />
<NewPortfolioModal />
<NewScenarioModal />
<EditRoomNameModal />
<DeleteRoomModal />
<EditRackNameModal />
<DeleteRackModal />
<DeleteMachineModal />
</div>
</DocumentTitle>
)
}
}
const mapStateToProps = (state) => {
let projectName = undefined
if (state.currentProjectId !== '-1' && state.objects.project[state.currentProjectId]) {
projectName = state.objects.project[state.currentProjectId].name
}
return {
topologyIsLoading: state.currentTopologyId === '-1',
projectName,
}
}
const mapDispatchToProps = (dispatch) => {
return {
openProjectSucceeded: (projectId) => dispatch(openProjectSucceeded(projectId)),
openPortfolioSucceeded: (projectId, portfolioId) => dispatch(openPortfolioSucceeded(projectId, portfolioId)),
openScenarioSucceeded: (projectId, portfolioId, scenarioId) =>
dispatch(openScenarioSucceeded(projectId, portfolioId, scenarioId)),
}
}
const App = connect(mapStateToProps, mapDispatchToProps)(AppComponent)
export default App
|
