@abi-software/map-side-bar 2.4.0-isan-1 → 2.4.0-isan-2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@abi-software/map-side-bar",
-  "version": "2.4.0-isan-1",
+  "version": "2.4.0-isan-2",
   "files": [
     "dist/*",
     "src/*",

package/src/App.vue

@@ -6,6 +6,7 @@
     />
     <div class="options-container">
       <div>Click arrow to open sidebar</div>
+      <el-button @click="openPMRSearch">PMR Search</el-button>
       <el-button @click="openSearch">search Uberon from refs</el-button>
       <el-button @click="singleFacets">Add heart to Filter</el-button>
       <el-button @click="addStomach">Add stomach to Filter</el-button>
@@ -146,6 +147,18 @@ export default {
         }
       }
     },
+    openPMRSearch: function () {
+      this.$refs.sideBar.openSearch(
+        [
+          {
+            facet: "PMR",
+            term: "Data type",
+            facetPropPath: "item.types.name",
+          }
+        ],
+        'cardiovascular multiscale model'
+      );
+    },
     openSearch: function () {
       this.$refs.sideBar.openSearch(
         [],

package/src/components/SideBar.vue

@@ -45,6 +45,7 @@
               v-show="tab.id === activeTabId"
               :contextCardEntry="tab.contextCard"
               :envVars="envVars"
+              :initFilters="initFilters"
               :ref="'searchTab_' + tab.id"
               @pmr-action-click="onPmrActionClick"
               @search-changed="searchChanged(tab.id, $event)"
@@ -137,6 +138,7 @@ export default {
   data: function () {
     return {
       drawerOpen: false,
+      initFilters: { filter: [], searchInput: '' },
       availableAnatomyFacets: []
     }
   },
@@ -177,7 +179,9 @@ export default {
       this.drawerOpen = !this.drawerOpen
     },
     openSearch: function (facets, query) {
-      this.drawerOpen = true
+      this.initFilters.filter = facets;
+      this.initFilters.searchInput = query;
+      this.drawerOpen = true;
       // Because refs are in v-for, nextTick is needed here
       this.$nextTick(() => {
         const searchTabRef = this.getSearchTabRefById(1);

package/src/components/SidebarContent.vue

@@ -121,6 +121,7 @@ var initial_state = {
   numberPerPage: 10,
   page: 1,
   pmrResultsOnlyFlag: false,
+  noPMRResultsFlag: false,
   hasSearched: false,
   contextCardEnabled: false,
   pmrResults: [],
@@ -157,6 +158,13 @@ export default {
       type: Object,
       default: () => initial_state,
     },
+    initFilters: {
+      type: Object,
+      default: {
+        filter: [],
+        searchInput: '',
+      }
+    },
     envVars: {
       type: Object,
       default: () => {},
@@ -165,6 +173,7 @@ export default {
   data: function () {
     return {
       ...this.entry,
+      ...this.initFilters,
       bodyStyle: {
         flex: '1 1 auto',
         'flex-flow': 'column',
@@ -215,17 +224,20 @@ export default {
     },
     // openSearch: Resets the results, populates dataset cards and filters. Will use Algolia and SciCrunch data uness pmr mode is set
     openSearch: function(filter, search = '', resetSearch = true) {
+      this.updatePMROnlyFlag(filter);
+
       if (resetSearch) {
         this.resetSearch();
-        this.openAlgoliaSearch(filter, search);
+        this.openFilterSearch(filter, search);
       } else {
         this.searchAlgolia(filter, search);
+        this.openPMRSearch(filter, search);
       }
-      this.openPMRSearch(filter, search)
     },
 
     // openPMRSearch: Resets the results, populates dataset cards and filters with PMR data.
     openPMRSearch: function (filter, search = '') {
+      this.loadingCards = true;
       this.flatmapQueries.updateOffset(this.calculatePMROffest())
       this.flatmapQueries.updateLimit(this.PMRLimit(this.pmrResultsOnlyFlag))
       this.flatmapQueries.pmrSearch(filter, search).then((data) => {
@@ -233,11 +245,13 @@ export default {
           this.results.push(result)
         })
         this.pmrNumberOfHits = this.flatmapQueries.numberOfHits
+        this.loadingCards = false;
       })
     },
 
-    // openAlgoliaSearch: Resets the results, populates dataset cards and filters with Algloia and SciCrunch data.
-    openAlgoliaSearch: function (filter, search = '') {
+    // previously openAlgoliaSearch:
+    // Resets the results, populates dataset cards and filters with Algloia and SciCrunch data.
+    openFilterSearch: function (filter, search = '') {
       this.searchInput = search
       //Proceed normally if cascader is ready
       if (this.cascaderIsReady) {
@@ -255,7 +269,14 @@ export default {
           this.$refs.filtersRef.checkShowAllBoxes()
           this.resetSearch()
         } else if (this.filter) {
-          this.searchAlgolia(this.filter, search)
+          if (this.pmrResultsOnlyFlag) {
+            this.openPMRSearch(this.filter, search);
+          } else if (this.noPMRResultsFlag) {
+            this.searchAlgolia(this.filter, search);
+          } else {
+            this.searchAlgolia(this.filter, search);
+            this.openPMRSearch(this.filter, search);
+          }
           this.$refs.filtersRef.setCascader(this.filter)
         }
       } else {
@@ -263,7 +284,14 @@ export default {
         //otherwise waith for cascader to be ready
         this.filter = filter
         if (!filter || filter.length == 0) {
-          this.searchAlgolia(this.filter, search)
+          if (this.pmrResultsOnlyFlag) {
+            this.openPMRSearch(this.filter, search);
+          } else if (this.noPMRResultsFlag) {
+            this.searchAlgolia(this.filter, search);
+          } else {
+            this.searchAlgolia(this.filter, search);
+            this.openPMRSearch(this.filter, search);
+          }
         }
       }
     },
@@ -303,11 +331,19 @@ export default {
       }
     },
     updatePMROnlyFlag: function (filters) {
-      const pmrSearchObject = filters.find((tmp) => tmp.facet === 'PMR');
-      if (pmrSearchObject) {
-        this.pmrResultsOnlyFlag = true
-      } else {
-        this.pmrResultsOnlyFlag = false
+      const dataTypeFilters = filters.filter((item) => item.facetPropPath === 'item.types.name');
+      const pmrFilter = dataTypeFilters.filter((item) => item.facet === 'PMR');
+      const showAllFilter = dataTypeFilters.filter((item) => item.facet === 'Show all');
+
+      this.pmrResultsOnlyFlag = false;
+      this.noPMRResultsFlag = false;
+
+      if (dataTypeFilters.length === 1 && pmrFilter.length === 1) {
+        this.pmrResultsOnlyFlag = true;
+      }
+
+      if (dataTypeFilters.length > 0 && pmrFilter.length === 0 && showAllFilter.length === 0) {
+        this.noPMRResultsFlag = true;
       }
     },
     filterUpdate: function (filters) {
@@ -318,8 +354,15 @@ export default {
 
       // Note that we cannot use the openSearch function as that modifies filters
       this.resetSearch()
-      this.searchAlgolia(filters, this.searchInput)
-      this.openPMRSearch(filters, this.searchInput)
+      if (this.pmrResultsOnlyFlag) {
+        this.openPMRSearch(filters, this.searchInput)
+      } else if (this.noPMRResultsFlag) {
+        this.searchAlgolia(filters, this.searchInput)
+      } else {
+        this.searchAlgolia(filters, this.searchInput)
+        this.openPMRSearch(filters, this.searchInput)
+      }
+
       this.$emit('search-changed', {
         value: filters,
         type: 'filter-update',

package/src/flatmapQueries/flatmapQueries.js

@@ -1,13 +1,13 @@
 function transformKeyValueArrayToObject(data) {
   try {
-    let result = data.values.map(valueArray => 
+    let result = data.values.map(valueArray =>
       data.keys.reduce((acc, key, index) => {
         acc[key] = valueArray[index];
         return acc;
       }, {})
     )
     return result
-  } catch (error) { 
+  } catch (error) {
     console.error(`Error occured during conversion of Key Value Array to Object: ${error}`)
     return {}
   }
@@ -49,8 +49,8 @@ let FlatmapQueries = function () {
   this.createTermSQL = function (terms) {
     let sql = ''
     let validFilter = false
-    
-    
+
+
     if (terms && terms.length > 0) {
       sql += 'and '
       terms.forEach((t, i) => {
@@ -84,7 +84,7 @@ let FlatmapQueries = function () {
     // add filters for the terms
     const termsSql = this.createTermSQL(terms)
     sql += termsSql
-    
+
     // Add the text search
     if (search && search !== '') {
       sql += `and (t.pmr_text match '${search}')`
@@ -108,7 +108,7 @@ let FlatmapQueries = function () {
   }
 
   this.convertTermsToIds = function (terms) {
-    return terms.map(t => this.lookUpId(t))
+    return terms.filter(t => this.lookUpId(t))
   }
 
   this.labelSQL = function (){
@@ -137,12 +137,12 @@ let FlatmapQueries = function () {
   }
 
   this.processFilters = function (filters) {
-    let featureLabels = []
+    let featureFacets = []
     filters.forEach((f) => {
-      if (f.label !== 'Show all' && f.label !== 'PMR')
-        featureLabels.push(f.facet)
+      if (f.facet !== 'Show all' && f.facet !== 'PMR')
+        featureFacets.push(f.facet)
     })
-    return featureLabels
+    return featureFacets
   }