Skip to content

Commit 536f9d5

Browse files
author
rodriguez-facundo
committed
#147 Get Splash page while model is loading
1 parent a55776a commit 536f9d5

12 files changed

Lines changed: 70 additions & 57 deletions

File tree

‎webapp/components/NetPyNE.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -5,10 +5,10 @@ import {
55
LayoutManager,
66
Drawer
77
} from "netpyne/components";
8-
8+
import Splash from './general/Splash'
99
import { withStyles } from '@material-ui/core/styles'
1010
import Utils from '../Utils';
11-
const styles = ({ zIndex, palette, spacing }) => ({
11+
const styles = ({ zIndex }) => ({
1212
root: { height: '100%', overflow: 'hidden' },
1313
container: {
1414
height: "100%",

‎webapp/components/definition/cellRules/NetPyNECellRules.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -472,7 +472,7 @@ export default class NetPyNECellRules extends React.Component {
472472
switch (rule) {
473473
case 'cellRule':
474474
if (page !== 'main'){
475-
return 'CR'
475+
return 'CT'
476476
} else {
477477
return <ContentAdd style={{ color: 'white' }}/>
478478
}

‎webapp/components/general/Splash.js‎

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
import React, { Component } from 'react'
2+
import Box from '@material-ui/core/Box'
3+
4+
export default class Splash extends Component {
5+
render () {
6+
return (
7+
<Box position='fixed' top={0} bgcolor="white" height="100%" width="100%">
8+
<img style={{ width: '100%' }} src="geppetto/build/static/splash.png"/>
9+
</Box>
10+
)
11+
}
12+
}

‎webapp/components/index.js‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -212,7 +212,8 @@ export const Topbar = connect(
212212
dialogOpen: state.topbar.dialogOpen,
213213
editMode: state.general.editMode,
214214
topbarDialogName: state.topbar.dialogName,
215-
pageTransitionMode: state.topbar.pageTransitionMode
215+
pageTransitionMode: state.topbar.pageTransitionMode,
216+
modelLoaded: state.general.modelLoaded
216217
}),
217218
dispatch => ({
218219
dispatchAction: action => dispatch(action),

‎webapp/components/settings/Drawer.js‎

Lines changed: 26 additions & 32 deletions
Original file line numberDiff line numberDiff line change
@@ -25,36 +25,29 @@ const drawerOpenWidth = 160;
2525
const drawerCloseWidth = 44;
2626

2727

28-
const DrawerItem = ({ id, name, widget, expanded, createOrFocusWidget, classes }) => {
29-
const drawerItemContent = (
30-
<ListItem
31-
button
32-
key={id}
33-
dense
34-
disableGutters
35-
className={widget ? classes.selected : classes.unselected}
36-
onClick={() => createOrFocusWidget(id)}
37-
>
38-
<ListItemIcon className={classes.icon}>
39-
<DrawerIcon name={id} selected={widget && widget.status !== WidgetStatus.MINIMIZED} />
40-
</ListItemIcon>
41-
<ListItemText className={classes.text}>
42-
<Typography noWrap>{name}</Typography>
43-
</ListItemText>
44-
</ListItem>
45-
)
46-
47-
if (expanded) {
48-
return drawerItemContent
49-
}
50-
51-
return (
52-
<Tooltip title={name} placement="right" >
53-
{drawerItemContent}
54-
</Tooltip>
55-
)
56-
57-
}
28+
const DrawerItem = ({ id, name, widget, expanded, createOrFocusWidget, disabled, classes }) => (
29+
<Tooltip title={expanded ? "" : name} placement="right" >
30+
<div>
31+
<ListItem
32+
button
33+
key={id}
34+
dense
35+
disableGutters
36+
disabled={disabled}
37+
className={widget ? classes.selected : classes.unselected}
38+
onClick={() => createOrFocusWidget(id)}
39+
>
40+
<ListItemIcon className={classes.icon}>
41+
<DrawerIcon name={id} selected={widget && widget.status !== WidgetStatus.MINIMIZED} />
42+
</ListItemIcon>
43+
<ListItemText className={classes.text}>
44+
<Typography noWrap>{name}</Typography>
45+
</ListItemText>
46+
</ListItem>
47+
</div>
48+
49+
</Tooltip>
50+
)
5851

5952
export default ({ newWidget, editMode, activateWidget, updateWidget }) => {
6053
const [expand, setExpand] = useState(false)
@@ -107,6 +100,7 @@ export default ({ newWidget, editMode, activateWidget, updateWidget }) => {
107100
id={id}
108101
name={name}
109102
widget={widget}
103+
disabled={widget.disabled}
110104
expanded={expand}
111105
classes={classes}
112106
createOrFocusWidget={createOrFocusWidget}
@@ -124,9 +118,9 @@ export default ({ newWidget, editMode, activateWidget, updateWidget }) => {
124118
{getMenu().map(mapItem)}
125119
</List>
126120
</div>
127-
<div></div>
128121

129-
122+
<div/>
123+
130124
<div className={classes.buttonContainer}>
131125
<Tooltip title={expand ? "Collapse" : "Expand"}>
132126
<IconButton

‎webapp/components/topbar/Topbar.js‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@ import Menu from '@geppettoengine/geppetto-client/js/components/interface/menu/M
44

55
import toolbarConfig from './configuration'
66
import { bgRegular, bgLight, font } from '../../theme'
7+
import Splash from '../general/Splash'
78

89
import LoadFileDialog from './dialogs/LoadFile';
910
import SaveFileDialog from './dialogs/SaveFile';
@@ -126,8 +127,8 @@ class Topbar extends Component {
126127
/>
127128
<SwitchPageButton/>
128129

129-
130-
</div>
130+
</div>
131+
{ this.props.modelLoaded ? null : <Splash/> }
131132
<Snackbar
132133
message={this.snackBarMessage}
133134
autoHideDuration={4000}

‎webapp/constants.js‎

Lines changed: 15 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -93,7 +93,6 @@ export const WIDGETS_IDS = {
9393

9494

9595
}
96-
let pos = 1;
9796
export const PLOT_WIDGETS = {
9897
connectionPlot: {
9998
id: 'connectionPlot',
@@ -108,7 +107,7 @@ export const PLOT_WIDGETS = {
108107
plotMethod: 'plotConn',
109108
plotType: false
110109
},
111-
pos: pos++
110+
pos: 1
112111
},
113112
d2NetPlot: {
114113
id: 'd2NetPlot',
@@ -123,7 +122,7 @@ export const PLOT_WIDGETS = {
123122
plotMethod: 'plot2Dnet',
124123
plotType: false
125124
},
126-
pos: pos++
125+
pos: 2
127126
},
128127
shapePlot: {
129128
id: 'shapePlot',
@@ -138,7 +137,7 @@ export const PLOT_WIDGETS = {
138137
plotMethod: 'plotShape',
139138
plotType: false
140139
},
141-
pos: pos++
140+
pos: 3
142141
},
143142
tracesPlot: {
144143
id: 'tracesPlot',
@@ -153,7 +152,7 @@ export const PLOT_WIDGETS = {
153152
plotMethod: 'plotTraces',
154153
plotType: false
155154
},
156-
pos: pos++
155+
pos: 4
157156
},
158157
rasterPlot: {
159158
id: 'rasterPlot',
@@ -168,7 +167,7 @@ export const PLOT_WIDGETS = {
168167
plotMethod: 'plotRaster',
169168
plotType: false
170169
},
171-
pos: pos++
170+
pos: 5
172171
},
173172
spikePlot: {
174173
id: 'spikePlot',
@@ -183,7 +182,7 @@ export const PLOT_WIDGETS = {
183182
plotMethod: 'plotSpikeHist',
184183
plotType: false
185184
},
186-
pos: pos++
185+
pos: 6
187186
},
188187
spikeStatsPlot: {
189188
id: 'spikeStatsPlot',
@@ -198,7 +197,7 @@ export const PLOT_WIDGETS = {
198197
plotMethod: 'plotSpikeStats',
199198
plotType: false
200199
},
201-
pos: pos++
200+
pos: 7
202201
},
203202
ratePSDPlot: {
204203
id: 'ratePSDPlot',
@@ -212,7 +211,8 @@ export const PLOT_WIDGETS = {
212211
method: {
213212
plotMethod: 'plotRatePSD',
214213
plotType: false
215-
}
214+
},
215+
pos: 8
216216
},
217217
LFPTimeSeriesPlot: {
218218
id: 'LFPTimeSeriesPlot',
@@ -227,7 +227,7 @@ export const PLOT_WIDGETS = {
227227
plotMethod: 'plotLFP',
228228
plotType: 'timeSeries'
229229
},
230-
pos: pos++
230+
pos: 9
231231
},
232232
LFPPSDPlot: {
233233
id: 'LFPPSDPlot',
@@ -242,7 +242,7 @@ export const PLOT_WIDGETS = {
242242
plotMethod: 'plotLFP',
243243
plotType: 'PSD'
244244
},
245-
pos: pos++
245+
pos: 10
246246
},
247247
LFPSpectrogramPlot: {
248248
id: 'LFPSpectrogramPlot',
@@ -257,7 +257,7 @@ export const PLOT_WIDGETS = {
257257
plotMethod: 'plotLFP',
258258
plotType: 'spectrogram'
259259
},
260-
pos: pos++
260+
pos: 11
261261
},
262262
LFPLocationsPlot: {
263263
id: 'LFPLocationsPlot',
@@ -272,7 +272,7 @@ export const PLOT_WIDGETS = {
272272
plotMethod: 'plotLFP',
273273
plotType: 'locations'
274274
},
275-
pos: pos++
275+
pos: 12
276276
},
277277
grangerPlot: {
278278
id: 'grangerPlot',
@@ -287,7 +287,7 @@ export const PLOT_WIDGETS = {
287287
plotMethod: 'granger',
288288
plotType: false
289289
},
290-
pos: pos++
290+
pos: 13
291291
},
292292
rxdConcentrationPlot: {
293293
id: 'rxdConcentrationPlot',
@@ -302,7 +302,7 @@ export const PLOT_WIDGETS = {
302302
plotMethod: 'plotRxDConcentration',
303303
plotType: false
304304
},
305-
pos: pos++
305+
pos: 14
306306
}
307307
}
308308

‎webapp/geppetto.ejs‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -45,8 +45,7 @@ $content
4545

4646
<div id="mainContainer">
4747
<div id="loadingText" style="font-family: consolas;margin: 0px;">
48-
<img src="geppetto/build/splash.png" style="max-width: 90%;margin: 0px;position: absolute;display: inline-block;text-align: center;vertical-align: middle;top: 2%;left: 5%;" alt="" onerror='document.getElementById("loadingMessage").style.display="block"' >
49-
<span id="loadingMessage" style="display : none; margin-top: 50px" >LOADING... [~3MB]</span>
48+
<img src="geppetto/build/static/splash.png" style="max-width: 90%;margin: 0px;position: absolute;display: inline-block;text-align: center;vertical-align: middle;top: 2%;left: 5%;" alt="" onerror='document.getElementById("loadingMessage").style.display="block"' >
5049
</div>
5150
<div id="controls" class="noSelection">
5251
<div id="DownloadProjectButton" class="row"></div>

‎webapp/redux/middleware/plotMiddleware.js‎

Lines changed: 7 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -14,9 +14,13 @@ async function setWidget (widget) {
1414

1515
if (!result) {
1616
console.warn('Plot not retrieved:', widget.id);
17-
return null;
17+
widget.disabled = true;
18+
return widget;
19+
// return null;
20+
1821
} else {
1922
console.log('Plot retrieved:', widget.id);
23+
widget.disabled = false;
2024
return widget;
2125
}
2226

@@ -28,7 +32,8 @@ export default store => next => action => {
2832
case SET_WIDGETS: {
2933
for (let widget of Object.values(action.data)) {
3034
if ((widget.id in PLOT_WIDGETS) && widget.method) {
31-
delete action.data[widget.id];
35+
// delete action.data[widget.id];
36+
action.data[widget.id].disabled;
3237
setWidget(widget).then(widget => widget ? next(addWidget(widget)) : null);
3338
}
3439
}

‎webapp/redux/middleware/rulesOperationsMiddleware.js‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import { DELETE_NETPARAMS_OBJ, updateCards } from '../actions/general';
22
import Utils from '../../Utils'
33
import { NETPYNE_COMMANDS } from '../../constants'
4+
45
export default store => next => action => {
56
switch (action.type) {
67

0 commit comments

Comments
 (0)