#142 Layout refactor half working

Author: filippomc

webapp/components/NetPyNE.js

@@ -7,7 +7,7 @@ import {
 } from "netpyne/components";
 
 import { withStyles } from '@material-ui/core/styles'
-
+import Utils from '../Utils';
 const styles = ({ zIndex, palette, spacing }) => ({
   root: { height: '100%', overflow: 'hidden' },
   container: {
@@ -18,7 +18,12 @@ const styles = ({ zIndex, palette, spacing }) => ({
   },
   topbar: { position: "relative", zIndex: zIndex.drawer + 1 },
   content: { flexGrow:1, display: 'flex', flexDirection: 'row', position: 'relative' }
-})
+});
+
+import {
+  DEFAULT_HLS_WIDGETS, getPythonDefaultConsoleWidget, 
+  DEFAULT_MORPHOLOGY_WIDGET,DEFAULT_PLOTS_WIDGETS
+} from '../constants'
 
 
 class NetPyNE extends React.Component {
@@ -28,8 +33,32 @@ class NetPyNE extends React.Component {
     this.props.pythonCallErrorDialogBox(payload)
   }
 
+  addMetadataToWindow (data) {
+    console.log("Initialising NetPyNE Tabs");
+    window.metadata = data.metadata;
+    window.currentFolder = data.currentFolder;
+    window.isDocker = data.isDocker;
+    window.pythonConsoleLoaded = true
+  }
+
   componentDidMount () {
-    GEPPETTO.on(GEPPETTO.Events.Error_while_exec_python_command, this.openPythonCallDialog, this)
+    GEPPETTO.on(GEPPETTO.Events.Error_while_exec_python_command, this.openPythonCallDialog, this);
+    this.props.addWidgets([getPythonDefaultConsoleWidget(true) ]);
+    GEPPETTO.on('jupyter_geppetto_extension_ready', data => {
+      let project = { id: 1, name: 'Project', experiments: [{ "id": 1, "name": 'Experiment', "status": 'DESIGN' }] }
+      GEPPETTO.Manager.loadProject(project, false);
+      GEPPETTO.Manager.loadExperiment(1, [], []);
+      Utils.execPythonMessage('from netpyne_ui.netpyne_geppetto import netpyne_geppetto');
+      Utils.evalPythonMessage('netpyne_geppetto.getData',[]).then(response => {
+        const data = Utils.convertToJSON(response);
+        this.addMetadataToWindow(data);
+        this.props.modelLoaded();
+        this.props.addWidgets(Object.values(DEFAULT_HLS_WIDGETS));
+        GEPPETTO.trigger("spinner:hide");
+      })
+      
+    });
+    
   }
 
   componentWillUnmount () {
@@ -38,6 +67,7 @@ class NetPyNE extends React.Component {
 
   render () {
     const { classes } = this.props
+    const Layout = LayoutManager();
     return (
       <div className={classes.root}>
         <div className={classes.container}>
@@ -46,7 +76,7 @@ class NetPyNE extends React.Component {
           </div>
           <div className={classes.content}>
             <Drawer/>
-            <LayoutManager/>
+            <Layout />
           </div>
         </div>
       </div>

webapp/components/general/NetPyNEPythonConsole.js

@@ -1,37 +1,19 @@
 import React, { Component } from 'react'
-import Utils from '../../Utils'
 
 import PythonConsole from '@geppettoengine/geppetto-client/js/components/interface/pythonConsole/PythonConsole';
 
 export default class NetPyNEPythonConsole extends Component {
 
-  addMetadataToWindow (data) {
-    console.log("Initialising NetPyNE Tabs");
-    window.metadata = data.metadata;
-    window.currentFolder = data.currentFolder;
-    window.isDocker = data.isDocker;
-    window.pythonConsoleLoaded = true
-  }
+  
 
   componentWillUnmount () {
     console.log("unmounting python console")
   }
 
   componentDidMount () {
-    if (!window.pythonConsoleLoaded) {
-      GEPPETTO.on('jupyter_geppetto_extension_ready', data => {
-        let project = { id: 1, name: 'Project', experiments: [{ "id": 1, "name": 'Experiment', "status": 'DESIGN' }] }
-        GEPPETTO.Manager.loadProject(project, false);
-        GEPPETTO.Manager.loadExperiment(1, [], []);
-        Utils.execPythonMessage('from netpyne_ui.netpyne_geppetto import netpyne_geppetto');
-        Utils.evalPythonMessage('netpyne_geppetto.getData',[]).then(response => {
-          const data = Utils.convertToJSON(response);
-          this.addMetadataToWindow(data)
-          this.props.modelLoaded();
-          GEPPETTO.trigger("spinner:hide");
-        })
-      });
-    }
+
+  
+    
 
   }
   render () {

webapp/components/index.js

@@ -4,7 +4,7 @@ import PythonControlledCapability from "geppetto-client/js/communication/geppett
 
 import {
   activateWidget,
-  destroyWidget,
+  addWidgets,
   minimizeWidget,
   maximizeWidget,
   updateWidget,
@@ -80,7 +80,13 @@ export const Dimensions = connect(
 import _NetPyNE from "./NetPyNE";
 export const NetPyNE = connect(
   state => ({ editMode: state.general.editMode }),
-  pythonCallErrorDispatch
+  dispatch => ({ 
+    pythonCallErrorDialogBox: payload => dispatch(openBackendErrorDialog(payload)),
+    addWidgets: payload => dispatch(addWidgets(payload)),
+    modelLoaded: () => dispatch(modelLoaded), 
+    newWidget: widget => dispatch(newWidget(widget)),
+    activateWidget: widgetId => dispatch(activateWidget(widgetId))
+  })
 )(_NetPyNE);
 
 import _NetPyNECellRule from "./definition/cellRules/NetPyNECellRule";
@@ -90,17 +96,10 @@ export const NetPyNECellRule = connect((state, ownProps) => ({
 }))(_NetPyNECellRule);
 
 
-import _LayoutManager from "./layout/LayoutManager";
-export const LayoutManager = connect(
-  state => ({ ...state.layout, editMode: state.general.editMode }),
-  dispatch => ({
-    updateWidget: widget => dispatch(updateWidget(widget)),
-    minimizeWidget: id => dispatch(minimizeWidget(id)),
-    destroyWidget: id => dispatch(destroyWidget(id)),
-    maximizeWidget: id => dispatch(maximizeWidget(id)),
-    activateWidget: id => dispatch(activateWidget(id))
-  })
-)(_LayoutManager);
+import { getInstance as getLayoutManagerInstance } from "./layout/LayoutManager";
+export const LayoutManager = () => connect(state => ({
+  layout: state.layout,
+}))(getLayoutManagerInstance().getComponent());
 
 
 import _NetPyNEPopulation from "./definition/populations/NetPyNEPopulation";
@@ -196,22 +195,16 @@ export const ActionDialog = connect(
   })
 )(_ActionDialog)
 
-import _NetPyNEPythonConsole from './general/NetPyNEPythonConsole'
+import _NetPyNEPythonConsole from './general/NetPyNEPythonConsole';
 export const NetPyNEPythonConsole = connect(
   null,
-  dispatch => ({ 
-    modelLoaded: () => dispatch(modelLoaded), 
-    newWidget: widget => dispatch(newWidget(widget)),
-    activateWidget: widgetId => dispatch(activateWidget(widgetId))
-  })
+  null
 )(_NetPyNEPythonConsole)
 
+
 import _Drawer from './settings/Drawer'
 export const Drawer = connect(
-  state => ({ 
-    widgets: state.flexlayout.widgets,
-    editMode: state.general.editMode 
-  }),
+  state => ({ editMode: state.general.editMode,  layout: state.layout }),
   dispatch => ({ 
     updateWidget: newConf => dispatch(updateWidget(newConf)),
     newWidget: widget => dispatch(newWidget(widget)),