Merge branch 'develop' into card-layout-tweaks

RELEASE_NOTES.md

@@ -2,32 +2,24 @@
 The Narrative Interface allows users to craft KBase Narratives using a combination of GUI-based commands, Python and R scripts, and graphical output elements.
 
 This is built on the Jupyter Notebook v4.4.1 (more notes will follow).
-### Version 3.5.2
-- TASK-1089 - Import data slide out panel tracks what object is added to narrative. Add button turns into copy if objecct already exists. Add pop up when user copies and overrides exisiting object.
-- TASK-1094 - Fix overlapping cells and buttons issue in Firefox
-- TASK-1113/PUBLIC-148 - Import Panel scrolls if panel size is larger than screen size
-- TASK-1088 - Data Pane maintains filters after refresh due to changes in narritve
-- TASK-1114 - Add lock when editing name, that prevents data panel from refreshing with new data. Reliquenishes lock after 15 min if no activity.
-- Style Fixes
-    - Fix bold font display inconsistencies between different browsers
-    - Move tooltip in datapanel from covering buttons to the top
-- TASK-1158 - Standardize app and object cards in narrative and data panel
 
 
 ### Version 3.5.1
-- TASK-1117 - Add importer for FBAModels to staging area
+- TASK-1113/PUBLIC-148 - Import Panel scrolls if panel size is larger than screen size
+- TASK-1114 - Add lock when editing name, that prevents data panel from refreshing with new data. Relinquishes lock after 15 min if no activity.
 - TASK-1116 - Add PhenotypeSet importer to staging area
+- TASK-1117 - Add importer for FBAModels to staging area
+- TASK-1088 - Data Pane maintains filters after refresh due to changes in narrative
 - TASK-1089 - Import data slide out panel tracks what object is added to narrative. "Add" button turns into "copy" if object already exists. Add pop up when user copies and overrides existing object.
 - TASK-1094 - Fix overlapping cells and buttons issue in Firefox
-- TASK-1113/PUBLIC-148 - Import Panel scrolls if panel size is larger than screen size
-- TASK-1088 - Data Pane maintains filters after refresh due to changes in narrative
 - Style Fixes
     - Fix bold font display inconsistencies between different browsers
     - Move tooltip in data panel from covering buttons to the top
 - KBASE-4756 - Fix data type filtering in data panel slideout.
-- PTV-225 - Fixes sorting by type in data panel 
+- PTV-225 - Fixes sorting by type in data panel
 - PTV-535 - Fix RNA-seq viewer to properly handle multiple input types.
 - PUBLIC-123 - Fix incorrect reaction counts in FBA Model viewer
+- TASK-1158 - Standardize app and object cards in narrative and data panel
 
 ### Version 3.5.0
 - TASK-1054 - Create a new loading window with a set of tasks to load and connect to (treats the problem of slowly loading websockets, still probably needs some adjusting).

kbase-extension/static/kbase/config/staging_upload.json

@@ -14,7 +14,7 @@
         },
         {
             "id": "genbank_genome",
-            "name": "Genbank Genome"
+            "name": "GenBank Genome"
         },
         {
             "id": "gff_genome",

kbase-extension/static/kbase/css/kbaseNarrative.css

@@ -10,6 +10,30 @@
     text-overflow: ellipsis;
 }
 
+.kb-data-staging-footer {
+    font-family : "OxygenBold", Arial, sans-serif;
+    font-size : 105%;
+    text-align : center;
+    background-color : #EEEEEE;
+    height : 32px;
+    padding : 8px;
+}
+
+.kb-data-staging-metadata-list {
+  font-family : 'OxygenBold';
+  width : 115px;
+  display : inline-block;
+  font-size : 90%;
+}
+
+.kb-data-staging-metadata-file-lines {
+  white-space : pre;
+ overflow : scroll;
+ font-family : monospace;
+ font-size : 90%;
+ background-color : #DDDDDD
+}
+
 .kb-dropzone {
     border: 2px dashed #2196F3 !important;
     margin-bottom:5px;

kbase-extension/static/kbase/js/api/StagingServiceClient.js

@@ -19,6 +19,7 @@ define([
                 upload      : { method : 'post', path : 'upload' },
                 delete      : { method : 'delete', path : 'delete/${path}' },
                 rename      : { method : 'post', path : 'rename/${path}' },
+                decompress  : { method : 'patch', path : 'decompress/${path}' },
             }
         });
     };

kbase-extension/static/kbase/js/kbaseNarrative.js

@@ -733,13 +733,13 @@ define([
             // this.initSettingsDialog();
 
             this.updateDocumentVersion()
-            .then(function() {
-                // init the controller
-                return this.narrController.render();
-            }.bind(this))
-            .finally(function () {
-                this.sidePanel.render();
-            }.bind(this));
+                .then(function() {
+                    // init the controller
+                    return this.narrController.render();
+                }.bind(this))
+                .finally(function () {
+                    this.sidePanel.render();
+                }.bind(this));
             $([Jupyter.events]).trigger('loaded.Narrative');
             $([Jupyter.events]).on('kernel_ready.Kernel',
                 function () {

kbase-extension/static/kbase/js/util/timeFormat.js

@@ -236,6 +236,7 @@ define([], function() {
      * edited from: http://stackoverflow.com/questions/3177836/how-to-format-time-since-xxx-e-g-4-minutes-ago-similar-to-stack-exchange-site
      */
     function getTimeStampStr (objInfoTimeStamp, alwaysExact) {
+
         var date = new Date(objInfoTimeStamp);
         var seconds = Math.floor((new Date() - date) / 1000);
         if (seconds < 0) {
@@ -284,20 +285,36 @@ define([], function() {
             }
         }
         interval = Math.floor(seconds / 86400);
-        if (interval > 1) {
+        if (interval >= 1) {
             return pluralizeTimeStr(interval, 'day');
         }
         interval = Math.floor(seconds / 3600);
-        if (interval > 1) {
+        if (interval >= 1) {
             return pluralizeTimeStr(interval, 'hour');
         }
         interval = Math.floor(seconds / 60);
-        if (interval > 1) {
+        if (interval >= 1) {
             return pluralizeTimeStr(interval, 'minute');
         }
         return pluralizeTimeStr(Math.floor(seconds), 'second');
     }
 
+    // There was a request that the staging panel tighten up the display a little bit, which was using getTimeStampStr to format the age.
+    // So this function will just take the output of regular getTimeStampStr and shorten it up a little bit.
+    // * Replace "long" durations with shortened ones.
+    // * drop " ago" from the end.
+
+    function getShortTimeStampStr (objInfoTimeStamp, alwaysExact) {
+      var longTimeStampStr = getTimeStampStr(objInfoTimeStamp, alwaysExact);
+      longTimeStampStr = longTimeStampStr.replace(/month/, 'mon');
+      longTimeStampStr = longTimeStampStr.replace(/hour/, 'hr');
+      longTimeStampStr = longTimeStampStr.replace(/minute/, 'min');
+      longTimeStampStr = longTimeStampStr.replace(/second/, 'sec');
+      longTimeStampStr = longTimeStampStr.replace(/\s*ago\s*/, '');
+
+      return longTimeStampStr;
+    }
+
     /**
      * @private
      * @method
@@ -345,6 +362,7 @@ define([], function() {
         reformatDate: reformatDate,
         reformatISOTimeString: reformatISOTimeString,
         getTimeStampStr: getTimeStampStr,
+        getShortTimeStampStr : getShortTimeStampStr,
         readableTimestamp: readableTimestamp
     };
 });

kbase-extension/static/kbase/js/widgets/appWidgets2/input/dynamicDropdownInput.js

@@ -58,6 +58,7 @@ define([
                 root: runtime.config('services.staging_api_url.url'),
                 token: runtime.authToken()
             }),
+            userId = runtime.userId(),
             eventListeners = [];
 
         function makeInputControl() {
@@ -77,13 +78,19 @@ define([
         // CONTROL
         function getControlValue() {
             var control = ui.getElement('input-container.input'),
-                selected = control.selectedOptions;
-            if (selected.length === 0) {
-                return '';
+                selected = $(control).select2('data')[0];
+            if (!selected || !selected.subpath) {
+                // might have just started up, and we don't have a selection value, but
+                // we might have a model value.
+                var modelVal = getModelValue();
+                if (modelVal) {
+                    return modelVal;
+                }
+                else {
+                    return '';
+                }
             }
-            // we are modeling a single string value, so we always just get the
-            // first selected element, which is all there should be!
-            return selected.item(0).value;
+            return selected.subpath;
         }
 
         /**
@@ -123,6 +130,7 @@ define([
 
         function validate() {
             return Promise.try(function() {
+
                 var selectedItem = getControlValue(),
                     validationConstraints = {
                         min_length: spec.data.constraints.min_length,
@@ -136,11 +144,17 @@ define([
         function fetchData(searchTerm) {
             searchTerm = searchTerm || '';
             if (dataSource === 'ftp_staging') {
-                return Promise.resolve(stagingService.search({path: searchTerm}))
+                return Promise.resolve(stagingService.search({query: searchTerm}))
                     .then(function(results) {
                         results = JSON.parse(results).filter(function(file) {
                             return !file.isFolder;
                         });
+                        results.forEach(function(file) {
+                            file.text = file.path;
+                            file.subdir = file.path.substring(0, file.path.length - file.name.length);
+                            file.subpath = file.path.substring(userId.length + 1);
+                            file.id = file.subpath;
+                        });
                         return results;
                     });
             } else {
@@ -216,17 +230,13 @@ define([
                         if (!object.id) {
                             return object.text;
                         }
-                        return object.id; //model.availableValues[object.id].path;
+                        return object.id;
                     },
                     ajax: {
                         delay: 250,
                         transport: function(params, success, failure) {
                             return fetchData(params.data.term)
                                 .then(function(data) {
-                                    data.forEach(function(file) {
-                                        file.id = file.path;
-                                        file.text = file.path;
-                                    });
                                     success({results: data});
                                 })
                                 .catch(function(err) {

kbase-extension/static/kbase/js/widgets/narrative_core/kbaseNarrativeDataPanel.js

@@ -197,6 +197,7 @@ define([
                 })
                 .append('<span class="fa fa-arrow-right"></span>')
                 .click(function () {
+                    this.$slideoutBtn.children().toggleClass('fa-arrow-right fa-arrow-left');
                     this.$slideoutBtn.tooltip('hide');
                     this.trigger('hideGalleryPanelOverlay.Narrative');
                     this.trigger('toggleSidePanelOverlay.Narrative', this.$overlayPanel);
@@ -549,6 +550,7 @@ define([
             var serviceClient = new GenericClient(Config.url('service_wizard'), auth);
 
             closeBtn.click(function () {
+                self.$slideoutBtn.children().toggleClass('fa-arrow-right fa-arrow-left');
                 self.trigger('hideSidePanelOverlay.Narrative');
             });
             footer.append(closeBtn);