feat(search): updates search facets

Files and Participant endpoints get better defaults and loading states
NCI-GDC · Nov 26, 2014 · 1d2d8a2 · 1d2d8a2
1 parent bb69508
commit 1d2d8a2
Show file tree

Hide file tree

Showing 8 changed files with 124 additions and 43 deletions.
diff --git a/app/scripts/files/files.services.ts b/app/scripts/files/files.services.ts
@@ -1,6 +1,7 @@
 module ngApp.files.services {
   import IFiles = ngApp.files.models.IFiles;
   import IFile = ngApp.files.models.IFile;
+  import ILocationService = ngApp.components.location.services.ILocationService;
 
   export interface IFilesService {
     getFile(id: string): ng.IPromise<IFile>;
@@ -11,18 +12,34 @@ module ngApp.files.services {
     private ds: restangular.IElement;
 
     /* @ngInject */
-    constructor(Restangular: restangular.IService) {
+    constructor(Restangular: restangular.IService, private LocationService: ILocationService) {
       this.ds = Restangular.all("files");
     }
 
     getFile(id: string, params: Object = {}): ng.IPromise<IFile> {
+      if (params.hasOwnProperty("fields")) {
+        params["fields"] = params["fields"].join();
+      }
+
       return this.ds.get(id, params).then((response): IFile => {
         return response["data"];
       });
     }
 
     getFiles(params: Object = {}): ng.IPromise<IFiles> {
-      return this.ds.get("", params).then((response): IFiles => {
+      if (params.hasOwnProperty("fields")) {
+        params["fields"] = params["fields"].join();
+      }
+      if (params.hasOwnProperty("facets")) {
+        params["facets"] = params["facets"].join();
+      }
+      var defaults = {
+        size: 10,
+        from: 1,
+        filters: this.LocationService.filters()
+      };
+
+      return this.ds.get("", angular.extend(defaults, params)).then((response): IFiles => {
         return response["data"];
       });
     }

diff --git a/app/scripts/participant/participants.services.ts b/app/scripts/participant/participants.services.ts
@@ -1,6 +1,7 @@
 module ngApp.participants.services {
   import IParticipants = ngApp.participants.models.IParticipants;
   import IParticipant = ngApp.participants.models.IParticipant;
+  import ILocationService = ngApp.components.location.services.ILocationService;
 
   export interface IParticipantsService {
     getParticipant(id: string): ng.IPromise<IParticipant>;
@@ -11,18 +12,33 @@ module ngApp.participants.services {
     private ds: restangular.IElement;
 
     /* @ngInject */
-    constructor(Restangular: restangular.IService) {
+    constructor(Restangular: restangular.IService, private LocationService: ILocationService) {
       this.ds = Restangular.all("participants");
     }
 
     getParticipant(id: string, params: Object = {}): ng.IPromise<IParticipant> {
+      if (params.hasOwnProperty("fields")) {
+        params["fields"] = params["fields"].join();
+      }
       return this.ds.get(id, params).then((response): IParticipant => {
         return response["data"];
       });
     }
 
     getParticipants(params: Object = {}): ng.IPromise<IParticipants> {
-      return this.ds.get("", params).then((response): IParticipants => {
+      if (params.hasOwnProperty("fields")) {
+        params["fields"] = params["fields"].join();
+      }
+      if (params.hasOwnProperty("facets")) {
+        params["facets"] = params["facets"].join();
+      }
+      var defaults = {
+        size: 10,
+        from: 1,
+        filters: this.LocationService.filters()
+      };
+
+      return this.ds.get("", angular.extend(defaults, params)).then((response): IParticipants => {
         return response["data"];
       });
     }

diff --git a/app/scripts/search/module.ts b/app/scripts/search/module.ts
@@ -16,15 +16,7 @@ module ngApp.search {
     $stateProvider.state("search", {
       url: "/search?query",
       controller: "SearchController as sc",
-      templateUrl: "search/templates/search.html",
-      resolve: {
-        files: (FilesService: IFilesService): ng.IPromise<IFiles> => {
-          return FilesService.getFiles();
-        },
-        participants: (ParticipantsService: IParticipantsService): ng.IPromise<IParticipants> => {
-          return ParticipantsService.getParticipants();
-        }
-      }
+      templateUrl: "search/templates/search.html"
     });
 
     $stateProvider.state("search.participants", {

diff --git a/app/scripts/search/search.controllers.ts b/app/scripts/search/search.controllers.ts
@@ -24,15 +24,14 @@ module ngApp.search.controllers {
   class SearchController implements ISearchController {
     participantAccordian: boolean = true;
     participantBioAccordian: boolean = true;
+    files : IFiles;
+    participants: IParticipants;
     query: string = "";
 
     /* @ngInject */
-    constructor(
-        private $scope,
-        private $state: ng.ui.IStateService,
+    constructor(private $scope,
+                private $state: ng.ui.IStateService,
                 public State: IState,
-                public files: IFiles,
-                public participants: IParticipants,
                 public CartService: ICartService,
                 public FilesService: IFilesService,
                 public ParticipantsService: IParticipantsService,
@@ -41,18 +40,57 @@ module ngApp.search.controllers {
       this.State.setActive(data.tab);
       CoreService.setPageTitle("Search");
 
-      // TODO Listen for Location change event - run activate
-      this.setup();
-
-    }
-
-    setup() {
-      this.$scope.$on('$locationChangeSuccess',  (event, next) => {
+      this.$scope.$on('$locationChangeSuccess', (event, next) => {
         if (next.indexOf('search') !== -1) {
-          this.FilesService.getFiles().then((data) => this.files = data);
-          this.ParticipantsService.getParticipants().then((data) => this.participants = data);
+          this.refresh();
         }
       });
+      this.refresh();
+    }
+
+    refresh() {
+      this.FilesService.getFiles({
+        fields: [
+          "data_access",
+          "data_format",
+          "data_level",
+          "data_subtype",
+          "data_type",
+          "file_extension",
+          "file_name",
+          "file_size",
+          "file_uuid",
+          "platform",
+          "updated"
+        ],
+        facets: [
+          "data_access",
+          "data_format",
+          "data_level",
+          "data_subtype",
+          "data_type",
+          "file_extension",
+          "platform"
+        ]
+      }).then((data) => this.files = data);
+      this.ParticipantsService.getParticipants({
+        fields: [
+          "bcr_patient_barcode",
+          "bcr_patient_uuid",
+          "gender",
+          "patient_id",
+          "vital_status"
+        ],
+        facets: [
+          "ethnicity",
+          "gender",
+          "histological_type",
+          "history_of_neoadjuvant_treatment",
+          "race",
+          "tumor_tissue_site",
+          "vital_status"
+        ]
+      }).then((data) => this.participants = data);
     }
 
     // TODO Load data lazily based on active tab

diff --git a/app/scripts/search/templates/search.files.facets.html b/app/scripts/search/templates/search.files.facets.html
@@ -1,5 +1,7 @@
-<facet-terms data-facet="sc.files.facets.dataType" data-collapsed="true"></facet-terms>
-<facet-terms data-facet="sc.files.facets.dataCategory"></facet-terms>
-<facet-terms data-facet="sc.files.facets.fileType"
-             data-collapsed="true" data-expanded="true"></facet-terms>
-<facet-terms data-facet="sc.files.facets.platform"></facet-terms>
+<terms data-name="data_type" data-title="Data Type" data-facet="sc.files.aggregations.data_type"></terms>
+<terms data-name="data_format" data-title="Data Format" data-facet="sc.files.aggregations.data_format"></terms>
+<terms data-name="data_level" data-title="Data Level" data-facet="sc.files.aggregations.data_level"></terms>
+<terms data-name="data_access" data-title="Data Access" data-facet="sc.files.aggregations.data_access"></terms>
+<terms data-name="platform" data-title="Platform" data-facet="sc.files.aggregations.platform" data-collapsed="true"></terms>
+<terms data-name="file_extension" data-title="File Extension" data-facet="sc.files.aggregations.file_extension" data-collapsed="true"></terms>
+<terms data-name="data_subtype" data-title="Data Subtype" data-facet="sc.files.aggregations.data_subtype" data-collapsed="true"></terms>
diff --git a/app/scripts/search/templates/search.files.html b/app/scripts/search/templates/search.files.html
@@ -42,7 +42,7 @@
   </tr>
   </thead>
   <tbody>
-  <tr data-ng-repeat="file in sc.files.hits">
+  <tr data-ng-repeat="file in sc.files.hits track by file.file_uuid">
     <td>
       <input type="checkbox"
              class="cart-checkbox"

diff --git a/app/scripts/search/templates/search.html b/app/scripts/search/templates/search.html
@@ -29,18 +29,33 @@ <h1 data-translate>Search</h1>
     </div>
     <div class="col-lg-10 col-md-9 table-area">
       <tabset>
-        <tab heading="{{ 'Participants' | translate }} ({{sc.participants.hits.length}})"
+        <tab heading="{{ 'Participants' | translate }} ({{sc.participants.pagination.total}})"
              active="sc.State.tabs.participants.active"
              select="sc.select('participants')">
           <div class="pane-section">
-            <div ng-include="'search/templates/search.participants.html'"></div>
+            <h2 class="col-lg-10 col-md-9" data-ng-if="!sc.participants">
+              <i class="fa fa-spinner fa-spin"></i> Loading participants...
+            </h2>
+
+            <h2 class="col-lg-10 col-md-9" data-ng-if="sc.participants.hits.length === 0">
+              No participants found using those filters.
+            </h2>
+            <div data-ng-include="'search/templates/search.participants.html'" data-ng-if="sc.participants.hits.length > 0"></div>
           </div>
         </tab>
-        <tab heading="{{ 'Files' | translate }} ({{sc.files.hits.length}})"
+        <tab heading="{{ 'Files' | translate }} ({{sc.files.pagination.total}})"
              active="sc.State.tabs.files.active"
              select="sc.select('files')">
           <div class="pane-section">
-            <div ng-include="'search/templates/search.files.html'"></div>
+            <h2 class="col-lg-10 col-md-9" data-ng-if="!sc.files">
+              <i class="fa fa-spinner fa-spin"></i> Loading files...
+            </h2>
+
+            <h2 class="col-lg-10 col-md-9" data-ng-if="sc.files.hits.length === 0">
+              No files found using those filters.
+            </h2>
+
+            <div data-ng-include="'search/templates/search.files.html'" data-ng-if="sc.files.hits.length > 0"></div>
           </div>
         </tab>
       </tabset>

diff --git a/app/scripts/search/templates/search.participants.facets.html b/app/scripts/search/templates/search.participants.facets.html
@@ -1,13 +1,14 @@
 <accordion close-others="sc.participantAccordian">
   <accordion-group heading="{{ 'Clinical' | translate }}" is-open="sc.participantAccordian">
     <facets-free-text placeholder="{{ 'ID (Barcode or Participant number)' | translate }}"></facets-free-text>
-    <facet-terms data-facet="sc.participants.facets.cancerProgram"></facet-terms>
-    <facet-terms data-facet="sc.participants.facets.project"></facet-terms>
-    <facet-terms data-facet="sc.participants.facets.primarySite"></facet-terms>
-    <facets-free-text header="{{ 'ICD10' | translate }}" 
+    <facets-free-text header="{{ 'ICD10' | translate }}"
                       placeholder="{{ 'e.g. C50.9, C64.1' | translate }}"></facets-free-text>
-    <facet-terms data-facet="sc.participants.facets.gender"
-           data-collapsed="true"></facet-terms>
+    <terms data-name="ethnicity" data-title="Ethnicity" data-facet="sc.participants.aggregations.ethnicity"></terms>
+    <terms data-name="gender" data-title="Gender" data-facet="sc.participants.aggregations.gender"></terms>
+    <terms data-name="histological_type" data-title="Histological Type" data-facet="sc.participants.aggregations.histological_type"></terms>
+    <terms data-name="race" data-title="Race" data-facet="sc.participants.aggregations.race" data-collapsed="true"></terms>
+    <terms data-name="tumor_tissue_site" data-title="Tumor Tissue Site" data-facet="sc.participants.aggregations.tumor_tissue_site" data-collapsed="true"></terms>
+    <terms data-name="vital_status" data-title="Vital Status" data-facet="sc.participants.aggregations.vital_status" data-collapsed="true"></terms>
   </accordion-group>
   <accordion-group heading="{{ 'Bio-specimens' | translate }}">
     <accordion close-others="sc.participantBioAccordian">