diff --git a/k8s/cf.yaml b/k8s/cf.yaml index 3d5a2e34..e41ad819 100644 --- a/k8s/cf.yaml +++ b/k8s/cf.yaml @@ -117,7 +117,7 @@ steps: debug: enabled: false - image: 'codefresh/cfstep-helm:2.12.2' + image: 'codefresh/cfstep-helm:2.15.2' title: Installing chart stage: deploy environment: diff --git a/utilities/install.py b/utilities/install.py index 01b441b3..7589d580 100644 --- a/utilities/install.py +++ b/utilities/install.py @@ -71,7 +71,7 @@ def main(argv): clone_repo(project='openworm', repo_name='geppetto-client', folder='geppetto-client', - default_branch='feature/178', + default_branch='feature/269', cwdp='webapp/', recursive=False, ) diff --git a/webapp/.eslintrc.js b/webapp/.eslintrc.js index c6e50b33..7e6f09b8 100644 --- a/webapp/.eslintrc.js +++ b/webapp/.eslintrc.js @@ -3,6 +3,9 @@ module.exports = { "./node_modules/@geppettoengine/geppetto-client/.eslintrc.js", "plugin:jest/recommended" ], + rules: { + 'multiline-comment-style': 0, + }, plugins: ["jest"], globals: { page: true, diff --git a/webapp/components/NetPyNE.js b/webapp/components/NetPyNE.js index bf94f613..c150266c 100644 --- a/webapp/components/NetPyNE.js +++ b/webapp/components/NetPyNE.js @@ -5,10 +5,10 @@ import { LayoutManager, Drawer } from "netpyne/components"; - +import Splash from './general/Splash' import { withStyles } from '@material-ui/core/styles' import Utils from '../Utils'; -const styles = ({ zIndex, palette, spacing }) => ({ +const styles = ({ zIndex }) => ({ root: { height: '100%', overflow: 'hidden' }, container: { height: "100%", @@ -17,7 +17,12 @@ const styles = ({ zIndex, palette, spacing }) => ({ flexDirection: "column" }, topbar: { position: "relative", zIndex: zIndex.drawer + 1 }, - content: { flexGrow:1, display: 'flex', flexDirection: 'row', position: 'relative' } + content: { + flexGrow:1, + display: 'flex', + flexDirection: 'row', + position: 'relative' + } }); import { EDIT_WIDGETS, PYTHON_CONSOLE_WIDGET, WidgetStatus } from '../constants' @@ -47,11 +52,12 @@ class NetPyNE extends React.Component { GEPPETTO.Manager.loadExperiment(1, [], []); Utils.execPythonMessage('from netpyne_ui.netpyne_geppetto import netpyne_geppetto'); Utils.evalPythonMessage('netpyne_geppetto.getData',[]).then(response => { + GEPPETTO.trigger(GEPPETTO.Events.Show_spinner, "LOADING NETPYNE-UI"); const data = Utils.convertToJSON(response); this.addMetadataToWindow(data); - this.props.modelLoaded(); this.props.setWidgets(EDIT_WIDGETS); - GEPPETTO.trigger("spinner:hide"); + this.props.modelLoaded(); + GEPPETTO.trigger(GEPPETTO.Events.Hide_spinner); }) }); diff --git a/webapp/components/definition/cellRules/NetPyNECellRule.js b/webapp/components/definition/cellRules/NetPyNECellRule.js index 1f09e530..bf2edd0c 100644 --- a/webapp/components/definition/cellRules/NetPyNECellRule.js +++ b/webapp/components/definition/cellRules/NetPyNECellRule.js @@ -3,7 +3,7 @@ import MenuItem from '@material-ui/core/MenuItem'; import TextField from '@material-ui/core/TextField'; import Button from '@material-ui/core/Button'; - +import Box from '@material-ui/core/Box' import Dialog from '@material-ui/core/Dialog/Dialog'; import DialogActions from '@material-ui/core/DialogActions'; @@ -13,8 +13,10 @@ import DialogTitle from '@material-ui/core/DialogTitle'; import { NetPyNESelectField, NetPyNEField, NetPyNECoordsRange } from 'netpyne/components'; import Utils from '../../../Utils'; +import ExpansionPanel from '../../general/ExpansionPanel' +import { withStyles } from "@material-ui/core/styles" -export default class NetPyNECellRule extends React.Component { +class NetPyNECellRule extends React.Component { constructor (props) { super(props); @@ -68,7 +70,7 @@ export default class NetPyNECellRule extends React.Component { } render () { - + const { classes } = this.props var dialogPop = (this.state.errorMessage != undefined ? ( -
+
-
- Conditions: -
- - - - - - - - - - + + Conditions (optional): + + + + + + + + + + + - - - - - - + + + +
{dialogPop}
); } } + + +const styles = ({ shape, spacing }) => ({ + expandable: { + borderRadius: shape.borderRadius, + backgroundColor: 'inherit', + paddingTop: spacing(2), + "&::before": { content: 'unset' } + }, + root: { + display: 'flex', + flexDirection: 'column' + } +}) + +export default withStyles(styles)(NetPyNECellRule) \ No newline at end of file diff --git a/webapp/components/definition/cellRules/NetPyNECellRules.js b/webapp/components/definition/cellRules/NetPyNECellRules.js index ef3d59e1..be0b44c7 100644 --- a/webapp/components/definition/cellRules/NetPyNECellRules.js +++ b/webapp/components/definition/cellRules/NetPyNECellRules.js @@ -3,7 +3,7 @@ import Button from '@material-ui/core/Button'; import ContentAdd from '@material-ui/icons/Add'; import NavigationMoreHoriz from '@material-ui/icons/MoreHoriz'; import Fab from '@material-ui/core/Fab'; - +import Icon from '@material-ui/core/Icon'; import { NetPyNECellRule, @@ -18,7 +18,7 @@ import NetPyNESection from './sections/NetPyNESection'; import NetPyNEMechanism from './sections/mechanisms/NetPyNEMechanism'; import NetPyNENewMechanism from './sections/mechanisms/NetPyNENewMechanism'; -import NavigationChevronRight from '@material-ui/icons/ChevronRight'; + import Dialog from '@material-ui/core/Dialog/Dialog'; import Utils from '../../../Utils'; @@ -154,10 +154,10 @@ export default class NetPyNECellRules extends React.Component { model[selectedCellRule].secs[selectedSection]['mechs'] = {}; Utils.execPythonMessage('netpyne_geppetto.netParams.cellParams["' + selectedCellRule + '"]["secs"]["' + selectedSection + '"]["mechs"] = {}'); } - var params = {}; Utils .evalPythonMessage("netpyne_geppetto.getMechParams", [mechanism]) .then(response => { + const params = {}; response.forEach(param => params[param] = 0); Utils.execPythonMessage('netpyne_geppetto.netParams.cellParams["' + selectedCellRule + '"]["secs"]["' + selectedSection + '"]["mechs"]["' + mechanism + '"] = ' + JSON.stringify(params)); }) @@ -343,7 +343,7 @@ export default class NetPyNECellRules extends React.Component { */ if (nextPage === page) { if (page === "main") { - this.handleNewCellRule({ 'CellRule': { 'conds':{}, 'secs':{} } }); + this.handleNewCellRule({ 'CellType': { 'conds':{}, 'secs':{} } }); } else if (page === "sections") { this.handleNewSection({ 'Section': { 'geom': {}, 'topol': {}, 'mechs': {} } }); } @@ -472,7 +472,7 @@ export default class NetPyNECellRules extends React.Component { switch (rule) { case 'cellRule': if (page !== 'main'){ - return 'CR' + return 'CT' } else { return } @@ -653,7 +653,7 @@ export default class NetPyNECellRules extends React.Component {
-
+
this.setState({ page: 'main', selectedCellRule: undefined, selectedSection: undefined, selectedMechanism: undefined })} @@ -670,9 +670,9 @@ export default class NetPyNECellRules extends React.Component {
-
@@ -693,9 +693,9 @@ export default class NetPyNECellRules extends React.Component {
-
) @@ -106,19 +106,19 @@ export default class NetPyNESection extends React.Component { content = (
- + - + - + - + @@ -136,17 +136,19 @@ export default class NetPyNESection extends React.Component { postProcessItems={this.postProcessMenuItems} /> -
-
@@ -166,7 +168,6 @@ export default class NetPyNESection extends React.Component { {bottomNavigationItems} -
{content}
); diff --git a/webapp/components/definition/cellRules/sections/mechanisms/NetPyNEMechanism.js b/webapp/components/definition/cellRules/sections/mechanisms/NetPyNEMechanism.js index 03580ddc..f251d64a 100644 --- a/webapp/components/definition/cellRules/sections/mechanisms/NetPyNEMechanism.js +++ b/webapp/components/definition/cellRules/sections/mechanisms/NetPyNEMechanism.js @@ -1,16 +1,10 @@ import React from 'react'; import TextField from '@material-ui/core/TextField'; import Utils from '../../../../../Utils'; -import { withStyles } from '@material-ui/core/styles'; -import { NetPyNETextField, } from 'netpyne/components'; +import Box from '@material-ui/core/Box' +import { NetPyNETextField } from 'netpyne/components'; -const styles = ({ spacing }) => ({ - fields: { - marginTop: spacing(3), - width: '100%' - } -}) -class NetPyNEMechanism extends React.Component { +export default class NetPyNEMechanism extends React.Component { constructor (props) { super(props); @@ -24,19 +18,32 @@ class NetPyNEMechanism extends React.Component { this.setState({ currentName: nextProps.name }); } - renderMechFields = classes => { + renderMechFields = () => { if (this.state.mechFields == '') { return
- } else { - var tag = "netParams.cellParams['" + this.props.cellRule + "']['secs']['" + this.props.section + "']['mechs']['" + this.state.currentName + "']" - return this.state.mechFields.map((name, i) => - - ) - } + } + + const { currentName } = this.state + const { cellRule, section, } = this.props + let tag = `netParams.cellParams['${cellRule}']['secs']['${section}']['mechs']['${currentName}']` + + return this.state.mechFields.map((name, i) => ( + + + + + )) + }; render () { - const { classes } = this.props var content = [] if (this.state.currentName != undefined && this.state.currentName != '') { Utils @@ -46,24 +53,23 @@ class NetPyNEMechanism extends React.Component { this.setState({ mechFields: response }) } }) - content.push(this.renderMechFields(classes)) + content.push(this.renderMechFields()) } return (
- -
+ + + + {content}
); } } -export default withStyles(styles)(NetPyNEMechanism) \ No newline at end of file diff --git a/webapp/components/definition/configuration/NetPyNESimConfig.js b/webapp/components/definition/configuration/NetPyNESimConfig.js index 797090a5..62043eda 100644 --- a/webapp/components/definition/configuration/NetPyNESimConfig.js +++ b/webapp/components/definition/configuration/NetPyNESimConfig.js @@ -37,15 +37,15 @@ class NetPyNESimConfig extends React.Component { contentLeft = (
- + - + - + @@ -125,18 +125,18 @@ class NetPyNESimConfig extends React.Component { contentLeft = (
- + { !window.isDocker && - + } - + @@ -144,7 +144,7 @@ class NetPyNESimConfig extends React.Component { - +
@@ -212,7 +212,7 @@ class NetPyNESimConfig extends React.Component { - +
@@ -232,23 +232,23 @@ class NetPyNESimConfig extends React.Component { var contentLeft = (
- + - + - + - + - + @@ -260,27 +260,27 @@ class NetPyNESimConfig extends React.Component { contentRight = (
- + - + - + - + - + - +
@@ -295,7 +295,7 @@ class NetPyNESimConfig extends React.Component { } onClick={() => this.select(2, 'SaveConfiguration')} /> } onClick={() => this.select(3, 'netParams')} /> - +
{contentLeft} {contentRight} @@ -307,12 +307,13 @@ class NetPyNESimConfig extends React.Component { } const styles = ({ shape, spacing }) => ({ - root: { height: `calc(100% - 56px - ${spacing(1)}px)` }, + root: { height: `calc(100% - 56px - ${spacing(1)}px)`, flexDirection: 'column' }, bottomNav: { borderRadius: shape.borderRadius, backgroundColor: bgDark, - marginBottom: spacing(1) + overflow: 'hidden' }, + layout: { height: "100%", display: 'flex' } }) diff --git a/webapp/components/definition/connectivity/NetPyNEConnectivityRule.js b/webapp/components/definition/connectivity/NetPyNEConnectivityRule.js index cb70bd22..235b9a00 100644 --- a/webapp/components/definition/connectivity/NetPyNEConnectivityRule.js +++ b/webapp/components/definition/connectivity/NetPyNEConnectivityRule.js @@ -10,6 +10,8 @@ import DialogContentText from "@material-ui/core/DialogContentText"; import DialogTitle from "@material-ui/core/DialogTitle"; import MenuItem from "@material-ui/core/MenuItem"; import Paper from '@material-ui/core/Paper' +import Box from '@material-ui/core/Box'; + import { NetPyNESelectField, NetPyNEField, @@ -100,47 +102,50 @@ export default class NetPyNEConnectivityRule extends React.Component { } render () { - var dialogPop - = this.state.errorMessage != undefined ? ( - - - {this.state.errorMessage} - - - - {this.state.errorDetails} - - - - - - - ) : ( - undefined - ); + + +
+ ) : ( + undefined + ); if (this.state.sectionId == "General") { var content = (
- + + + + pythonData.map(name => ( @@ -171,31 +177,31 @@ export default class NetPyNEConnectivityRule extends React.Component { - + - + - + - + - + - + - + {dialogPop}
@@ -222,6 +228,7 @@ export default class NetPyNEConnectivityRule extends React.Component { + this.props.name + "']['preConds']['cellModel']" } + fullWidth method={"netpyne_geppetto.getAvailableCellModels"} postProcessItems={this.postProcessMenuItems} multiple @@ -229,6 +236,7 @@ export default class NetPyNEConnectivityRule extends React.Component { @@ -311,6 +321,7 @@ export default class NetPyNEConnectivityRule extends React.Component { method={"netpyne_geppetto.getAvailableCellTypes"} postProcessItems={this.postProcessMenuItems} multiple + fullWidth /> @@ -383,10 +394,9 @@ export default class NetPyNEConnectivityRule extends React.Component { return (
- + {bottomNavigationItems} -
{content}
); diff --git a/webapp/components/definition/connectivity/NetPyNEConnectivityRules.js b/webapp/components/definition/connectivity/NetPyNEConnectivityRules.js index f405351e..6f65aae0 100644 --- a/webapp/components/definition/connectivity/NetPyNEConnectivityRules.js +++ b/webapp/components/definition/connectivity/NetPyNEConnectivityRules.js @@ -202,7 +202,7 @@ export default class NetPyNEConnectivityRules extends Component {
-
+
this.setState({ selectedConnectivityRule: undefined })} diff --git a/webapp/components/definition/plots/NetPyNEInclude.js b/webapp/components/definition/plots/NetPyNEInclude.js index 46d94e16..8f4c5048 100644 --- a/webapp/components/definition/plots/NetPyNEInclude.js +++ b/webapp/components/definition/plots/NetPyNEInclude.js @@ -345,6 +345,8 @@ export default class NetPyNEInclude extends Component { return
this.handleMainPopoverOpen(true, e.preventDefault(), e.currentTarget)} diff --git a/webapp/components/definition/plots/NetPyNEPlots.js b/webapp/components/definition/plots/NetPyNEPlots.js index 3583e4c1..88d4f4a4 100644 --- a/webapp/components/definition/plots/NetPyNEPlots.js +++ b/webapp/components/definition/plots/NetPyNEPlots.js @@ -123,7 +123,7 @@ export default class NetPyNEPlots extends React.Component {
-
+
diff --git a/webapp/components/definition/plots/TimeRange.js b/webapp/components/definition/plots/TimeRange.js index 4cd3c1bf..eed820b5 100644 --- a/webapp/components/definition/plots/TimeRange.js +++ b/webapp/components/definition/plots/TimeRange.js @@ -1,6 +1,5 @@ import React, { Component } from 'react'; import TextField from '@material-ui/core/TextField'; - import { AdapterComponent } from 'netpyne/components'; @@ -12,27 +11,25 @@ export default class TimeRange extends Component { render () { return ( -
- { - if (state[state.lastUpdated].toString().endsWith(".")) { - return undefined; - } - if (!isNaN(parseFloat(state.min)) && !isNaN(parseFloat(state.max))) { - return [parseFloat(state.min), parseFloat(state.max)]; - } - }} - convertFromPython={(prevProps, prevState, value) => { - if (value != undefined && prevProps.value != value && value != '') { - return { min: value[0], max: value[1] }; - } - }} - > - - - -
+ { + if (state[state.lastUpdated].toString().endsWith(".")) { + return undefined; + } + if (!isNaN(parseFloat(state.min)) && !isNaN(parseFloat(state.max))) { + return [parseFloat(state.min), parseFloat(state.max)]; + } + }} + convertFromPython={(prevProps, prevState, value) => { + if (value != undefined && prevProps.value != value && value != '') { + return { min: value[0], max: value[1] }; + } + }} + > + + + ); } } diff --git a/webapp/components/definition/plots/plotTypes/PlotGranger.js b/webapp/components/definition/plots/plotTypes/PlotGranger.js index bde57413..0193a3b4 100644 --- a/webapp/components/definition/plots/plotTypes/PlotGranger.js +++ b/webapp/components/definition/plots/plotTypes/PlotGranger.js @@ -35,11 +35,11 @@ export default class PlotGranger extends React.Component { - + - + @@ -47,7 +47,7 @@ export default class PlotGranger extends React.Component { - +
); diff --git a/webapp/components/definition/plots/plotTypes/PlotLFP.js b/webapp/components/definition/plots/plotTypes/PlotLFP.js index 4d61109f..23db9953 100644 --- a/webapp/components/definition/plots/plotTypes/PlotLFP.js +++ b/webapp/components/definition/plots/plotTypes/PlotLFP.js @@ -31,27 +31,27 @@ export default class PlotLFP extends React.Component { - + - + - + - + - + - + diff --git a/webapp/components/definition/plots/plotTypes/PlotRaster.js b/webapp/components/definition/plots/plotTypes/PlotRaster.js index 459bcc69..5ea28be9 100644 --- a/webapp/components/definition/plots/plotTypes/PlotRaster.js +++ b/webapp/components/definition/plots/plotTypes/PlotRaster.js @@ -37,7 +37,7 @@ export default class PlotRaster extends React.Component { - + @@ -53,7 +53,7 @@ export default class PlotRaster extends React.Component { - + diff --git a/webapp/components/definition/plots/plotTypes/PlotRatePSD.js b/webapp/components/definition/plots/plotTypes/PlotRatePSD.js index 87314892..9930a873 100644 --- a/webapp/components/definition/plots/plotTypes/PlotRatePSD.js +++ b/webapp/components/definition/plots/plotTypes/PlotRatePSD.js @@ -30,23 +30,23 @@ export default class PlotRatePSD extends React.Component { - + - + - + - + - + diff --git a/webapp/components/definition/plots/plotTypes/PlotShape.js b/webapp/components/definition/plots/plotTypes/PlotShape.js index ae836a0f..511bc56f 100644 --- a/webapp/components/definition/plots/plotTypes/PlotShape.js +++ b/webapp/components/definition/plots/plotTypes/PlotShape.js @@ -27,15 +27,15 @@ export default class PlotShape extends React.Component { - + - + - + @@ -51,7 +51,7 @@ export default class PlotShape extends React.Component { - + diff --git a/webapp/components/definition/plots/plotTypes/PlotSpikeHist.js b/webapp/components/definition/plots/plotTypes/PlotSpikeHist.js index d8ac2d86..ca84649f 100644 --- a/webapp/components/definition/plots/plotTypes/PlotSpikeHist.js +++ b/webapp/components/definition/plots/plotTypes/PlotSpikeHist.js @@ -31,7 +31,7 @@ export default class PlotSpikeHist extends React.Component { - + diff --git a/webapp/components/definition/populations/Dimensions.js b/webapp/components/definition/populations/Dimensions.js index 6e7b7235..72770ac8 100644 --- a/webapp/components/definition/populations/Dimensions.js +++ b/webapp/components/definition/populations/Dimensions.js @@ -1,9 +1,12 @@ import React, { Component } from 'react'; -import TextField from '@material-ui/core/TextField'; import Select from '@material-ui/core/Select'; import MenuItem from '@material-ui/core/MenuItem'; import Utils from '../../../Utils'; import { withStyles } from '@material-ui/core/styles'; +import Box from '@material-ui/core/Box' + +import InputLabel from '@material-ui/core/InputLabel'; +import FormControl from '@material-ui/core/FormControl'; import { NetPyNEField, @@ -11,10 +14,7 @@ import { } from 'netpyne/components'; const styles = ({ spacing }) => ({ - selectField: { - marginTop: spacing(3), - width: '100%' - }, + selectField: { width: '100%' }, field:{ width: '95%!important', marginLeft: spacing(3) @@ -102,38 +102,50 @@ class DimensionsComponent extends Component { return (
- + + + Dimension type + + + + { this.state.dimension != undefined && this.state.dimension != "" - ? - { - this.props.updateCards() - }} - /> - - : null + && ( + + + { + this.props.updateCards() + }} + /> + + + + ) }
) diff --git a/webapp/components/definition/populations/NetPyNEPopulation.js b/webapp/components/definition/populations/NetPyNEPopulation.js index 4706689c..000b500a 100644 --- a/webapp/components/definition/populations/NetPyNEPopulation.js +++ b/webapp/components/definition/populations/NetPyNEPopulation.js @@ -3,7 +3,7 @@ import TextField from '@material-ui/core/TextField'; import { BottomNavigation, BottomNavigationAction } from '@material-ui/core'; import FontIcon from '@material-ui/core/Icon'; import Utils from '../../../Utils'; - +import Box from '@material-ui/core/Box' import Dialog from '@material-ui/core/Dialog/Dialog'; import Button from '@material-ui/core/Button'; @@ -62,6 +62,7 @@ class NetPyNEPopulation extends React.Component { // Get Fields for new metadata cellModelFields = Utils.getFieldsFromMetadataTree(response, key => ( )); @@ -145,18 +146,23 @@ class NetPyNEPopulation extends React.Component { : undefined if (this.state.sectionId == "General") { var content = ( -
- +
+ + + + { Utils.evalPythonMessage("netpyne_geppetto.propagate_field_rename", ['cellType', newValue, oldValue]) this.props.updateCards() @@ -164,16 +170,6 @@ class NetPyNEPopulation extends React.Component { model={"netParams.popParams['" + this.props.name + "']['cellType']"} /> - - - { - Utils.evalPythonMessage("netpyne_geppetto.propagate_field_rename", ['cellModel', newValue, oldValue]) - this.props.updateCards() - }} - model={"netParams.popParams['" + this.props.name + "']['cellModel']"} - /> - {dialogPop} @@ -221,10 +217,9 @@ class NetPyNEPopulation extends React.Component { return (
- + {this.getModelParameters()} -
{content}
); diff --git a/webapp/components/definition/populations/NetPyNEPopulations.js b/webapp/components/definition/populations/NetPyNEPopulations.js index baf27e3d..5bb210ef 100644 --- a/webapp/components/definition/populations/NetPyNEPopulations.js +++ b/webapp/components/definition/populations/NetPyNEPopulations.js @@ -201,7 +201,7 @@ export default class NetPyNEPopulations extends React.Component {
-
+
this.setState({ selectedPopulation: undefined })} diff --git a/webapp/components/definition/stimulationSources/NetPyNEStimulationSource.js b/webapp/components/definition/stimulationSources/NetPyNEStimulationSource.js index 9aeb67af..41536586 100644 --- a/webapp/components/definition/stimulationSources/NetPyNEStimulationSource.js +++ b/webapp/components/definition/stimulationSources/NetPyNEStimulationSource.js @@ -1,8 +1,7 @@ import React from 'react'; import MenuItem from '@material-ui/core/MenuItem'; import TextField from '@material-ui/core/TextField'; -import Utils from '../../../Utils'; -import Select from '../../general/Select'; +import Box from '@material-ui/core/Box'; import Dialog from '@material-ui/core/Dialog/Dialog'; import Button from '@material-ui/core/Button'; @@ -13,11 +12,14 @@ import DialogContent from '@material-ui/core/DialogContent'; import DialogContentText from '@material-ui/core/DialogContentText'; import DialogTitle from '@material-ui/core/DialogTitle'; + import { NetPyNEField, NetPyNETextField, ListComponent } from 'netpyne/components'; +import Utils from '../../../Utils'; +import Select from '../../general/Select'; const styles = ({ spacing }) => ({ selectField: { @@ -144,18 +146,24 @@ class NetPyNEStimulationSource extends React.Component {
@@ -167,12 +175,16 @@ class NetPyNEStimulationSource extends React.Component {
@@ -191,12 +203,16 @@ class NetPyNEStimulationSource extends React.Component { @@ -207,24 +223,32 @@ class NetPyNEStimulationSource extends React.Component {
@@ -236,30 +260,40 @@ class NetPyNEStimulationSource extends React.Component {
@@ -282,6 +316,8 @@ class NetPyNEStimulationSource extends React.Component { @@ -295,19 +331,21 @@ class NetPyNEStimulationSource extends React.Component { return (
- -
+ + + +
-
+
this.setState({ selectedSynapse: undefined })} diff --git a/webapp/components/general/AdapterComponent.js b/webapp/components/general/AdapterComponent.js index 1ece2639..1c11c58c 100644 --- a/webapp/components/general/AdapterComponent.js +++ b/webapp/components/general/AdapterComponent.js @@ -1,5 +1,5 @@ import React, { Component } from 'react'; - +import Grid from '@material-ui/core/Grid'; /** * The adapter component provides a mechanism to group graphical components. * that act as a single component when communicating to python. @@ -60,9 +60,10 @@ export default class AdapterComponent extends Component { })); return ( -
- {childrenWithExtraProp} -
+ + {childrenWithExtraProp[0]} + {childrenWithExtraProp[1]} + ) } } \ No newline at end of file diff --git a/webapp/components/general/Checkbox.js b/webapp/components/general/Checkbox.js index d5dcb506..ef3ed2b3 100644 --- a/webapp/components/general/Checkbox.js +++ b/webapp/components/general/Checkbox.js @@ -1,22 +1,43 @@ import React, { Component } from 'react' +import Box from '@material-ui/core/Box' import FormGroup from '@material-ui/core/FormGroup'; -import FormControlLabel from '@material-ui/core/FormControlLabel'; import MuiCheckbox from '@material-ui/core/Checkbox'; +import FormControlLabel from '@material-ui/core/FormControlLabel'; + +import { bgLight } from '../../theme' export default class Checkbox extends Component { render () { + const { fullWidth, noBackground, styles } = this.props + const localStyle = fullWidth ? { width: '100%' } : {} + if (noBackground) { + localStyle.backgroundColor = 'inherit' + } + return ( - + + + + + } /> diff --git a/webapp/components/general/ExpansionPanel.js b/webapp/components/general/ExpansionPanel.js index 58695464..85be0a31 100644 --- a/webapp/components/general/ExpansionPanel.js +++ b/webapp/components/general/ExpansionPanel.js @@ -14,11 +14,11 @@ class NetPyNEExpansionPanel extends Component { state = { expanded: false } render () { - const { children, classes } = this.props + const { children, classes, ...others } = this.props const [summary, ...details] = children return ( - + this.setState({ expanded: !this.state.expanded }), diff --git a/webapp/components/general/FileBrowser.js b/webapp/components/general/FileBrowser.js index 63dd7ee8..59d3a9e8 100644 --- a/webapp/components/general/FileBrowser.js +++ b/webapp/components/general/FileBrowser.js @@ -4,14 +4,15 @@ import Utils from '../../Utils'; import Button from '@material-ui/core/Button'; import { changeNodeAtPath } from 'react-sortable-tree'; import Dialog from '@material-ui/core/Dialog'; - +import Box from '@material-ui/core/Box' +import Grid from '@material-ui/core/Grid' import DialogActions from '@material-ui/core/DialogActions'; import DialogContent from '@material-ui/core/DialogContent'; - +import { Tooltip } from 'netpyne/components' import IconButton from '@material-ui/core/IconButton'; import Icon from '@material-ui/core/Icon'; import { walk } from 'react-sortable-tree'; - +import { bgLight, fontColor } from '../../theme' export default class FileBrowser extends React.Component { constructor (props) { @@ -121,8 +122,7 @@ export default class FileBrowser extends React.Component { , + >CANCEL, + >SELECT ]; var selectMessage = this.props.exploreOnlyDirs ? "Select a folder. " : "Select a file. "; @@ -142,37 +142,39 @@ export default class FileBrowser extends React.Component { fullWidth maxWidth="sm" onClose={() => this.props.onRequestClose()} - style={{ zIndex: 5000 }} + style={{ zIndex: 1350 }} > -
- {selectMessage} - These paths are relative to:
-
- {this.currentFolder || window.currentFolder} + {`${selectMessage}Paths are relative to:`} + + + + {this.currentFolder || window.currentFolder} + + + this.handleMoveUp()} - tooltip-data='Enclosing Folder' > - + + + + this.handleMoveUp(true)} - tooltip-data='Home folder' > - + -
- -
- < Tree + + + + + ({ - container:{ height: 'calc(100% - 8px)', alignItems: 'stretch' }, - grid: { - flex: '1 0 0', - minWidth: 400, - minHeight: 350, - maxHeight: '100%', - marginRight: spacing(1), - marginBottom: spacing(1) - }, - paper: { height: '100%', backgroundColor: bgDark }, - root: { height: '100%', overflowY: 'visible', overflowX: 'hidden', marginRight: -spacing(1) } -})) - -export default function GridLayout ({ children }) { - const classes = useStyles() +export default function GridLayout ({ children, className = '' }) { // left-hand-side-top - left-hand-side-bottom - right-hand-side - others const [lhst, lhsb, rhs, ...others] = children return ( -
- +
+ - - - + + + {lhst} {lhsb} - - + + - - - - {[rhs]} - - - - + { rhs + ? + + + {[rhs]} + + + : '' + } {others}
) } - -const useComponentStyles = makeStyles(({ spacing }) => ({ - container: { - display: 'flex', - flexDirection: 'column', - height: '100%', - margin: `0px ${spacing(1)}px`, - paddingTop: spacing(1) - }, - element: { - overflowY:'auto', - overflowX:'hidden', - maxHeight: '100%', - // height: '100%' - } -})) - -function SingleComponent ({ children = [] }) { - const classes = useComponentStyles() - const [topChild, ...otherChildren] = children - - return ( -
-
- {otherChildren.length > 0 ? topChild : null} -
- -
- {otherChildren.length > 0 ? otherChildren : topChild} -
-
- ) - -} \ No newline at end of file diff --git a/webapp/components/general/List.js b/webapp/components/general/List.js index 2a9c7664..fb27457e 100644 --- a/webapp/components/general/List.js +++ b/webapp/components/general/List.js @@ -1,12 +1,17 @@ import React, { Component } from 'react'; import TextField from '@material-ui/core/TextField'; import IconButton from '@material-ui/core/IconButton'; -import Icon from '@material-ui/core/Icon'; + import Tooltip from './Tooltip' +import Chip from '@material-ui/core/Chip' +import Grid from '@material-ui/core/Grid' +import NetPyNEIcon from '../general/NetPyNEIcons'; +import Box from '@material-ui/core/Box' +import { withStyles } from '@material-ui/core/styles' /** * Generic List/Dict Component */ -export default class ListComponent extends Component { +class ListComponent extends Component { constructor (props) { super(props); @@ -31,6 +36,9 @@ export default class ListComponent extends Component { valid = false; } }); + if (value.endsWith(',')) { + valid = false; + } break; case 'dict': var valid = (value.match(/:/g) || []).length == 1 && !value.startsWith(':') && !value.endsWith(':'); @@ -207,67 +215,39 @@ export default class ListComponent extends Component { } else { var value = this.state.children[key]; } - return ( -
- - this.removeChild(key)} - tooltip-data='Remove item from the list' - > - - -
- ) + return this.removeChild(key)} color="primary" /> }); + const { classes } = this.props return ( -
-
- e.key === 'Enter' ? this.addChild() : null } - value={this.state.newItemValue} - style={{ width: '100%' }} - helperText={this.state.newItemErrorText} - /> - {!this.state.newItemErrorText - && ( - + + e.key === 'Enter' ? this.addChild() : null } + value={this.state.newItemValue} + fullWidth + helperText={this.state.newItemErrorText} + InputProps={{ + endAdornment: ( - - + + - - - - ) - } -
- + + ) + }} + /> + {childrenWithExtraProp} - {childrenWithExtraProp.length > 0 && ( -
- {childrenWithExtraProp} -
- )} -
+ ) } } + + +const styles = () => ({ addButton: { height: 48 } }) + +export default withStyles(styles)(ListComponent) \ No newline at end of file diff --git a/webapp/components/general/NetPyNECoordsRange.js b/webapp/components/general/NetPyNECoordsRange.js index 68958c53..be692f3f 100644 --- a/webapp/components/general/NetPyNECoordsRange.js +++ b/webapp/components/general/NetPyNECoordsRange.js @@ -1,7 +1,7 @@ import React, { Component } from 'react'; import MenuItem from '@material-ui/core/MenuItem'; import TextField from '@material-ui/core/TextField'; - +import Box from '@material-ui/core/Box' import SelectField from './Select'; import Utils from '../../Utils'; @@ -102,7 +102,7 @@ export default class NetPyNECoordsRange extends Component { {(this.state.rangeType != undefined) - ?
+ ? { @@ -122,12 +122,11 @@ export default class NetPyNECoordsRange extends Component { } } > - - + + -
+ : null} -
); } diff --git a/webapp/components/general/NetPyNEField.js b/webapp/components/general/NetPyNEField.js index fb3ceb17..970659af 100644 --- a/webapp/components/general/NetPyNEField.js +++ b/webapp/components/general/NetPyNEField.js @@ -9,6 +9,9 @@ import DialogActions from '@material-ui/core/DialogActions'; import DialogContent from '@material-ui/core/DialogContent'; import DialogContentText from '@material-ui/core/DialogContentText'; import DialogTitle from '@material-ui/core/DialogTitle'; +import { Tooltip } from 'netpyne/components' +import Grid from '@material-ui/core/Grid' +import Box from '@material-ui/core/Box' export default class NetPyNEField extends Component { constructor (props) { @@ -65,12 +68,16 @@ export default class NetPyNEField extends Component { var help = Utils.getMetadataField(this.props.id, "help"); if (help != undefined && help != '') { var helpComponent = ( -
-