Skip to content

Commit 66fd8d4

Browse files
author
rodriguez-facundo
committed
#136 Move python console to flexlayout widgets
1 parent 599d101 commit 66fd8d4

11 files changed

Lines changed: 195 additions & 309 deletions

File tree

‎webapp/Main.js‎

Lines changed: 10 additions & 45 deletions
Original file line numberDiff line numberDiff line change
@@ -5,70 +5,35 @@ jQuery(function () {
55
require('geppetto-client-initialization');
66
const ReactDOM = require('react-dom');
77
const React = require('react');
8-
const getMuiTheme = require('@material-ui/core/styles/createMuiTheme').default;
98
const MuiThemeProvider = require('@material-ui/core/styles').MuiThemeProvider;
109
const NetPyNE = require('./components').NetPyNE;
1110

12-
13-
const Utils = require('./Utils').default;
14-
const Console = require('geppetto-client/js/components/interface/console/Console');
15-
const TabbedDrawer = require('geppetto-client/js/components/interface/drawer/TabbedDrawer');
16-
const PythonConsole = require('geppetto-client/js/components/interface/pythonConsole/PythonConsole');
17-
1811
const theme = require('./Theme').default
1912

2013
const Provider = require("react-redux").Provider;
2114
const configureStore = require('./redux/store').default;
2215

23-
const modelLoaded = require('./redux/actions/general').modelLoaded;
24-
2516
require('./css/netpyne.less');
2617
require('./css/material.less');
2718
require('./css/traceback.less');
2819
require('./css/flexlayout.less');
2920

3021
const store = configureStore();
3122

32-
function App (data = {}) {
33-
return (
34-
<div>
35-
<MuiThemeProvider theme={theme}>
36-
<Provider store={store}>
37-
<NetPyNE {...data}></NetPyNE>
38-
</Provider>
39-
</MuiThemeProvider>
23+
ReactDOM.render(
24+
<div>
25+
<MuiThemeProvider theme={theme}>
26+
<Provider store={store}>
27+
<NetPyNE ></NetPyNE>
28+
</Provider>
29+
</MuiThemeProvider>
4030

41-
<div id="footer">
42-
<div id="footerHeader">
43-
<TabbedDrawer anchor="appBar" labels={["Console", "Python"]} iconClass={["fa fa-terminal", "fa fa-flask"]} >
44-
<Console />
45-
<PythonConsole pythonNotebookPath={"notebooks/notebook.ipynb"} />
46-
</TabbedDrawer>
47-
</div>
48-
</div>
49-
</div>
50-
);
51-
}
52-
ReactDOM.render(<App />, document.querySelector('#mainContainer'));
31+
</div>,
32+
document.querySelector('#mainContainer')
33+
);
5334

5435
GEPPETTO.G.setIdleTimeOut(-1);
55-
GEPPETTO.G.debug(false); // Change this to true to see messages on the Geppetto console while loading
5636
GEPPETTO.Resources.COLORS.DEFAULT = "#6f54aa";
5737
GEPPETTO.trigger(GEPPETTO.Events.Show_spinner, "Initialising NetPyNE");
5838

59-
60-
GEPPETTO.on('jupyter_geppetto_extension_ready', data => {
61-
let project = { id: 1, name: 'Project', experiments: [{ "id": 1, "name": 'Experiment', "status": 'DESIGN' }] }
62-
GEPPETTO.Manager.loadProject(project, false);
63-
GEPPETTO.Manager.loadExperiment(1, [], []);
64-
Utils.execPythonMessage('from netpyne_ui.netpyne_geppetto import netpyne_geppetto');
65-
Utils.evalPythonMessage('netpyne_geppetto.getData',[]).then(response => {
66-
const data = Utils.convertToJSON(response);
67-
GEPPETTO.on(GEPPETTO.Events.Model_loaded, () => {
68-
store.dispatch(modelLoaded);
69-
});
70-
ReactDOM.render(<App data={data} />, document.querySelector('#mainContainer'), store.dispatch(modelLoaded));
71-
GEPPETTO.trigger("spinner:hide");
72-
})
73-
});
7439
});

‎webapp/Theme.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -44,7 +44,7 @@ export default createMuiTheme({
4444
border: 'none !important',
4545
boxShadow: 'none !important'
4646
},
47-
select: { "&:focus" :{ background: "none" } },
47+
select: { "&:focus" :{ background: "none" }, paddingLeft: '4px' },
4848
},
4949
MuiCard: { root: { height: '100%', backgroundColor: bgRegular, overflowY: 'auto' } },
5050
MuiBottomNavigation: { root: { backgroundColor: bgRegular } },

‎webapp/components/NetPyNE.js‎

Lines changed: 18 additions & 41 deletions
Original file line numberDiff line numberDiff line change
@@ -34,13 +34,10 @@ const styles = ({ zIndex, palette, spacing }) => ({
3434
drawer: { marginLeft: spacing(-1) },
3535
content: { position: "relative", zIndex: zIndex.appBar }
3636
})
37-
class NetPyNE extends React.Component {
38-
constructor (props) {
39-
super(props);
40-
this.widgets = {};
41-
42-
}
4337

38+
39+
class NetPyNE extends React.Component {
40+
4441
openPythonCallDialog (event) {
4542
const payload = { errorMessage: event['evalue'], errorDetails: event['traceback'].join('\n') }
4643
this.props.pythonCallErrorDialogBox(payload)
@@ -54,44 +51,24 @@ class NetPyNE extends React.Component {
5451
GEPPETTO.off(GEPPETTO.Events.Error_while_exec_python_command, this.openPythonCallDialog, this)
5552
}
5653

57-
UNSAFE_componentWillReceiveProps (nextProps) {
58-
if (this.props.data != nextProps.data) {
59-
console.log("Initialising NetPyNE Tabs");
60-
61-
window.metadata = nextProps.data.metadata;
62-
window.currentFolder = nextProps.data.currentFolder;
63-
window.isDocker = nextProps.data.isDocker;
64-
}
65-
}
66-
67-
6854
render () {
69-
if (!this.props.data) {
70-
return <div></div>;
71-
} else {
72-
const { classes } = this.props
73-
if (this.props.editMode) {
74-
var content = <LayoutManager/>;
75-
} else {
76-
var content = <LayoutManager />;
77-
}
55+
const { classes } = this.props
7856

79-
return (
80-
<div className={classes.container}>
81-
<div className={classes.content}>
82-
<Toolbar id="appBar" className={classes.toolbar}>
83-
<div className={classes.drawer}>
84-
<NetPyNEToolBar />
85-
</div>
86-
<div className={classes.views}>
87-
<NetPyNETabs />
88-
</div>
89-
</Toolbar>
90-
</div>
91-
{content}
57+
return (
58+
<div className={classes.container}>
59+
<div className={classes.content}>
60+
<Toolbar id="appBar" className={classes.toolbar}>
61+
<div className={classes.drawer}>
62+
<NetPyNEToolBar />
63+
</div>
64+
<div className={classes.views}>
65+
<NetPyNETabs />
66+
</div>
67+
</Toolbar>
9268
</div>
93-
);
94-
}
69+
<LayoutManager/>
70+
</div>
71+
);
9572
}
9673
}
9774
export default withStyles(styles)(NetPyNE)

‎webapp/components/general/NetPyNEPythonConsole.js‎

Lines changed: 47 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,47 @@
1+
import React, { Component } from 'react'
2+
import Utils from '../../Utils'
3+
4+
import PythonConsole from '@geppettoengine/geppetto-client/js/components/interface/pythonConsole/PythonConsole';
5+
6+
import { EDIT_MODE_INITIAL_WIDGET_STATE } from '../../redux/reducers/flexlayout';
7+
8+
export default class NetPyNEPythonConsole extends Component {
9+
10+
addMetadataToWindow (data) {
11+
console.log("Initialising NetPyNE Tabs");
12+
window.metadata = data.metadata;
13+
window.currentFolder = data.currentFolder;
14+
window.isDocker = data.isDocker;
15+
16+
}
17+
18+
addWidgets () {
19+
Object.keys(EDIT_MODE_INITIAL_WIDGET_STATE).forEach(widgetId => {
20+
this.props.newWidget(EDIT_MODE_INITIAL_WIDGET_STATE[widgetId])
21+
})
22+
}
23+
24+
25+
componentDidMount () {
26+
GEPPETTO.on('jupyter_geppetto_extension_ready', data => {
27+
let project = { id: 1, name: 'Project', experiments: [{ "id": 1, "name": 'Experiment', "status": 'DESIGN' }] }
28+
GEPPETTO.Manager.loadProject(project, false);
29+
GEPPETTO.Manager.loadExperiment(1, [], []);
30+
Utils.execPythonMessage('from netpyne_ui.netpyne_geppetto import netpyne_geppetto');
31+
Utils.evalPythonMessage('netpyne_geppetto.getData',[]).then(response => {
32+
const data = Utils.convertToJSON(response);
33+
this.addMetadataToWindow(data)
34+
this.props.modelLoaded();
35+
36+
37+
GEPPETTO.on(GEPPETTO.Events.Model_loaded, () => {
38+
this.addWidgets()
39+
});
40+
GEPPETTO.trigger("spinner:hide");
41+
})
42+
});
43+
}
44+
render () {
45+
return <PythonConsole pythonNotebookPath={"notebooks/notebook.ipynb"} />
46+
}
47+
}

‎webapp/components/index.js‎

Lines changed: 14 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -6,12 +6,15 @@ import {
66
activateWidget,
77
destroyWidget,
88
minimizeWidget,
9-
maximizeWidget
9+
maximizeWidget,
10+
newWidget
1011
} from "../redux/actions/flexlayout";
1112
import { openBackendErrorDialog, closeBackendErrorDialog } from '../redux/actions/errors';
12-
import { updateCards, editModel, simulateNetwork, createNetwork, createAndSimulateNetwork, showNetwork, pythonCall } from "../redux/actions/general";
13+
import {
14+
updateCards, editModel, simulateNetwork, createNetwork,
15+
createAndSimulateNetwork, showNetwork, pythonCall, modelLoaded
16+
} from "../redux/actions/general";
1317
import { closeDrawerDialogBox, openDrawerDialogBox } from '../redux/actions/drawer';
14-
import { newWidget } from "../redux/actions/flexlayout";
1518

1619
const updateCardsDispatch = dispatch => ({ updateCards: () => dispatch(updateCards) });
1720
const pythonCallErrorDispatch = dispatch => ({ pythonCallErrorDialogBox: payload => dispatch(openBackendErrorDialog(payload)) });
@@ -219,6 +222,14 @@ export const PlotButtons = connect(
219222
pythonCallErrorDialogBox: payload => dispatch(openBackendErrorDialog(payload))
220223
})
221224
)(_PlotButton)
225+
226+
227+
import _NetPyNEPythonConsole from './general/NetPyNEPythonConsole'
228+
export const NetPyNEPythonConsole = connect(
229+
null,
230+
dispatch => ({ modelLoaded: () => dispatch(modelLoaded) })
231+
)(_NetPyNEPythonConsole)
232+
222233
// ---------------------------------------------------------------------------------------- //
223234

224235
// DEFAULTS

‎webapp/components/layout/WidgetFactory.js‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,8 @@ import {
1212
NetPyNEStimulationTargets,
1313
NetPyNESimConfig,
1414
NetPyNEPopulations,
15-
NetPyNEPlots
15+
NetPyNEPlots,
16+
NetPyNEPythonConsole
1617
} from "netpyne/components";
1718

1819
export default class WidgetFactory{
@@ -45,7 +46,7 @@ export default class WidgetFactory{
4546
const component = widgetConfig.component;
4647
switch (component) {
4748
case "PythonConsole": {
48-
return <PythonConsole pythonNotebookPath={"notebooks/notebook.ipynb"} />;
49+
return <NetPyNEPythonConsole />;
4950
}
5051
case "D3Canvas":
5152
return <NetPyNEInstantiated/>

‎webapp/components/layout/simulateLayoutConf.json‎

Lines changed: 86 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,86 @@
1+
{
2+
"global": {
3+
"sideBorders": 8,
4+
"tabSetHeaderHeight": 26,
5+
"tabSetTabStripHeight": 26,
6+
"enableEdgeDock": false
7+
},
8+
"layout": {
9+
"type": "tabset",
10+
"weight": 100,
11+
"id": "root",
12+
"children": [
13+
{
14+
"type": "row",
15+
"weight": 10,
16+
"children": [
17+
{
18+
"type": "tabset",
19+
"weight": 100,
20+
"id": "leftPanel",
21+
"enableDeleteWhenEmpty": false,
22+
"children": []
23+
}
24+
]
25+
},
26+
{
27+
"type": "row",
28+
"weight": 40,
29+
"children": [
30+
{
31+
"type": "tabset",
32+
"weight": 100,
33+
"id": "middlePanel",
34+
"enableDeleteWhenEmpty": false,
35+
"children": []
36+
}
37+
]
38+
},
39+
{
40+
"type": "row",
41+
"weight": 50,
42+
"children": [
43+
{
44+
"type": "row",
45+
"weight": 80,
46+
"children": [
47+
{
48+
"type": "tabset",
49+
"weight": 100,
50+
"id": "rightPanel",
51+
"enableDeleteWhenEmpty": false,
52+
"children": [
53+
]
54+
}
55+
]
56+
},
57+
{
58+
"type": "row",
59+
"weight": 20,
60+
"children": [
61+
{
62+
"type": "tabset",
63+
"weight": 100,
64+
"id": "consolePanel",
65+
"enableDeleteWhenEmpty": false,
66+
"children": [
67+
]
68+
}
69+
]
70+
}
71+
72+
]
73+
}
74+
]
75+
},
76+
"borders": [
77+
{
78+
"type": "border",
79+
"location": "bottom",
80+
"size": 100,
81+
"children": [],
82+
"barSize": 10
83+
}
84+
]
85+
}
86+

0 commit comments

Comments
 (0)