@abi-software/map-side-bar 1.3.24 → 1.3.26-staging

package/package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "@abi-software/map-side-bar",
-  "version": "1.3.6",
+  "version": "1.3.26",
   "lockfileVersion": 1,
   "requires": true,
   "dependencies": {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@abi-software/map-side-bar",
-  "version": "1.3.24",
+  "version": "1.3.26-staging",
   "main": "./dist/map-side-bar.common.js",
   "files": [
     "dist/*",

package/scaffold_context_info.json

@@ -2,6 +2,7 @@
     "description": "This dataset contains single cell scale anatomical map of the rat intrinsic cardiac nervous system (ICNS) across four male and three female hearts. These cell clusters can be seen by the yellow data points on the image as well as spherical markers on the 3D heart scaffold. The dataset provides an integrative framework to visualise the spatial distribution of ICNS across different hearts.",
     "heading": "Mapped ICN samples",
     "id": "sparc.science.context_data",
+    "views": [],
     "samples": [
         {
             "annotation": "",

package/src/algolia/algolia.js

@@ -79,10 +79,10 @@ export class AlgoliaClient {
       newResult = { ...res }
       newResult = {
         doi: res.item.curie.split(':')[1],
-        name: res.item.name,
-        description: res.item.description,
-        updated: res.pennsieve.updatedAt,
-        publishDate: res.pennsieve.publishDate,
+        name: res.item.dataset.name,
+        description: res.item.dataset.description,
+        updated: res.pennsieve ? res.pennsieve.updatedAt : 'Unkown',
+        publishDate: res.pennsieve? res.pennsieve.publishDate : 'Uknown',
         datasetId: res.objectID,
         detailsReady: false
       }
@@ -133,20 +133,20 @@ export class AlgoliaClient {
           page: page - 1,
           filters: filter,
           attributesToHighlight: [],
-          attributesToRetrieve: [
-            'pennsieve.publishDate',
-            'pennsieve.updatedAt',
-            'item.curie',
-            'item.name',
-            'item.description',
-            'objectID',
-          ],
+          // attributesToRetrieve: [
+          //   'pennsieve.publishDate',
+          //   'pennsieve.updatedAt',
+          //   'item.curie',
+          //   'item.name',
+          //   'item.description',
+          //   'objectID',
+          // ],
         })
         .then(response => {
           let searchData = {
             items: this._processResultsForCards(response.hits),
             total: response.nbHits,
-            discoverIds: response.hits.map(r => r.pennsieve.identifier),
+            discoverIds: response.hits.map(r => r.pennsieve ? r.pennsieve.identifier : undefined),
             dois: response.hits.map(r => r.item.curie.split(':')[1])
           }
           resolve(searchData)

package/src/components/ContextCard.vue

@@ -140,8 +140,11 @@ export default {
   computed: {
     samplesUnderViews: function(){
       if (this.contextData){
+        if (!this.contextData.views || !this.contextData.samples){
+          return false
+        }
         if (this.contextData.samplesUnderViews){
-          return true
+          return this.contextData.samplesUnderViews
         } else {
           let viewId = this.contextData.views.map(v=>v.id)
           let samplesView = this.contextData.samples.map(s=>s.view)

package/src/components/DatasetCard.vue

@@ -4,8 +4,8 @@
       <div class="seperator-path"></div>
       <div v-loading="loading" class="card" >
         <span class="card-left">
-          <image-gallery v-if="!loading && discoverId" 
-            :datasetId="discoverId"
+          <image-gallery v-if="!loading" 
+            :datasetId="String(discoverId)"
             :datasetVersion="version"
             :entry="entry"
             :envVars="envVars"
@@ -172,9 +172,11 @@ export default {
     splitDOI: function(doi){
       return [doi.split('/')[doi.split('/').length-2], doi.split('/')[doi.split('/').length-1]]
     },
-    getBanner: function () {
-      // Only load banner if card has changed
-      if (this.lastDoi !== this.entry.doi) {
+    getBanner: function () { // NOTE! This getBanner uses the pennsieve api to retrive the banner. Only use for curation!
+      if (this.entry.datasetId.length > 4){
+        this.loading = true
+        this.getPennsieveBanner()
+      } else if (this.lastDoi !== this.entry.doi) {
         this.lastDoi = this.entry.doi
         this.loading = true
         let doi = this.splitDOI(this.entry.doi)
@@ -191,7 +193,7 @@ export default {
             this.discoverId = data.id
             this.version = data.version
             this.dataLocation = `https://sparc.science/datasets/${data.id}?type=dataset`
-            this.getBiolucidaInfo(this.discoverId)
+            if (this.discoverId.length < 5) this.getBiolucidaInfo(this.discoverId)
             this.loading = false
           })
           .catch(() => {
@@ -200,9 +202,67 @@ export default {
             this.discoverId = Number(this.entry.datasetId)
             this.loading = false
           });
-      }
+      } 
+    },
+    getPennsieveBanner: function(){
+      // authenticate with pennsieve
+      fetch('https://cognito-idp.us-east-1.amazonaws.com/', {
+        method: 'POST',
+        headers: {
+          'Accept': 'application/json, text/plain, */*',
+          'Content-Type': 'application/x-amz-json-1.1',
+          'X-Amz-Target': 'AWSCognitoIdentityProviderService.InitiateAuth',
+          'X-Amz-User-Agent': 'aws-amplify/0.1.x js',
+        },
+        body: JSON.stringify({"AuthFlow":"USER_PASSWORD_AUTH","ClientId":"670mo7si81pcc3sfub7o1914d8","AuthParameters":{"USERNAME":"jessekhorasanee@gmail.com","PASSWORD":"Asameswayhey@666","DEVICE_KEY":"us-east-1_0d4e8de7-6079-470d-bedd-62043ba70f7e"},"ClientMetadata":{}})
+      }).then(res => res.json())
+        .then(res => {
+            console.log(res)
+            let token = res.AuthenticationResult.AccessToken
+            let proxy = `${this.envVars.API_LOCATION}proxy/?url=` // set up proxy 
+
+            // call pennsieve api via proxy
+            fetch(`${proxy}https://api.pennsieve.io/datasets/N%3Adataset%3A${this.entry.datasetId}/banner?api_key=${token}`
+            ).then(res=>res.json()).then(res=>{
+              console.log('success!')
+              this.thumbnail = res.banner
+              this.discoverId = this.entry.datasetId
+              this.loading = false
+            })
+        })
 
     },
+    // getBanner: function () {
+    //   // Only load banner if card has changed
+    //   if (this.lastDoi !== this.entry.doi) {
+    //     this.lastDoi = this.entry.doi
+    //     this.loading = true
+    //     let doi = this.splitDOI(this.entry.doi)
+    //     fetch(`${this.envVars.PENNSIEVE_API_LOCATION}/discover/datasets/doi/${doi[0]}/${doi[1]}`)
+    //       .then((response) =>{
+    //         if (!response.ok){
+    //           throw Error(response.statusText)
+    //         } else {
+    //           return response.json()
+    //         }
+    //       })
+    //       .then((data) => {
+    //         this.thumbnail = data.banner
+    //         this.discoverId = data.id
+    //         this.version = data.version
+    //         this.dataLocation = `https://sparc.science/datasets/${data.id}?type=dataset`
+    //         this.getBiolucidaInfo(this.discoverId)
+    //         this.loading = false
+    //       })
+    //       .catch(() => {
+    //         //set defaults if we hit an error
+    //         this.thumbnail = require('@/../assets/missing-image.svg')
+    //         this.discoverId = Number(this.entry.datasetId)
+    //         this.loading = false
+    //       });
+    //   }
+
+    // },
     lastName: function(fullName){
       return fullName.split(',')[0]
     },

package/src/components/ImageGallery.vue

@@ -28,7 +28,7 @@ const capitalise = function (string) {
   return string.replace(/\b\w/g, (v) => v.toUpperCase());
 };
 
-import GalleryHelper from "@abi-software/gallery/src/mixins/GalleryHelpers";
+import GalleryHelper from "../mixins/GalleryHelpers";
 import Gallery from "@abi-software/gallery";
 import "@abi-software/gallery/dist/gallery.css";
 
@@ -58,8 +58,8 @@ export default {
       },
     },
     datasetId: {
-      type: Number,
-      default: -1,
+      type: String,
+      default: "",
     },
     datasetVersion: {
       type: Number,
@@ -215,7 +215,6 @@ export default {
     },
     createScaffoldItems: function () {
       if (this.entry.scaffolds) {
-        window.entry = this.entry
         let index = 0;
         this.entry.scaffolds.forEach((scaffold, i) => {
           const filePath = scaffold.dataset.path;
@@ -229,12 +228,7 @@ export default {
           let mimetype = '';
           let thumbnailURL = undefined;
           if (thumbnail) {
-            thumbnailURL = this.getImageURLFromS3(this.envVars.API_LOCATION, {
-              id,
-              datasetId: this.datasetId,
-              datasetVersion: this.datasetVersion,
-              file_path: thumbnail.dataset.path,
-            });
+            thumbnailURL = `${this.envVars.API_LOCATION}s3-resource/${this.datasetId}/${this.datasetVersion}/files/${filePath}`
             mimetype = thumbnail.mimetype.name;
           }
           let action = {
@@ -350,7 +344,7 @@ export default {
         return undefined
       } else {
         // The line below checks if there is a context file for each scaffold. If there is not, we use the first context card for each scaffold.
-        let contextIndex = this.entry['abi-contextual-information'].length == this.entry.scaffolds.length ? scaffoldIndex : 0
+        let contextIndex = this.entry.contextualInformation.length == this.entry.scaffolds.length ? scaffoldIndex : 0
         return `${this.envVars.API_LOCATION}s3-resource/${this.datasetId}/${this.datasetVersion}/files/${this.entry.contextualInformation[contextIndex]}`
       }
     }

package/src/components/SidebarContent.vue

@@ -311,9 +311,12 @@ export default {
       }
       data.results.forEach(element => {
         // match the scicrunch result with algolia result
-        let i = this.results.findIndex(res=> res.name === element.name)
+        let i = this.results.findIndex(res=> (res.datasetId === element.dataset_identifier) || (res.identifier === element.dataset_identifier))
+        console.log('i: ', i)
+        let name = this.results[i].name
         // Assign scicrunch results to the object
         Object.assign(this.results[i], element)
+        this.results[i].name = name
         // Assign the attributes that need some processing
         Object.assign(this.results[i],{
           numberSamples: element.sampleSize
@@ -322,8 +325,8 @@ export default {
           numberSubjects: element.subjectSize
             ? parseInt(element.subjectSize)
             : 0,
-          updated: element.updated[0].timestamp.split("T")[0],
-          url: element.uri[0],
+          updated: element.updated ? element.updated[0].timestamp.split("T")[0] : undefined,
+          url: element.uri? element.uri[0] : undefined,
           datasetId: element.dataset_identifier,
           datasetRevision: element.dataset_revision,
           datasetVersion: element.dataset_version,

package/src/mixins/GalleryHelpers.js

@@ -0,0 +1,104 @@
+import axios from 'axios'
+
+export default {
+  //this mixin is not used by this code base but it can be used by other
+  //projects to get a handle to various resources
+  data() {
+    return {
+      defaultImg: require('../../assets/logo-sparc-wave-primary.svg'),
+    }
+  },
+  methods: {
+    async getRequest(url, params, timeout) {
+      return await axios({
+        method: 'get',
+        url,
+        params,
+        timeout,
+      })
+    },
+    /**
+     * Returns a file path for S3.
+     * @param {String} dataset_id dataset id.
+     * @param {String} dataset_version dataset version.
+     * @param {String} file_path file path.
+     * @returns {String} full path to S3 file.
+     */
+    getS3FilePath(dataset_id, dataset_version, file_path) {
+      const encoded_file_path = encodeURIComponent(file_path)
+      return `${dataset_id}/${dataset_version}/files/${encoded_file_path}`
+    },
+    /**
+     * Find data path in the array that matches the provide path
+     */
+    findEntryWithPathInArray(array, path) {
+      if (path && array) {
+        for (let i = 0; i < array.length; i++) {
+          if (path === array[i].dataset.path) return array[i]
+        }
+      }
+      return undefined
+    },
+    getThumbnailForPlot(plot, thumbnails) {
+      if (thumbnails && plot) {
+        return this.findEntryWithPathInArray(thumbnails, plot.datacite.isSourceOf.path[0])
+      }
+      return undefined
+    },
+    /**
+     * Use the scaffoldViews to help with finding the correct thumbnails.
+     * Use the index if the workflow stated above fails.
+     */
+    getThumbnailForScaffold(scaffold, scaffoldViews, thumbnails, index) {
+      if (thumbnails && thumbnails.length > 0) {
+        let thumbnail = undefined
+        if (scaffold && scaffoldViews) {
+          const view = this.findEntryWithPathInArray(scaffoldViews, scaffold.datacite.isSourceOf.path[0])
+          if (view) {
+            thumbnail = this.findEntryWithPathInArray(thumbnails, view.datacite.isSourceOf.path[0])
+          }
+        }
+        if (thumbnail) {
+          return thumbnail
+        } else if (index < thumbnails.length) {
+          return thumbnails[index]
+        }
+      }
+      return undefined
+    },
+    getImageURLFromS3(apiEndpoint, info) {
+      return `${apiEndpoint}/s3-resource/${info.datasetId}/${info.datasetVersion}/files/${info.file_path}?encodeBase64=true`
+    },
+    getSegmentationThumbnailURL(apiEndpoint, info) {
+      let endpoint = `${apiEndpoint}/thumbnail/neurolucida`
+      endpoint = endpoint + `?datasetId=${info.datasetId}`
+      endpoint = endpoint + `&version=${info.datasetVersion}`
+      endpoint = endpoint + `&path=files/${info.segmentationFilePath}`
+      return endpoint
+    },
+    getThumbnailURLFromBiolucida(apiEndpoint, info) {
+      return `${apiEndpoint}/thumbnail/${info.id}`
+    },
+    getImageInfoFromBiolucida(apiEndpoint, items, info) {
+      const endpoint = `${apiEndpoint}/image/${info.id}`
+      const params = {}
+      this.getRequest(endpoint, params, 20000).then(
+        (response) => {
+          let item = items.find((x) => x.id === info.id)
+          const name = response.name
+          if (name) {
+            item.title = name
+          }
+        },
+        (reason) => {
+          if (reason.message.includes('timeout') && reason.message.includes('exceeded') && info.fetchAttempts < 3) {
+            info.fetchAttempts += 1
+            this.getImageInfoFromBiolucida(apiEndpoint, items, info)
+          }
+
+          return Promise.reject('Maximum iterations reached.')
+        }
+      )
+    },
+  },
+}

package/src/components/delte.json

@@ -1,27 +0,0 @@
-{
-    "description": "Mean luminal pressure (represented by a color field with red as high pressure and blue as low pressure) recorded from the proximal, transverse and distal sections of the pig colon are mapped on the scaffold. \n\nBaseline data was collected for 30min, followed by 15min of stimulation and 30min of post-stimulation.",
-    "heading": "Direct proximal colon stimulation",
-    "id": "sparc.science.context_data",
-    "samples": [
-        {
-            "annotation": "",
-            "description": "Manometry data recorded from pigs under direct proximal colon stimulation.",
-            "doi": "https://doi.org/10.26275/up27-ibcr",
-            "heading": "Proximal direct stimulation samples",
-            "id": "Sample 1",
-            "path": "derivative\\stim_proximal-colon_manometry.csv",
-            "view": "View 1"
-        }
-    ],
-    "version": "0.1.0",
-    "views": [
-        {
-            "annotation": "--",
-            "description": "Sections of pig colon scaffold with mapped manometry data where the data are collected from. ",
-            "id": "View 1",
-            "path": "colon_Layout1_view.json",
-            "sample": "Sample 1",
-            "thumbnail": "derivative\\pig_colon_main_thumbnail.jpeg"
-        }
-    ]
-}