Iss860 empty submit iss861 irregular org

src/client/components/editor/submit.js

@@ -1,17 +1,27 @@
+import EventEmitter from 'eventemitter3';
+
 import { TaskView } from '../tasks';
 import Popover from '../popover/popover';
 import { makeClassList } from '../../../util';
 import h from 'react-hyperscript';
 
 export const Submit = props => {
+
+  const emitter = new EventEmitter();
   const { document, bus, controller } = props;
 
   if( !document.editable() ){
     return null;
   }
 
+  // emitter.on('close', () => { console.log( 'close triggered'); });
+
   return h('div.editor-submit', [
-    h(Popover, { tippy: { html: h(TaskView, { document, bus, controller } ) } }, [
+    h(Popover, {
+      tippy: {
+        html: h(TaskView, { document, bus, controller, emitter } )
+      }
+    }, [
       h('button.editor-submit-button', {
         disabled: document.trashed(),
         className: makeClassList({

src/client/components/tasks.js

@@ -8,7 +8,7 @@ import { BASE_URL } from '../../config';
 import { makeClassList } from '../../util';
 import { NativeShare, isNativeShareSupported } from './native-share';
 
-const eleEvts = [ 'rename', 'complete', 'uncomplete' ];
+const eleEvts = [ 'rename', 'complete', 'uncomplete', 'associate' ];
 
 let bindEleEvts = (ele, cb) => {
   eleEvts.forEach(evt => {
@@ -114,36 +114,118 @@ class TaskView extends DataComponent {
   }
 
   render(){
-    let { document, bus } = this.props;
+    let { document, bus, emitter } = this.props;
     let { submitting } = this.state;
     let done = this.props.controller.done();
-    let incompleteEles = this.props.document.elements().filter(ele => {
-      return !ele.completed() && !ele.isInteraction() && ele.type() !== ENTITY_TYPE.COMPLEX;
-    });
 
-    let ntfns = incompleteEles.map(ele => {
-      let entMsg = ele => `${ele.name() === '' ? 'unnamed entity' : ele.name() + (ele.completed() ? '' : '') }`;
-      let innerMsg = entMsg(ele);
+    const createTask = ( message, infos ) => {
+      return h('div.task-view-list', [
+        h('div.task-view-header', message),
+        h('div.task-view-items', [
+          h('ul', infos.map( ({ msg, ele }) => h('li', [
+            h('a.plain-link', {
+              onClick: () => bus.emit('opentip', ele)
+            }, msg)
+          ]) ))
+        ])
+      ]);
+    };
 
-      if( ele.isInteraction() ){
-        let participants = ele.participants();
-        innerMsg = `the interaction between ${participants.map(entMsg).join(' and ')}`;
-      }
+    let incompleteTasks = () => {
+      let incompleteEles = this.props.document.elements().filter(ele => {
+        return !ele.completed() && !ele.isInteraction() && ele.type() !== ENTITY_TYPE.COMPLEX;
+      });
 
-      return { ele, msg: innerMsg };
-    });
+      let taskItemInfos = incompleteEles.map(ele => {
+        let entMsg = ele => `${ele.name() === '' ? 'No name provided' : ele.name() + (ele.completed() ? '' : '') }`;
+        let innerMsg = entMsg(ele);
+
+        if( ele.isInteraction() ){
+          let participants = ele.participants();
+          innerMsg = `the interaction between ${participants.map(entMsg).join(' and ')}`;
+        }
+
+        return { ele, msg: innerMsg };
+      });
+
+      let hasTasks = incompleteEles.length > 0;
+      let tasksMsg = () => {
+        let numIncompleteEles = incompleteEles.length > 50 ? '50+' : incompleteEles.length;
+        if( numIncompleteEles === 0 ){
+          return `You have no outstanding tasks left`;
+        }
+
+        if( numIncompleteEles === 1 ){
+          return `You have 1 incomplete item:`;
+        }
+
+        return `You have ${numIncompleteEles} incomplete items:`;
+      };
+      let message = tasksMsg();
+
+      return hasTasks ? createTask( message, taskItemInfos ) : null;
+    };
+
+    let irregularOrgTasks = () => {
+      let tasks = null;
+      let taskItemEntities = document.irregularOrganismEntities();
+      let numTaskItemEntities = taskItemEntities.length;
+      let hasTasks = numTaskItemEntities > 0;
+
+
+      if ( hasTasks ) {
+        let taskMsg = `You added genes from organisms other than ${document.commonOrganism().name()}:`;
 
-    let tasksMsg = () => {
-      let numIncompleteEles = incompleteEles.length > 50 ? '50+' : incompleteEles.length;
-      if( numIncompleteEles === 0 ){
-        return `You have no outstanding tasks left`;
+        let getTaskInfo = ele => {
+          let entMsg = ele => `${ele.name()} [${ele.organism().name()}]`;
+          let innerMsg = entMsg(ele);
+          return { ele, msg: innerMsg };
+        };
+
+        let taskItemInfos = taskItemEntities.map( getTaskInfo );
+        tasks = createTask( taskMsg, taskItemInfos );
       }
 
-      if( numIncompleteEles === 1 ){
-        return `You have 1 incomplete item:`;
+      return tasks;
+    };
+
+    let taskList = () => {
+      let tasks = [ irregularOrgTasks(), incompleteTasks() ];
+      let hasTasks = tasks.some( task => task != null );
+      return hasTasks ? h('div.task-view-task-list', [
+        h('div.task-view-task-list-title', 'Warnings'),
+        ...tasks,
+        h('hr')
+      ]): null;
+    };
+
+    // Minimal criteria: > 0 elements
+    let confirm = () => {
+      let taskMsg = 'Are you sure you want to submit?';
+      let taskButton = h('button.salient-button', {
+        disabled: document.trashed(),
+        onClick: () => this.submit()
+      }, 'Yes, submit');
+
+      const entities = document.entities();
+      let hasEntity = entities.length;
+
+      const close = () => emitter.emit('close');
+
+      if( !hasEntity ){
+        taskMsg = 'Please draw your interactions then submit.';
+        taskButton = h('button.salient-button', {
+            onClick: () => {
+              bus.emit('togglehelp');
+              close();
+            }
+          }, 'Show me how');
       }
 
-      return `You have ${numIncompleteEles} incomplete items:`;
+      return h('div.task-view-confirm', [
+        h('div.task-view-confirm-message', [ taskMsg ]),
+        h('div.task-view-confirm-button-area', [ taskButton ])
+      ]);
     };
 
     if( !done || submitting ){
@@ -154,21 +236,8 @@ class TaskView extends DataComponent {
         h('div.task-view-submit',{
           className: makeClassList({ 'task-view-submitting': submitting })
         }, [
-          incompleteEles.length > 0 ? h('div.task-view-header', tasksMsg()) : null,
-          incompleteEles.length > 0 ? h('div.task-view-items', [
-            h('ul', ntfns.map( ({ msg, ele }) => h('li', [
-              h('a.plain-link', {
-                onClick: () => bus.emit('opentip', ele)
-              }, msg)
-            ]) ))
-          ]) : null,
-          h('div.task-view-confirm', 'Are you sure you want to submit?'),
-          h('div.task-view-confirm-button-area', [
-            h('button.salient-button.task-view-confirm-button', {
-              disabled: document.trashed(),
-              onClick: () => this.submit()
-            }, 'Yes, submit')
-          ])
+          taskList(),
+          confirm()
         ])
       ]);
     } else {

src/model/element/entity.js

@@ -159,7 +159,7 @@ class Entity extends Element {
   organism(){
     const assoc = this.association();
 
-    if( !assoc ){ return null; } //  no org
+    if( !assoc || !assoc.organism ){ return null; } //  no org
 
     return Organism.fromId(assoc.organism);
   }
@@ -197,7 +197,7 @@ class Entity extends Element {
     if ( orgId ) {
       organism = { id: orgId, db: 'taxonomy' };
     }
-    
+
     let entity = { type, name, xref, organism };
 
     if ( type == ENTITY_TYPE.COMPLEX ) {

src/styles/tasks.css

@@ -29,20 +29,32 @@
   pointer-events: none;
 }
 
-.task-view-items {
-  margin-left: 1em;
+.task-view-task-list .task-view-task-list-title {
+  margin-bottom: 0.5em;
+  text-align: center;
+}
 
-  & li {
-    margin: 0;
-  }
+.task-view-list {
+  margin-bottom: 1em;
+  color: #555;
+  font-size: 0.95em;
+}
+
+.task-view-items ul {
+  margin-top: 0.2em;
+}
+
+.task-view-items li {
+  margin: 0;
 }
 
 .task-view-confirm {
-  margin-bottom: 1em;
+  color: #000;
 }
 
 .task-view-confirm-button-area {
   text-align: right;
+  margin: 0.5em auto 0.2em;
 }
 
 .task-view-done {
@@ -77,7 +89,7 @@
   }
 }
 
-.task-view-done hr {
+.task-view hr {
   width: 90%;
   border: 0;
   height: 0;