Mccalluc/user files csv filtering (#2041)

* The files partial now includes the download link; download link uses a controller function * Params will be reused... pull into its own service * Checkpoint: url updates, but need to do it the right way * serialize url the right way
refinery-platform · Aug 24, 2017 · 0139c1e · 0139c1e
1 parent 9cf5019
commit 0139c1e
Show file tree

Hide file tree

Showing 5 changed files with 74 additions and 47 deletions.
diff --git a/refinery/ui/source/js/user-file-browser/ctrls/user-file-browser-files-ctrl.js b/refinery/ui/source/js/user-file-browser/ctrls/user-file-browser-files-ctrl.js
@@ -6,19 +6,21 @@
   .controller('UserFileBrowserFilesCtrl', UserFileBrowserFilesCtrl);
 
   UserFileBrowserFilesCtrl.$inject = [
+    '$httpParamSerializer',
     '$log',
     '$q',
     'userFileBrowserFactory',
-    'userFileFiltersService',
+    'userFileParamsService',
     'userFileSortsService',
     'gridOptionsService'
   ];
 
   function UserFileBrowserFilesCtrl (
+      $httpParamSerializer,
       $log,
       $q,
       userFileBrowserFactory,
-      userFileFiltersService,
+      userFileParamsService,
       userFileSortsService,
       gridOptionsService
   ) {
@@ -62,6 +64,12 @@
     };
 
     gridOptionsService.appScopeProvider = vm;
+    vm.downloadFilterQuery = function () {
+      return $httpParamSerializer({
+        fq: userFileParamsService.fq(),
+        sort: userFileParamsService.sort()
+      });
+    };
     vm.gridOptions = gridOptionsService;
     vm.gridOptions.onRegisterApi = function (api) {
       api.core.on.sortChanged(null, vm.sortChanged);

diff --git a/refinery/ui/source/js/user-file-browser/partials/user-file-browser-files.html b/refinery/ui/source/js/user-file-browser/partials/user-file-browser-files.html
@@ -1,5 +1,15 @@
-<div
-  ui-grid="$ctrl.gridOptions"
-  ui-grid-resize-columns
-  class="grid">
-</div>
+<div class="col-lg-10 col-md-10 col-sm-9" id="main-area">
+    <div>
+        <a href="/files_download?{{ $ctrl.downloadFilterQuery() }}"><i class="fa fa-arrow-circle-o-down"></i> Download as CSV</a>
+    </div>
+    <div class="m-r-1">
+        <!-- Bootstrap col classes are using the window width, not our inner div.
+             #table-filter has a margin-left, so do something similar on the other side -->
+        <!-- TODO: Why isn't it full height? -->
+        <div
+          ui-grid="$ctrl.gridOptions"
+          ui-grid-resize-columns
+          class="grid">
+        </div>
+    </div>
+</div>
diff --git a/refinery/ui/source/js/user-file-browser/services/user-file-params.js b/refinery/ui/source/js/user-file-browser/services/user-file-params.js
@@ -0,0 +1,45 @@
+(function () {
+  'use strict';
+  angular
+    .module('refineryApp')
+    .factory('userFileParamsService', userFileParamsService);
+
+  userFileParamsService.$inject = [
+    'userFileFiltersService',
+    'userFileSortsService'
+  ];
+
+  function userFileParamsService (
+      userFileFiltersService,
+      userFileSortsService
+  ) {
+    var characterSuffix = '_Characteristics_generic_s';
+    var factorSuffix = '_Factor_Value_generic_s';
+    var params = {
+      limit: 100, // Default is 100,000. Immutability make it hard in python.
+      fq: function () {
+        var filters = Object.keys(userFileFiltersService).map(function (key) {
+          var values = userFileFiltersService[key];
+          // TODO: escaping!
+          var orValues = values.map(function (value) {
+            return '(' +
+                key + characterSuffix + ':"' + value + '" OR ' +
+                key + factorSuffix + ':"' + value + '")';
+          }).join(' OR ');
+          return '(' + orValues + ')';
+        });
+        return filters.join(' AND ');
+      },
+      sort: function () {
+        return userFileSortsService.fields.map(function (field) {
+          var name = field.name;
+          var direction = field.direction;
+          return [
+            name + characterSuffix + ' ' + direction,
+            name + factorSuffix + ' ' + direction].join(', ');
+        }).join(', ');
+      }
+    };
+    return params;
+  }
+})();
diff --git a/refinery/ui/source/js/user-file-browser/services/user-file.js b/refinery/ui/source/js/user-file-browser/services/user-file.js
@@ -8,49 +8,21 @@
   userFileService.$inject = [
     '$resource',
     'settings',
-    'userFileFiltersService',
-    'userFileSortsService'
+    'userFileParamsService'
   ];
 
   function userFileService (
       $resource,
       settings,
-      userFileFiltersService,
-      userFileSortsService
+      userFileParamsService
   ) {
-    var characterSuffix = '_Characteristics_generic_s';
-    var factorSuffix = '_Factor_Value_generic_s';
     var userFile = $resource(
       settings.appRoot + settings.refineryApiV2 + '/files/',
       {},
       {
         query: {
           method: 'GET',
-          params: {
-            limit: 100, // Default is 100,000. Immutability make it hard in python.
-            fq: function () {
-              var filters = Object.keys(userFileFiltersService).map(function (key) {
-                var values = userFileFiltersService[key];
-                // TODO: escaping!
-                var orValues = values.map(function (value) {
-                  return '(' +
-                      key + characterSuffix + ':"' + value + '" OR ' +
-                      key + factorSuffix + ':"' + value + '")';
-                }).join(' OR ');
-                return '(' + orValues + ')';
-              });
-              return filters.join(' AND ');
-            },
-            sort: function () {
-              return userFileSortsService.fields.map(function (field) {
-                var name = field.name;
-                var direction = field.direction;
-                return [
-                  name + characterSuffix + ' ' + direction,
-                  name + factorSuffix + ' ' + direction].join(', ');
-              }).join(', ');
-            }
-          }
+          params: userFileParamsService
         }
       }
     );

diff --git a/refinery/ui/source/js/user-file-browser/views/user-file-browser.html b/refinery/ui/source/js/user-file-browser/views/user-file-browser.html
@@ -6,13 +6,5 @@
         </div>
       </div>
     </div>
-    <div class="col-lg-10 col-md-10 col-sm-9" id="main-area">
-        <div><a href="/files_download"><i class="fa fa-arrow-circle-o-down"></i> Download as CSV</a></div>
-        <div class="m-r-1">
-        <!-- Bootstrap col classes are using the window width, not our inner div.
-             #table-filter has a margin-left, so do something similar on the other side -->
-        <!-- TODO: Why isn't it full height? -->
-        <rp-user-file-browser-files></rp-user-file-browser-files>
-      </div>
-    </div>
+    <rp-user-file-browser-files></rp-user-file-browser-files>
 </div>