@abi-software/map-side-bar 1.3.29 → 1.3.30-staging
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/img/logo-sparc-wave-primary.8ed83a51.svg +1 -0
- package/dist/map-side-bar.common.js +388 -153
- package/dist/map-side-bar.common.js.map +1 -1
- package/dist/map-side-bar.css +1 -1
- package/dist/map-side-bar.umd.js +388 -153
- package/dist/map-side-bar.umd.js.map +1 -1
- package/dist/map-side-bar.umd.min.js +1 -1
- package/dist/map-side-bar.umd.min.js.map +1 -1
- package/package-lock.json +1 -1
- package/package.json +1 -1
- package/src/algolia/algolia.js +13 -13
- package/src/components/ContextCard.vue +5 -1
- package/src/components/DatasetCard.vue +67 -7
- package/src/components/ImageGallery.vue +5 -11
- package/src/components/SidebarContent.vue +6 -3
- package/src/mixins/GalleryHelpers.js +104 -0
package/package-lock.json
CHANGED
package/package.json
CHANGED
package/src/algolia/algolia.js
CHANGED
|
@@ -79,10 +79,10 @@ export class AlgoliaClient {
|
|
|
79
79
|
newResult = { ...res }
|
|
80
80
|
newResult = {
|
|
81
81
|
doi: res.item.curie.split(':')[1],
|
|
82
|
-
name: res.item.name,
|
|
83
|
-
description: res.item.description,
|
|
84
|
-
updated: res.pennsieve.updatedAt,
|
|
85
|
-
publishDate: res.pennsieve.publishDate,
|
|
82
|
+
name: res.item.dataset.name,
|
|
83
|
+
description: res.item.dataset.description,
|
|
84
|
+
updated: res.pennsieve ? res.pennsieve.updatedAt : 'Unkown',
|
|
85
|
+
publishDate: res.pennsieve? res.pennsieve.publishDate : 'Uknown',
|
|
86
86
|
datasetId: res.objectID,
|
|
87
87
|
detailsReady: false
|
|
88
88
|
}
|
|
@@ -133,20 +133,20 @@ export class AlgoliaClient {
|
|
|
133
133
|
page: page - 1,
|
|
134
134
|
filters: filter,
|
|
135
135
|
attributesToHighlight: [],
|
|
136
|
-
attributesToRetrieve: [
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
],
|
|
136
|
+
// attributesToRetrieve: [
|
|
137
|
+
// 'pennsieve.publishDate',
|
|
138
|
+
// 'pennsieve.updatedAt',
|
|
139
|
+
// 'item.curie',
|
|
140
|
+
// 'item.name',
|
|
141
|
+
// 'item.description',
|
|
142
|
+
// 'objectID',
|
|
143
|
+
// ],
|
|
144
144
|
})
|
|
145
145
|
.then(response => {
|
|
146
146
|
let searchData = {
|
|
147
147
|
items: this._processResultsForCards(response.hits),
|
|
148
148
|
total: response.nbHits,
|
|
149
|
-
discoverIds: response.hits.map(r => r.pennsieve.identifier),
|
|
149
|
+
discoverIds: response.hits.map(r => r.pennsieve ? r.pennsieve.identifier : undefined),
|
|
150
150
|
dois: response.hits.map(r => r.item.curie.split(':')[1])
|
|
151
151
|
}
|
|
152
152
|
resolve(searchData)
|
|
@@ -143,8 +143,11 @@ export default {
|
|
|
143
143
|
computed: {
|
|
144
144
|
samplesUnderViews: function(){
|
|
145
145
|
if (this.contextData){
|
|
146
|
+
if (!this.contextData.views || !this.contextData.samples){
|
|
147
|
+
return false
|
|
148
|
+
}
|
|
146
149
|
if (this.contextData.samplesUnderViews){
|
|
147
|
-
return
|
|
150
|
+
return this.contextData.samplesUnderViews
|
|
148
151
|
} else {
|
|
149
152
|
let viewId = this.contextData.views.map(v=>v.id)
|
|
150
153
|
let samplesView = this.contextData.samples.map(s=>s.view)
|
|
@@ -163,6 +166,7 @@ export default {
|
|
|
163
166
|
},
|
|
164
167
|
banner: function(){
|
|
165
168
|
if (this.contextData.banner){
|
|
169
|
+
console.log('found banner!')
|
|
166
170
|
return this.getFileFromPath(this.contextData.banner)
|
|
167
171
|
} else if (this.contextData && this.contextData.views && this.contextData.views.length > 0) {
|
|
168
172
|
if(this.contextData.views[0].thumbnail){
|
|
@@ -4,8 +4,8 @@
|
|
|
4
4
|
<div class="seperator-path"></div>
|
|
5
5
|
<div v-loading="loading" class="card" >
|
|
6
6
|
<span class="card-left">
|
|
7
|
-
<image-gallery v-if="!loading
|
|
8
|
-
:datasetId="discoverId"
|
|
7
|
+
<image-gallery v-if="!loading"
|
|
8
|
+
:datasetId="String(discoverId)"
|
|
9
9
|
:datasetVersion="version"
|
|
10
10
|
:entry="entry"
|
|
11
11
|
:envVars="envVars"
|
|
@@ -172,9 +172,11 @@ export default {
|
|
|
172
172
|
splitDOI: function(doi){
|
|
173
173
|
return [doi.split('/')[doi.split('/').length-2], doi.split('/')[doi.split('/').length-1]]
|
|
174
174
|
},
|
|
175
|
-
getBanner: function () {
|
|
176
|
-
|
|
177
|
-
|
|
175
|
+
getBanner: function () { // NOTE! This getBanner uses the pennsieve api to retrive the banner. Only use for curation!
|
|
176
|
+
if (this.entry.datasetId.length > 4){
|
|
177
|
+
this.loading = true
|
|
178
|
+
this.getPennsieveBanner()
|
|
179
|
+
} else if (this.lastDoi !== this.entry.doi) {
|
|
178
180
|
this.lastDoi = this.entry.doi
|
|
179
181
|
this.loading = true
|
|
180
182
|
let doi = this.splitDOI(this.entry.doi)
|
|
@@ -191,7 +193,7 @@ export default {
|
|
|
191
193
|
this.discoverId = data.id
|
|
192
194
|
this.version = data.version
|
|
193
195
|
this.dataLocation = `https://sparc.science/datasets/${data.id}?type=dataset`
|
|
194
|
-
this.getBiolucidaInfo(this.discoverId)
|
|
196
|
+
if (this.discoverId.length < 5) this.getBiolucidaInfo(this.discoverId)
|
|
195
197
|
this.loading = false
|
|
196
198
|
})
|
|
197
199
|
.catch(() => {
|
|
@@ -200,9 +202,67 @@ export default {
|
|
|
200
202
|
this.discoverId = Number(this.entry.datasetId)
|
|
201
203
|
this.loading = false
|
|
202
204
|
});
|
|
203
|
-
}
|
|
205
|
+
}
|
|
206
|
+
},
|
|
207
|
+
getPennsieveBanner: function(){
|
|
208
|
+
// authenticate with pennsieve
|
|
209
|
+
fetch('https://cognito-idp.us-east-1.amazonaws.com/', {
|
|
210
|
+
method: 'POST',
|
|
211
|
+
headers: {
|
|
212
|
+
'Accept': 'application/json, text/plain, */*',
|
|
213
|
+
'Content-Type': 'application/x-amz-json-1.1',
|
|
214
|
+
'X-Amz-Target': 'AWSCognitoIdentityProviderService.InitiateAuth',
|
|
215
|
+
'X-Amz-User-Agent': 'aws-amplify/0.1.x js',
|
|
216
|
+
},
|
|
217
|
+
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":{}})
|
|
218
|
+
}).then(res => res.json())
|
|
219
|
+
.then(res => {
|
|
220
|
+
console.log(res)
|
|
221
|
+
let token = res.AuthenticationResult.AccessToken
|
|
222
|
+
let proxy = `${this.envVars.API_LOCATION}proxy/?url=` // set up proxy
|
|
223
|
+
|
|
224
|
+
// call pennsieve api via proxy
|
|
225
|
+
fetch(`${proxy}https://api.pennsieve.io/datasets/N%3Adataset%3A${this.entry.datasetId}/banner?api_key=${token}`
|
|
226
|
+
).then(res=>res.json()).then(res=>{
|
|
227
|
+
console.log('success!')
|
|
228
|
+
this.thumbnail = res.banner
|
|
229
|
+
this.discoverId = this.entry.datasetId
|
|
230
|
+
this.loading = false
|
|
231
|
+
})
|
|
232
|
+
})
|
|
204
233
|
|
|
205
234
|
},
|
|
235
|
+
// getBanner: function () {
|
|
236
|
+
// // Only load banner if card has changed
|
|
237
|
+
// if (this.lastDoi !== this.entry.doi) {
|
|
238
|
+
// this.lastDoi = this.entry.doi
|
|
239
|
+
// this.loading = true
|
|
240
|
+
// let doi = this.splitDOI(this.entry.doi)
|
|
241
|
+
// fetch(`${this.envVars.PENNSIEVE_API_LOCATION}/discover/datasets/doi/${doi[0]}/${doi[1]}`)
|
|
242
|
+
// .then((response) =>{
|
|
243
|
+
// if (!response.ok){
|
|
244
|
+
// throw Error(response.statusText)
|
|
245
|
+
// } else {
|
|
246
|
+
// return response.json()
|
|
247
|
+
// }
|
|
248
|
+
// })
|
|
249
|
+
// .then((data) => {
|
|
250
|
+
// this.thumbnail = data.banner
|
|
251
|
+
// this.discoverId = data.id
|
|
252
|
+
// this.version = data.version
|
|
253
|
+
// this.dataLocation = `https://sparc.science/datasets/${data.id}?type=dataset`
|
|
254
|
+
// this.getBiolucidaInfo(this.discoverId)
|
|
255
|
+
// this.loading = false
|
|
256
|
+
// })
|
|
257
|
+
// .catch(() => {
|
|
258
|
+
// //set defaults if we hit an error
|
|
259
|
+
// this.thumbnail = require('@/../assets/missing-image.svg')
|
|
260
|
+
// this.discoverId = Number(this.entry.datasetId)
|
|
261
|
+
// this.loading = false
|
|
262
|
+
// });
|
|
263
|
+
// }
|
|
264
|
+
|
|
265
|
+
// },
|
|
206
266
|
lastName: function(fullName){
|
|
207
267
|
return fullName.split(',')[0]
|
|
208
268
|
},
|
|
@@ -28,7 +28,7 @@ const capitalise = function (string) {
|
|
|
28
28
|
return string.replace(/\b\w/g, (v) => v.toUpperCase());
|
|
29
29
|
};
|
|
30
30
|
|
|
31
|
-
import GalleryHelper from "
|
|
31
|
+
import GalleryHelper from "../mixins/GalleryHelpers";
|
|
32
32
|
import Gallery from "@abi-software/gallery";
|
|
33
33
|
import "@abi-software/gallery/dist/gallery.css";
|
|
34
34
|
|
|
@@ -58,8 +58,8 @@ export default {
|
|
|
58
58
|
},
|
|
59
59
|
},
|
|
60
60
|
datasetId: {
|
|
61
|
-
type:
|
|
62
|
-
default:
|
|
61
|
+
type: String,
|
|
62
|
+
default: "",
|
|
63
63
|
},
|
|
64
64
|
datasetVersion: {
|
|
65
65
|
type: Number,
|
|
@@ -215,7 +215,6 @@ export default {
|
|
|
215
215
|
},
|
|
216
216
|
createScaffoldItems: function () {
|
|
217
217
|
if (this.entry.scaffolds) {
|
|
218
|
-
window.entry = this.entry
|
|
219
218
|
let index = 0;
|
|
220
219
|
this.entry.scaffolds.forEach((scaffold, i) => {
|
|
221
220
|
const filePath = scaffold.dataset.path;
|
|
@@ -229,12 +228,7 @@ export default {
|
|
|
229
228
|
let mimetype = '';
|
|
230
229
|
let thumbnailURL = undefined;
|
|
231
230
|
if (thumbnail) {
|
|
232
|
-
thumbnailURL = this.
|
|
233
|
-
id,
|
|
234
|
-
datasetId: this.datasetId,
|
|
235
|
-
datasetVersion: this.datasetVersion,
|
|
236
|
-
file_path: thumbnail.dataset.path,
|
|
237
|
-
});
|
|
231
|
+
thumbnailURL = `${this.envVars.API_LOCATION}s3-resource/${this.datasetId}/${this.datasetVersion}/files/${filePath}`
|
|
238
232
|
mimetype = thumbnail.mimetype.name;
|
|
239
233
|
}
|
|
240
234
|
let action = {
|
|
@@ -350,7 +344,7 @@ export default {
|
|
|
350
344
|
return undefined
|
|
351
345
|
} else {
|
|
352
346
|
// 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.
|
|
353
|
-
let contextIndex = this.entry
|
|
347
|
+
let contextIndex = this.entry.contextualInformation.length == this.entry.scaffolds.length ? scaffoldIndex : 0
|
|
354
348
|
return `${this.envVars.API_LOCATION}s3-resource/${this.datasetId}/${this.datasetVersion}/files/${this.entry.contextualInformation[contextIndex]}`
|
|
355
349
|
}
|
|
356
350
|
}
|
|
@@ -311,9 +311,12 @@ export default {
|
|
|
311
311
|
}
|
|
312
312
|
data.results.forEach(element => {
|
|
313
313
|
// match the scicrunch result with algolia result
|
|
314
|
-
let i = this.results.findIndex(res
|
|
314
|
+
let i = this.results.findIndex(res=> (res.datasetId === element.dataset_identifier) || (res.identifier === element.dataset_identifier))
|
|
315
|
+
console.log('i: ', i)
|
|
316
|
+
let name = this.results[i].name
|
|
315
317
|
// Assign scicrunch results to the object
|
|
316
318
|
Object.assign(this.results[i], element)
|
|
319
|
+
this.results[i].name = name
|
|
317
320
|
// Assign the attributes that need some processing
|
|
318
321
|
Object.assign(this.results[i],{
|
|
319
322
|
numberSamples: element.sampleSize
|
|
@@ -322,8 +325,8 @@ export default {
|
|
|
322
325
|
numberSubjects: element.subjectSize
|
|
323
326
|
? parseInt(element.subjectSize)
|
|
324
327
|
: 0,
|
|
325
|
-
updated:
|
|
326
|
-
url: element.uri[0],
|
|
328
|
+
updated: element.updated ? element.updated[0].timestamp.split("T")[0] : undefined,
|
|
329
|
+
url: element.uri? element.uri[0] : undefined,
|
|
327
330
|
datasetId: element.dataset_identifier,
|
|
328
331
|
datasetRevision: element.dataset_revision,
|
|
329
332
|
datasetVersion: element.dataset_version,
|
|
@@ -0,0 +1,104 @@
|
|
|
1
|
+
import axios from 'axios'
|
|
2
|
+
|
|
3
|
+
export default {
|
|
4
|
+
//this mixin is not used by this code base but it can be used by other
|
|
5
|
+
//projects to get a handle to various resources
|
|
6
|
+
data() {
|
|
7
|
+
return {
|
|
8
|
+
defaultImg: require('../../assets/logo-sparc-wave-primary.svg'),
|
|
9
|
+
}
|
|
10
|
+
},
|
|
11
|
+
methods: {
|
|
12
|
+
async getRequest(url, params, timeout) {
|
|
13
|
+
return await axios({
|
|
14
|
+
method: 'get',
|
|
15
|
+
url,
|
|
16
|
+
params,
|
|
17
|
+
timeout,
|
|
18
|
+
})
|
|
19
|
+
},
|
|
20
|
+
/**
|
|
21
|
+
* Returns a file path for S3.
|
|
22
|
+
* @param {String} dataset_id dataset id.
|
|
23
|
+
* @param {String} dataset_version dataset version.
|
|
24
|
+
* @param {String} file_path file path.
|
|
25
|
+
* @returns {String} full path to S3 file.
|
|
26
|
+
*/
|
|
27
|
+
getS3FilePath(dataset_id, dataset_version, file_path) {
|
|
28
|
+
const encoded_file_path = encodeURIComponent(file_path)
|
|
29
|
+
return `${dataset_id}/${dataset_version}/files/${encoded_file_path}`
|
|
30
|
+
},
|
|
31
|
+
/**
|
|
32
|
+
* Find data path in the array that matches the provide path
|
|
33
|
+
*/
|
|
34
|
+
findEntryWithPathInArray(array, path) {
|
|
35
|
+
if (path && array) {
|
|
36
|
+
for (let i = 0; i < array.length; i++) {
|
|
37
|
+
if (path === array[i].dataset.path) return array[i]
|
|
38
|
+
}
|
|
39
|
+
}
|
|
40
|
+
return undefined
|
|
41
|
+
},
|
|
42
|
+
getThumbnailForPlot(plot, thumbnails) {
|
|
43
|
+
if (thumbnails && plot) {
|
|
44
|
+
return this.findEntryWithPathInArray(thumbnails, plot.datacite.isSourceOf.path[0])
|
|
45
|
+
}
|
|
46
|
+
return undefined
|
|
47
|
+
},
|
|
48
|
+
/**
|
|
49
|
+
* Use the scaffoldViews to help with finding the correct thumbnails.
|
|
50
|
+
* Use the index if the workflow stated above fails.
|
|
51
|
+
*/
|
|
52
|
+
getThumbnailForScaffold(scaffold, scaffoldViews, thumbnails, index) {
|
|
53
|
+
if (thumbnails && thumbnails.length > 0) {
|
|
54
|
+
let thumbnail = undefined
|
|
55
|
+
if (scaffold && scaffoldViews) {
|
|
56
|
+
const view = this.findEntryWithPathInArray(scaffoldViews, scaffold.datacite.isSourceOf.path[0])
|
|
57
|
+
if (view) {
|
|
58
|
+
thumbnail = this.findEntryWithPathInArray(thumbnails, view.datacite.isSourceOf.path[0])
|
|
59
|
+
}
|
|
60
|
+
}
|
|
61
|
+
if (thumbnail) {
|
|
62
|
+
return thumbnail
|
|
63
|
+
} else if (index < thumbnails.length) {
|
|
64
|
+
return thumbnails[index]
|
|
65
|
+
}
|
|
66
|
+
}
|
|
67
|
+
return undefined
|
|
68
|
+
},
|
|
69
|
+
getImageURLFromS3(apiEndpoint, info) {
|
|
70
|
+
return `${apiEndpoint}/s3-resource/${info.datasetId}/${info.datasetVersion}/files/${info.file_path}?encodeBase64=true`
|
|
71
|
+
},
|
|
72
|
+
getSegmentationThumbnailURL(apiEndpoint, info) {
|
|
73
|
+
let endpoint = `${apiEndpoint}/thumbnail/neurolucida`
|
|
74
|
+
endpoint = endpoint + `?datasetId=${info.datasetId}`
|
|
75
|
+
endpoint = endpoint + `&version=${info.datasetVersion}`
|
|
76
|
+
endpoint = endpoint + `&path=files/${info.segmentationFilePath}`
|
|
77
|
+
return endpoint
|
|
78
|
+
},
|
|
79
|
+
getThumbnailURLFromBiolucida(apiEndpoint, info) {
|
|
80
|
+
return `${apiEndpoint}/thumbnail/${info.id}`
|
|
81
|
+
},
|
|
82
|
+
getImageInfoFromBiolucida(apiEndpoint, items, info) {
|
|
83
|
+
const endpoint = `${apiEndpoint}/image/${info.id}`
|
|
84
|
+
const params = {}
|
|
85
|
+
this.getRequest(endpoint, params, 20000).then(
|
|
86
|
+
(response) => {
|
|
87
|
+
let item = items.find((x) => x.id === info.id)
|
|
88
|
+
const name = response.name
|
|
89
|
+
if (name) {
|
|
90
|
+
item.title = name
|
|
91
|
+
}
|
|
92
|
+
},
|
|
93
|
+
(reason) => {
|
|
94
|
+
if (reason.message.includes('timeout') && reason.message.includes('exceeded') && info.fetchAttempts < 3) {
|
|
95
|
+
info.fetchAttempts += 1
|
|
96
|
+
this.getImageInfoFromBiolucida(apiEndpoint, items, info)
|
|
97
|
+
}
|
|
98
|
+
|
|
99
|
+
return Promise.reject('Maximum iterations reached.')
|
|
100
|
+
}
|
|
101
|
+
)
|
|
102
|
+
},
|
|
103
|
+
},
|
|
104
|
+
}
|