@abi-software/map-side-bar 1.3.37 → 2.0.0-response.0

package/src/components/SidebarContent.vue

@@ -90,7 +90,7 @@ var handleErrors = async function(response) {
   return response;
 };
 
-var initial_state = {
+const initial_state = {
   searchInput: "",
   lastSearch: "",
   results: [],
@@ -127,6 +127,11 @@ export default {
       default: () => {}
     },
   },
+  inject: {
+    'alternateSearch' : {
+      default: undefined,
+    },
+  },
   data: function() {
     return {
       ...this.entry,
@@ -153,7 +158,6 @@ export default {
     },
     resetSearch: function() {
       this.numberOfHits = 0
-      this.discoverIds = []
       this._dois = []
       this.results = []
       this.loadingCards = false
@@ -172,7 +176,7 @@ export default {
           this.$refs.filtersRef.checkShowAllBoxes();
           this.resetSearch();
         } else if (this.filter) {
-          this.searchAlgolia(this.filter, search);
+          this.performSearch(this.filter, search);
           this.$refs.filtersRef.setCascader(this.filter);
         }
       } else {
@@ -180,7 +184,7 @@ export default {
         //otherwise waith for cascader to be ready
         this.filter = filter;
         if (!filter || filter.length == 0) {
-          this.searchAlgolia(this.filter, search);
+          this.performSearch(this.filter, search);
         }
       }
     },
@@ -206,23 +210,52 @@ export default {
     clearSearchClicked: function() {
       this.searchInput = "";
       this.resetPageNavigation();
-      this.searchAlgolia(this.filters, this.searchInput);
+      this.performSearch(this.filters, this.searchInput);
     },
     searchEvent: function(event = false) {
       if (event.keyCode === 13 || event instanceof MouseEvent) {
         this.resetPageNavigation();
-        this.searchAlgolia(this.filters, this.searchInput);
+        this.performSearch(this.filters, this.searchInput);
       }
     },
     filterUpdate: function(filters) {
       this.filters = [...filters]
       this.resetPageNavigation()
-      this.searchAlgolia(filters, this.searchInput)
+      this.performSearch(filters, this.searchInput)
       this.$emit("search-changed", {
         value: filters,
         type: "filter-update"
       });
     },
+    processSearchData: function(searchData) {
+      this.numberOfHits = searchData.total
+      this._dois = searchData.dois
+      this.results = searchData.items
+      this.loadingCards = false
+      this.scrollToTop()
+      this.$emit("search-changed", { value: this.searchInput, type: "query-update" })
+    },
+    alternateSearchCB: function(payload) {
+      this.loadingCards = false;
+      this.processSearchData(payload)
+      //console.log(payload)
+    },
+    performSearch(filters, query='') {
+      if (this.alternateSearch) {
+        this.loadingCards = true;
+        const payload = {
+          requestType: 'Search',
+          filters,
+          query,
+          numberPerPage: this.numberPerPage,
+          page: this.page
+        };
+        this.alternateSearch(payload, this.alternateSearchCB);
+      }
+      else {
+        this.searchAlgolia(filters, query);
+      }
+    },
     searchAlgolia(filters, query=''){
       // Algolia search
       this.loadingCards = true
@@ -230,13 +263,7 @@ export default {
         EventBus.$emit("anatomyFound", anatomy) 
       })
       this.algoliaClient.search(getFilters(filters), query, this.numberPerPage, this.page).then(searchData => {
-        this.numberOfHits = searchData.total
-        this.discoverIds = searchData.discoverIds
-        this._dois = searchData.dois
-        this.results = searchData.items
-        this.loadingCards = false
-        this.scrollToTop()
-        this.$emit("search-changed", { value: this.searchInput, type: "query-update" })
+        this.processSearchData(searchData)
         if (this._abortController)
           this._abortController.abort()
         this._abortController = new AbortController()
@@ -254,8 +281,8 @@ export default {
     },
     pageChange: function(page) {
       this.start = (page - 1) * this.numberPerPage;
-      this.page = page
-      this.searchAlgolia(this.filters, this.searchInput, this.numberPerPage, this.page)
+      this.page = page;
+      this.performSearch(this.filters, this.searchInput);
     },
     handleMissingData: function(doi) {
       let i = this.results.findIndex(res=> res.doi === doi)
@@ -275,7 +302,7 @@ export default {
               if (result.numberOfHits === 0)
                 this.handleMissingData(doi);
               else
-                this.resultsProcessing(result);
+                this.perItemProcessing(result);
               this.$refs.content.style["overflow-y"] = "scroll";
               data.count--;
               //Async::Download finished, get the next one
@@ -303,9 +330,8 @@ export default {
       this.start = 0;
       this.page = 1;
     },
-    resultsProcessing: function(data) {
+    perItemProcessing: function(data) {
       this.lastSearch = this.searchInput;
-
       if (data.results.length === 0) {
         return;
       }
@@ -367,8 +393,8 @@ export default {
     callSciCrunch: function(apiLocation, params = {}, signal) {
       return new Promise((resolve, reject) => {
         // Add parameters if we are sent them
-        let fullEndpoint = this.envVars.API_LOCATION + this.searchEndpoint + "?" + this.createfilterParams(params);
-        fetch(fullEndpoint, {signal})
+        let fullEndpoint = apiLocation + this.searchEndpoint + "?" + this.createfilterParams(params);
+        fetch(fullEndpoint, { signal })
           .then(handleErrors)
           .then(response => response.json())
           .then(data => resolve(data))
@@ -377,9 +403,11 @@ export default {
     },
   },
   mounted: function() {
-    // initialise algolia
-    this.algoliaClient = new AlgoliaClient(this.envVars.ALGOLIA_ID, this.envVars.ALGOLIA_KEY, this.envVars.PENNSIEVE_API_LOCATION);
-    this.algoliaClient.initIndex(this.envVars.ALGOLIA_INDEX);
+    if (!this.alternateSearch) {
+      // initialise algolia
+      this.algoliaClient = new AlgoliaClient(this.envVars.ALGOLIA_ID, this.envVars.ALGOLIA_KEY, this.envVars.PENNSIEVE_API_LOCATION);
+      this.algoliaClient.initIndex(this.envVars.ALGOLIA_INDEX);
+    }
     this.openSearch(this.filter, this.searchInput);
   },
   created: function() {

package/src/demo/AlternateResponse.js

@@ -0,0 +1,141 @@
+/* eslint-disable no-alert, no-console */
+const searchDataset = async (payload, callback) => {
+  let data = {};
+  let search = "";
+  let allFilter = {};
+
+  if (payload.query) {
+    search = payload.query;
+  }
+  for (let i = 0; i < payload.filters.length; i++) {
+    let filter = payload.filters[i];
+    let node;
+    let field;
+    let element;
+    let subFilter = {};
+    let exist = false;
+    if (filter.facet != "Show all") {
+      let filterPayload = filter.facetPropPath.split(">");
+      node = filterPayload[0];
+      field = filterPayload[1];
+      element = filter.facet
+      Object.entries(allFilter).forEach((entry) => {
+        const [key, value] = entry;
+        if (node == value.node) {
+          Object.keys(value.filter).forEach((subkey) => {
+            if (node == value.node && field == subkey) {
+              exist = true;
+              allFilter[key]["filter"][field].push(element);
+            } else {
+              exist = false;
+            }
+          });
+        }
+      });
+      if (exist == false) {
+        subFilter["node"] = node;
+        subFilter["filter"] = {};
+        subFilter["filter"][field] = []
+        subFilter["filter"][field].push(element);
+        allFilter[i] = subFilter;
+      }
+    }
+  }
+  let url = `${process.env.VUE_APP_API_LOCATION}/graphql/pagination/?search=${search}`;
+  let postPayload = {
+    filter: allFilter,
+    limit: payload.numberPerPage,
+    page: payload.page,
+  };
+  await fetch(url, {
+    method: "POST", // *GET, POST, PUT, DELETE, etc.
+    headers: {
+      Accept: "application.json",
+      "Content-Type": "application/json",
+    },
+    body: JSON.stringify(postPayload), // body data type must match "Content-Type" header
+    Cache: "default",
+  })
+    .then((response) => response.json())
+    .then((json) => (data = json));
+  // const element = {};
+  // const searchData = {
+  //   total: 5, //Total number of items
+  //   items: [
+  //     {
+  //       numberSamples: 6,
+  //       numberSubjects: 5,
+  //       updated: "the time in string format",
+  //       url: "uri to dataset page",
+  //       datasetId: "1231",
+  //       datasetRevision: "4",
+  //       datasetVersion: "5",
+  //       organs: ["heart", "lungs"],
+  //       species: ["human", "rat"], // This processing only includes each gender once into 'sexes'
+  //       scaffolds: element["abi-scaffold-metadata-file"],
+  //       thumbnails: element["abi-thumbnail"]
+  //         ? element["abi-thumbnail"]
+  //         : element["abi-scaffold-thumbnail"],
+  //       scaffoldViews: element["abi-scaffold-view-file"],
+  //       videos: element.video,
+  //       plots: element["abi-plot"],
+  //       images: element["common-images"],
+  //       contextualInformation: undefined,
+  //       simulation: element["abi-simulation-file"],
+  //       detailsReady: true,
+  //     },
+  //   ], //actual returns information
+  // };
+  const searchData = data;
+  callback(searchData);
+};
+
+const getFacets = async (payload, callback) => {
+  let facet = {};
+  let url = `${process.env.VUE_APP_API_LOCATION}/filter/?sidebar=true`;
+  await fetch(url, {
+    method: "GET", // *GET, POST, PUT, DELETE, etc.
+    headers: {
+      Accept: "application.json",
+      "Content-Type": "application/json",
+    },
+    Cache: "default",
+  })
+    .then((response) => response.json())
+    .then((json) => (facet = json));
+  // const facets = [
+  //   {
+  //     key: "anatomy.organ.name",
+  //     label: "Anatomical Structure",
+  //     value: "anatomy.organ.name",
+  //     children: [
+  //       {
+  //         facetPropPath: "anatomy.organ.name", //Should be the same as the parent's key
+  //         label: "Lung",
+  //         value: "Anatomical Structure>Lung",
+  //       },
+  //       {
+  //         facetPropPath: "anatomy.organ.name", //Should be the same as the parent's key
+  //         label: "Heart",
+  //         value: "Anatomical Structure>Heart",
+  //       },
+  //     ],
+  //   }
+  // ];
+  const facets = facet;
+  const returnedPayload = {
+    data: facets,
+  };
+  callback(returnedPayload);
+};
+
+export const mySearch = (payload, callback) => {
+  if (payload && callback) {
+    if (payload.requestType == "Search") {
+      searchDataset(payload, callback);
+      return;
+    } else if (payload.requestType == "getFacets") {
+      getFacets(payload, callback);
+    }
+  }
+};