Fix parsing error. (#1801)

* Fix parsing error. * Fix bound bug by using the auto-resize ui-grid module. (#1802) * Fix bound bug by using the auto-resize ui-grid module. * Remove unused dependency. * Fix unit test. * Jkmarx/data set 2 fix button hide (#1804) * Show tool icon when selected. * Fix hidden button bug. * Add styles.
refinery-platform · Jun 16, 2017 · 6061a0d · 6061a0d
1 parent eb6a20d
commit 6061a0d
Show file tree

Hide file tree

Showing 10 changed files with 43 additions and 21 deletions.
diff --git a/refinery/ui/source/js/file-browser/ctrls/ctrl.js b/refinery/ui/source/js/file-browser/ctrls/ctrl.js
@@ -339,12 +339,12 @@
     function toggleToolPanel () {
       if (toolService.isToolPanelCollapsed) {
         toolService.isToolPanelCollapsed = false;
-        vm.collapsedToolPanel = toolService.isToolPanelCollapsed;
       } else {
         toolService.isToolPanelCollapsed = true;
-        vm.collapsedToolPanel = toolService.isToolPanelCollapsed;
-        resetGridService.setRefreshGridFlag(true);
       }
+      // resize window with toggling
+      vm.collapsedToolPanel = toolService.isToolPanelCollapsed;
+      vm.gridApi.core.handleWindowResize();
     }
 
     // Helper method which check for any data updates during soft loads (tabbing)

diff --git a/refinery/ui/source/js/file-browser/ctrls/ctrl.spec.js b/refinery/ui/source/js/file-browser/ctrls/ctrl.spec.js
@@ -35,6 +35,15 @@
     });
 
     describe('Toggle Tool Panel', function () {
+      beforeEach(inject(function () {
+        var mockGridApi = {
+          handleWindowResize: function () { return; }
+        };
+        ctrl.gridApi = angular.copy({
+          core: {}
+        });
+        angular.copy(mockGridApi, ctrl.gridApi.core);
+      }));
       it('toggleToolPanel is method', function () {
         expect(angular.isFunction(ctrl.toggleToolPanel)).toBe(true);
       });

diff --git a/refinery/ui/source/js/file-browser/directives/assay-filters.js b/refinery/ui/source/js/file-browser/directives/assay-filters.js
@@ -33,7 +33,7 @@
         // show even though the panel is collapsed
         scope.dropAttributePanel = function (e, attributeName, attributeObj) {
           e.preventDefault();
-          var escapeAttributeName = attributeName.replace(' ', '-');
+          var escapeAttributeName = attributeName.replace(/ /g, '-');
           var attributeTitle = angular.element(
             document.querySelector('#attribute-panel-' + escapeAttributeName)
           );
@@ -70,7 +70,8 @@
 
         // When panel is minimized, selected fields continue to show
         scope.showField = function (field, internalName, attributeName) {
-          var escapedAttributeName = attributeName.replace(' ', '-');
+          var escapedAttributeName = attributeName.replace(/ /g, '-');
+
           var selectedIndex = -1;
           if (selectedFilterService.attributeSelectedFields[internalName] !== undefined) {
             selectedIndex = selectedFilterService
@@ -92,7 +93,7 @@
             var encodedAttribute = selectedFilterService
               .stringifyAndEncodeAttributeObj(attributeInternalName, allFields[ind]);
             if (queryFields.indexOf(encodedAttribute) > -1) {
-              var escapeAttributeName = attributeName.replace(' ', '-');
+              var escapeAttributeName = attributeName.replace(/ /g, '-');
               var attributeTitle = angular.element(
               document.querySelector('#attribute-panel-' + escapeAttributeName)
               );

diff --git a/refinery/ui/source/js/file-browser/module.js b/refinery/ui/source/js/file-browser/module.js
@@ -11,11 +11,10 @@
 
   angular
     .module('refineryFileBrowser', [
-      'dndLists',
       'ui.grid',
-      'ui.grid.selection',
+      'ui.grid.autoResize',
       'ui.grid.infiniteScroll',
       'ui.grid.resizeColumns',
-      'ui.select'
+      'ui.select',
     ]);
 })();
diff --git a/refinery/ui/source/js/file-browser/module.spec.js b/refinery/ui/source/js/file-browser/module.spec.js
@@ -27,8 +27,8 @@
           expect(hasModule('ui.grid')).toEqual(true);
         });
 
-        it('should have "ui.grid.selection" as a dependency', function () {
-          expect(hasModule('ui.grid.selection')).toEqual(true);
+        it('should have "ui.grid.autoResize" as a dependency', function () {
+          expect(hasModule('ui.grid.autoResize')).toEqual(true);
         });
 
         it('should have "ui.grid.infiniteScroll" as a dependency', function () {
@@ -39,8 +39,8 @@
           expect(hasModule('ui.grid.resizeColumns')).toEqual(true);
         });
 
-        it('should have "dndLists" as a dependency', function () {
-          expect(hasModule('dndLists')).toEqual(true);
+        it('should have "ui.select" as a dependency', function () {
+          expect(hasModule('ui.select')).toEqual(true);
         });
       });
     });

diff --git a/refinery/ui/source/js/file-browser/partials/assay-files.html b/refinery/ui/source/js/file-browser/partials/assay-files.html
@@ -1,5 +1,6 @@
 <div id="assay-files-table"
   ui-grid="FBCtrl.gridOptions"
+  ui-grid-auto-resize
   ui-grid-infinite-scroll
   ui-grid-resize-columns
   class="grid">

diff --git a/refinery/ui/source/js/tool-launch/partials/tool-launch-button.html b/refinery/ui/source/js/tool-launch/partials/tool-launch-button.html
@@ -1,4 +1,4 @@
-<span class="p-l-1-3">
+<span id="tool-select-button">
   <button
     class="btn btn-primary btn-xs"
     ng-disabled="$ctrl.needMoreNodes()"

diff --git a/refinery/ui/source/js/tool-launch/partials/tool-select.html b/refinery/ui/source/js/tool-launch/partials/tool-select.html
@@ -1,17 +1,19 @@
 <ui-select
+  id="tool-select-drop-down"
   append-to-body="true"
   search-enabled="false"
   ng-model="$ctrl.selectedTool.select"
   on-select="$ctrl.updateTool($item)"
   theme="select2"
   class="ui-select-drop text-left">
    <ui-select-match placeholder="Select a tool">
-     <span ng-bind="$select.selected.name"></span>
+      <i class="{{tool.tool_type|toolTypeIcon}} p-r-1-4" aria-hidden="true"></i>{{
+     $select.selected.name }}
    </ui-select-match>
   <ui-select-choices
     position="down"
     repeat="tool in $ctrl.tools track by $index">
-     <i class="{{tool.tool_type|toolTypeIcon}}" aria-hidden="true"></i>{{ tool.name }}
+     <i class="{{tool.tool_type|toolTypeIcon}} p-r-1-4" aria-hidden="true"></i>{{ tool.name }}
   </ui-select-choices>
 </ui-select>
 

diff --git a/refinery/ui/source/js/tool-launch/views/tool-display.html b/refinery/ui/source/js/tool-launch/views/tool-display.html
@@ -5,7 +5,7 @@ <h2>
     </h2>
   </div>
 
-  <div>
+  <div id="tool-select-panel">
      <rp-tool-select></rp-tool-select>
      <rp-tool-launch-button></rp-tool-launch-button>
   </div>

diff --git a/refinery/ui/source/styles/file-browser.less b/refinery/ui/source/styles/file-browser.less
@@ -125,10 +125,6 @@
     padding-left: 5px;
     padding-right: 5px;
 
-    .ui-select-drop {
-      width: 150px;
-    }
-
     .ui-select-placeholder {
       display: inline;
     }
@@ -253,6 +249,20 @@
       -webkit-border-radius: 10px;
       border-radius: 10px;
   }
+
+  #tool-select-panel {
+    width: 100%;
+    #tool-select-drop-down {
+      width: 70%;
+    }
+    #tool-select-button {
+      margin-left: .1em;
+      margin-right: .5em;
+      margin-top: .1em;
+      float: right;
+    }
+  }
+
 }
 
 #tool-panel-show-button {