Fix widget context menu

Add protection to not create projects with having any valid simulation

src/components/widget-factory.js

@@ -74,8 +74,8 @@ class WidgetFactory {
                 widget.time = 60;
                 break;
             case 'Image':
-                widget.minWidth = 100;
-                widget.minHeight = 100;
+                widget.minWidth = 20;
+                widget.minHeight = 20;
                 widget.width = 200;
                 widget.height = 200;
                 widget.lockAspect = true;

src/containers/projects.js

@@ -107,6 +107,14 @@ class Projects extends React.Component {
     return id;
   }
 
+  hasValidSimulation() {
+    const simulations = this.state.simulations.filter(simulation => {
+      return simulation.models.length > 0;
+    });
+    
+    return simulations.length > 0;
+  }
+
   render() {
     return (
       <div className='section'>
@@ -118,10 +126,13 @@ class Projects extends React.Component {
           <TableColumn width='70' editButton deleteButton onEdit={index => this.setState({ editModal: true, modalData: this.state.projects[index] })} onDelete={index => this.setState({ deleteModal: true, modalData: this.state.projects[index] })} />
         </Table>
 
-        <Button onClick={() => this.setState({ newModal: true })}><Glyphicon glyph='plus' /> Project</Button>
+        <Button onClick={() => this.setState({ newModal: true })} disabled={!this.hasValidSimulation()}><Glyphicon glyph='plus' /> Project</Button>
+
+        {!this.hasValidSimulation() &&
+          <span><i> Simulation with at least one simulation-model required!</i></span>
+        }
 
         <NewProjectDialog show={this.state.newModal} onClose={(data) => this.closeNewModal(data)} simulations={this.state.simulations} />
-
         <EditProjectDialog show={this.state.editModal} onClose={(data) => this.closeEditModal(data)} project={this.state.modalData} simulations={this.state.simulations} />
 
         <Modal show={this.state.deleteModal}>

src/containers/widget.js

@@ -50,7 +50,6 @@ class Widget extends Component {
   }
 
   static calculateState(prevState) {
-
     let tokenState = UserStore.getState().token;
 
     if (prevState) {
@@ -149,7 +148,7 @@ class Widget extends Component {
     // get widget element
     const widget = this.props.data;
     let borderedWidget = false;
-    var element = null;
+    let element = null;
 
     // dummy is passed to widgets to keep updating them while in edit mode
     if (widget.type === 'Value') {
@@ -180,7 +179,7 @@ class Widget extends Component {
       'widget': !this.props.editing,
       'editing-widget': this.props.editing,
       'border': borderedWidget,
-      'unselectable': this.props.editing,
+      'unselectable': false,
       'locked': widget.locked && this.props.editing
     });
 

src/styles/context-menu.css

@@ -74,7 +74,12 @@ padding: 0;
   right: 7px;
 }
 
-.example-multiple-targets::after {
-  content: attr(data-count);
-  display: block;
+.react-contextmenu-wrapper {
+  width: 100%;
+  height: 100%;
+  position: absolute;
+  top: 0px;
+  left: 0px;
+  overflow: auto;
 }
+