@abi-software/map-side-bar 1.1.8 → 1.1.9
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/LICENSE +201 -201
- package/README.md +53 -53
- package/babel.config.js +14 -14
- package/dist/map-side-bar.common.js +164 -161
- 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 +164 -161
- 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 +13669 -13548
- package/package.json +64 -64
- package/public/index.html +17 -17
- package/src/App.vue +112 -112
- package/src/algolia/algolia.js +99 -98
- package/src/algolia/utils.js +51 -51
- package/src/components/Cascader.vue +49 -49
- package/src/components/ContextCard.vue +95 -95
- package/src/components/DatasetCard.vue +372 -372
- package/src/components/EventBus.js +3 -3
- package/src/components/SearchFilters.vue +443 -442
- package/src/components/SideBar.vue +239 -239
- package/src/components/SidebarContent.vue +439 -440
- package/src/components/Tabs.vue +78 -78
- package/src/components/index.js +8 -8
- package/src/components/scaffold-meta-map.js +29 -29
- package/src/components/species-map.js +8 -8
- package/src/main.js +8 -8
- package/static.json +6 -6
- package/vue.config.js +11 -11
package/package.json
CHANGED
|
@@ -1,64 +1,64 @@
|
|
|
1
|
-
{
|
|
2
|
-
"name": "@abi-software/map-side-bar",
|
|
3
|
-
"version": "1.1.
|
|
4
|
-
"main": "./dist/map-side-bar.common.js",
|
|
5
|
-
"files": [
|
|
6
|
-
"dist/*",
|
|
7
|
-
"src/*",
|
|
8
|
-
"public/*",
|
|
9
|
-
"*.json",
|
|
10
|
-
"*.js"
|
|
11
|
-
],
|
|
12
|
-
"scripts": {
|
|
13
|
-
"serve": "vue-cli-service serve --port 8081",
|
|
14
|
-
"build-bundle": "vue-cli-service build --target lib --name map-side-bar ./src/components/index.js ",
|
|
15
|
-
"build": "vue-cli-service build",
|
|
16
|
-
"lint": "vue-cli-service lint",
|
|
17
|
-
"start": "vue-cli-service serve"
|
|
18
|
-
},
|
|
19
|
-
"dependencies": {
|
|
20
|
-
"@abi-software/svg-sprite": "^0.1.
|
|
21
|
-
"algoliasearch": "^4.10.5",
|
|
22
|
-
"element-ui": "^2.13.0",
|
|
23
|
-
"vue": "^2.6.10"
|
|
24
|
-
},
|
|
25
|
-
"devDependencies": {
|
|
26
|
-
"@vue/cli-plugin-babel": "^4.0.0",
|
|
27
|
-
"@vue/cli-plugin-eslint": "^4.0.0",
|
|
28
|
-
"@vue/cli-service": "^4.0.0",
|
|
29
|
-
"babel-eslint": "^10.0.3",
|
|
30
|
-
"babel-plugin-component": "^1.1.1",
|
|
31
|
-
"eslint": "^5.16.0",
|
|
32
|
-
"eslint-plugin-vue": "^5.0.0",
|
|
33
|
-
"file-loader": "^5.0.2",
|
|
34
|
-
"raw-loader": "^0.5.1",
|
|
35
|
-
"transform-loader": "^0.2.4",
|
|
36
|
-
"typescript": "^4.4.3",
|
|
37
|
-
"vue-custom-element": "^3.3.0",
|
|
38
|
-
"vue-template-compiler": "^2.6.10",
|
|
39
|
-
"webpack-node-externals": "^2.5.2"
|
|
40
|
-
},
|
|
41
|
-
"eslintConfig": {
|
|
42
|
-
"root": true,
|
|
43
|
-
"env": {
|
|
44
|
-
"node": true
|
|
45
|
-
},
|
|
46
|
-
"extends": [
|
|
47
|
-
"plugin:vue/essential",
|
|
48
|
-
"eslint:recommended"
|
|
49
|
-
],
|
|
50
|
-
"rules": {},
|
|
51
|
-
"parserOptions": {
|
|
52
|
-
"parser": "babel-eslint"
|
|
53
|
-
}
|
|
54
|
-
},
|
|
55
|
-
"postcss": {
|
|
56
|
-
"plugins": {
|
|
57
|
-
"autoprefixer": {}
|
|
58
|
-
}
|
|
59
|
-
},
|
|
60
|
-
"browserslist": [
|
|
61
|
-
"> 1%",
|
|
62
|
-
"last 2 versions"
|
|
63
|
-
]
|
|
64
|
-
}
|
|
1
|
+
{
|
|
2
|
+
"name": "@abi-software/map-side-bar",
|
|
3
|
+
"version": "1.1.9",
|
|
4
|
+
"main": "./dist/map-side-bar.common.js",
|
|
5
|
+
"files": [
|
|
6
|
+
"dist/*",
|
|
7
|
+
"src/*",
|
|
8
|
+
"public/*",
|
|
9
|
+
"*.json",
|
|
10
|
+
"*.js"
|
|
11
|
+
],
|
|
12
|
+
"scripts": {
|
|
13
|
+
"serve": "vue-cli-service serve --port 8081",
|
|
14
|
+
"build-bundle": "vue-cli-service build --target lib --name map-side-bar ./src/components/index.js ",
|
|
15
|
+
"build": "vue-cli-service build",
|
|
16
|
+
"lint": "vue-cli-service lint",
|
|
17
|
+
"start": "vue-cli-service serve"
|
|
18
|
+
},
|
|
19
|
+
"dependencies": {
|
|
20
|
+
"@abi-software/svg-sprite": "^0.1.12",
|
|
21
|
+
"algoliasearch": "^4.10.5",
|
|
22
|
+
"element-ui": "^2.13.0",
|
|
23
|
+
"vue": "^2.6.10"
|
|
24
|
+
},
|
|
25
|
+
"devDependencies": {
|
|
26
|
+
"@vue/cli-plugin-babel": "^4.0.0",
|
|
27
|
+
"@vue/cli-plugin-eslint": "^4.0.0",
|
|
28
|
+
"@vue/cli-service": "^4.0.0",
|
|
29
|
+
"babel-eslint": "^10.0.3",
|
|
30
|
+
"babel-plugin-component": "^1.1.1",
|
|
31
|
+
"eslint": "^5.16.0",
|
|
32
|
+
"eslint-plugin-vue": "^5.0.0",
|
|
33
|
+
"file-loader": "^5.0.2",
|
|
34
|
+
"raw-loader": "^0.5.1",
|
|
35
|
+
"transform-loader": "^0.2.4",
|
|
36
|
+
"typescript": "^4.4.3",
|
|
37
|
+
"vue-custom-element": "^3.3.0",
|
|
38
|
+
"vue-template-compiler": "^2.6.10",
|
|
39
|
+
"webpack-node-externals": "^2.5.2"
|
|
40
|
+
},
|
|
41
|
+
"eslintConfig": {
|
|
42
|
+
"root": true,
|
|
43
|
+
"env": {
|
|
44
|
+
"node": true
|
|
45
|
+
},
|
|
46
|
+
"extends": [
|
|
47
|
+
"plugin:vue/essential",
|
|
48
|
+
"eslint:recommended"
|
|
49
|
+
],
|
|
50
|
+
"rules": {},
|
|
51
|
+
"parserOptions": {
|
|
52
|
+
"parser": "babel-eslint"
|
|
53
|
+
}
|
|
54
|
+
},
|
|
55
|
+
"postcss": {
|
|
56
|
+
"plugins": {
|
|
57
|
+
"autoprefixer": {}
|
|
58
|
+
}
|
|
59
|
+
},
|
|
60
|
+
"browserslist": [
|
|
61
|
+
"> 1%",
|
|
62
|
+
"last 2 versions"
|
|
63
|
+
]
|
|
64
|
+
}
|
package/public/index.html
CHANGED
|
@@ -1,17 +1,17 @@
|
|
|
1
|
-
<!DOCTYPE html>
|
|
2
|
-
<html lang="en">
|
|
3
|
-
<head>
|
|
4
|
-
<meta charset="utf-8">
|
|
5
|
-
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
6
|
-
<meta name="viewport" content="width=device-width,initial-scale=1.0">
|
|
7
|
-
<link rel="icon" href="<%= BASE_URL %>favicon.ico">
|
|
8
|
-
<title>scaffoldvuer</title>
|
|
9
|
-
</head>
|
|
10
|
-
<body>
|
|
11
|
-
<noscript>
|
|
12
|
-
<strong>We're sorry but scaffoldvuer doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
|
|
13
|
-
</noscript>
|
|
14
|
-
<map-side-bar></map-side-bar>
|
|
15
|
-
<!-- built files will be auto injected -->
|
|
16
|
-
</body>
|
|
17
|
-
</html>
|
|
1
|
+
<!DOCTYPE html>
|
|
2
|
+
<html lang="en">
|
|
3
|
+
<head>
|
|
4
|
+
<meta charset="utf-8">
|
|
5
|
+
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
6
|
+
<meta name="viewport" content="width=device-width,initial-scale=1.0">
|
|
7
|
+
<link rel="icon" href="<%= BASE_URL %>favicon.ico">
|
|
8
|
+
<title>scaffoldvuer</title>
|
|
9
|
+
</head>
|
|
10
|
+
<body>
|
|
11
|
+
<noscript>
|
|
12
|
+
<strong>We're sorry but scaffoldvuer doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
|
|
13
|
+
</noscript>
|
|
14
|
+
<map-side-bar></map-side-bar>
|
|
15
|
+
<!-- built files will be auto injected -->
|
|
16
|
+
</body>
|
|
17
|
+
</html>
|
package/src/App.vue
CHANGED
|
@@ -1,112 +1,112 @@
|
|
|
1
|
-
<template>
|
|
2
|
-
<div id="app">
|
|
3
|
-
<link rel="stylesheet"
|
|
4
|
-
href="https://fonts.googleapis.com/css?family=Asap:400,400i,500,600,700&display=swap">
|
|
5
|
-
Click arrow to open sidebar
|
|
6
|
-
<el-button @click="openSearch">search 'heart' from refs</el-button>
|
|
7
|
-
<el-button @click="singleFacets">Add to Filter</el-button>
|
|
8
|
-
<el-button @click="multiFacets">multiple facets</el-button>
|
|
9
|
-
<el-button @click="neuronSearch">open neuron search</el-button>
|
|
10
|
-
<SideBar :envVars="envVars" class="side-bar" ref="sideBar" :visible="sideBarVisibility"
|
|
11
|
-
:tabs="tabArray" :activeId="activeId" @tabClicked="tabClicked"
|
|
12
|
-
@search-changed="searchChanged($event)" @actionClick="action"/>
|
|
13
|
-
</div>
|
|
14
|
-
</template>
|
|
15
|
-
|
|
16
|
-
<script>
|
|
17
|
-
/* eslint-disable no-alert, no-console */
|
|
18
|
-
// optionally import default styles
|
|
19
|
-
import SideBar from './components/SideBar'
|
|
20
|
-
|
|
21
|
-
export default {
|
|
22
|
-
name: 'app',
|
|
23
|
-
components: {
|
|
24
|
-
SideBar
|
|
25
|
-
},
|
|
26
|
-
computed: {
|
|
27
|
-
tabs: function(){
|
|
28
|
-
let temp = [...this.tabArray]
|
|
29
|
-
for(let i in this.tabArray){
|
|
30
|
-
temp[i].contextCard = this.contextArray[i]
|
|
31
|
-
}
|
|
32
|
-
return temp
|
|
33
|
-
}
|
|
34
|
-
},
|
|
35
|
-
data: function(){
|
|
36
|
-
return {
|
|
37
|
-
tabArray: [{title: 'Flatmap', id:1},{title: 'Heart Scaffold', id:2},{title: 'Stomach Scaffold', id:3}],
|
|
38
|
-
contextArray: [null,{
|
|
39
|
-
title: "Neural paths mapped to a heart scaffold",
|
|
40
|
-
description: "Points are mapped to their positions on a 3d heart that is mapped to the data.",
|
|
41
|
-
bannerImage: 'https://image.prntscr.com/image/aNIksBFARaKwlKhpnDCKbA.png',
|
|
42
|
-
keys: [{
|
|
43
|
-
image: "https://image.prntscr.com/image/VqNcZ8fSQJu5TJEf9ahwvA.png",
|
|
44
|
-
text: "Neural path"
|
|
45
|
-
}],
|
|
46
|
-
},{
|
|
47
|
-
title: "ICN fitted Scaffold",
|
|
48
|
-
description: "Points are mapped to their positions on a 3d heart that is mapped to the data.",
|
|
49
|
-
bannerImage: 'https://image.prntscr.com/image/BKgqmjSaQjK-B9hy_W7haQ.png',
|
|
50
|
-
keys: [{
|
|
51
|
-
image: "https://image.prntscr.com/image/DO_ZZXl7RtOXgVDv-Vw6yA.png",
|
|
52
|
-
text: "Data type 1"
|
|
53
|
-
},{
|
|
54
|
-
image: "https://image.prntscr.com/image/tsnuRyFZTbmYfSjrMHTK8w.png",
|
|
55
|
-
text: "Data type 2"
|
|
56
|
-
},{
|
|
57
|
-
image: "https://image.prntscr.com/image/DO_ZZXl7RtOXgVDv-Vw6yA.png",
|
|
58
|
-
text: "Data type 3"
|
|
59
|
-
},{
|
|
60
|
-
image: "https://image.prntscr.com/image/tsnuRyFZTbmYfSjrMHTK8w.png",
|
|
61
|
-
text: "Data type 4"
|
|
62
|
-
}
|
|
63
|
-
]
|
|
64
|
-
}],
|
|
65
|
-
sideBarVisibility: true,
|
|
66
|
-
envVars: {
|
|
67
|
-
API_LOCATION: process.env.VUE_APP_API_LOCATION,
|
|
68
|
-
ALGOLIA_KEY: process.env.VUE_APP_ALGOLIA_KEY,
|
|
69
|
-
ALGOLIA_ID: process.env.VUE_APP_ALGOLIA_ID,
|
|
70
|
-
ALGOLIA_INDEX: process.env.VUE_APP_ALGOLIA_INDEX,
|
|
71
|
-
PENNSIEVE_API_LOCATION: process.env.VUE_APP_PENNSIEVE_API_LOCATION
|
|
72
|
-
},
|
|
73
|
-
activeId: 1,
|
|
74
|
-
}
|
|
75
|
-
},
|
|
76
|
-
methods:{
|
|
77
|
-
searchChanged: function(data){
|
|
78
|
-
console.log(data);
|
|
79
|
-
},
|
|
80
|
-
tabClicked: function(id){
|
|
81
|
-
this.activeId = id
|
|
82
|
-
},
|
|
83
|
-
action: function(val){
|
|
84
|
-
console.log("action fired: ", val)
|
|
85
|
-
},
|
|
86
|
-
openSearch: function(){
|
|
87
|
-
this.$refs.sideBar.openSearch('heart', [])
|
|
88
|
-
},
|
|
89
|
-
singleFacets: function(){
|
|
90
|
-
this.$refs.sideBar.addFilter({facet: 'Heart', term:'Anatomical structure', facetPropPath: 'anatomy.organ.name'})
|
|
91
|
-
},
|
|
92
|
-
multiFacets: function(){
|
|
93
|
-
this.$refs.sideBar.openSearch('', [{facet: 'Male', term:'Sex', facetPropPath:'attributes.subject.sex.value'}, {facet: 'Heart', term:'Anatomical structure', facetPropPath: 'anatomy.organ.name'}])
|
|
94
|
-
},
|
|
95
|
-
neuronSearch: function(){
|
|
96
|
-
this.$refs.sideBar.openNeuronSearch('neuron-type-keast-10')
|
|
97
|
-
}
|
|
98
|
-
}
|
|
99
|
-
}
|
|
100
|
-
</script>
|
|
101
|
-
|
|
102
|
-
<style>
|
|
103
|
-
#app {
|
|
104
|
-
height:100%;
|
|
105
|
-
width: 100%;
|
|
106
|
-
position:absolute;
|
|
107
|
-
font-family: "Asap",sans-serif;
|
|
108
|
-
}
|
|
109
|
-
body {
|
|
110
|
-
margin:0px;
|
|
111
|
-
}
|
|
112
|
-
</style>
|
|
1
|
+
<template>
|
|
2
|
+
<div id="app">
|
|
3
|
+
<link rel="stylesheet"
|
|
4
|
+
href="https://fonts.googleapis.com/css?family=Asap:400,400i,500,600,700&display=swap">
|
|
5
|
+
Click arrow to open sidebar
|
|
6
|
+
<el-button @click="openSearch">search 'heart' from refs</el-button>
|
|
7
|
+
<el-button @click="singleFacets">Add to Filter</el-button>
|
|
8
|
+
<el-button @click="multiFacets">multiple facets</el-button>
|
|
9
|
+
<el-button @click="neuronSearch">open neuron search</el-button>
|
|
10
|
+
<SideBar :envVars="envVars" class="side-bar" ref="sideBar" :visible="sideBarVisibility"
|
|
11
|
+
:tabs="tabArray" :activeId="activeId" @tabClicked="tabClicked"
|
|
12
|
+
@search-changed="searchChanged($event)" @actionClick="action"/>
|
|
13
|
+
</div>
|
|
14
|
+
</template>
|
|
15
|
+
|
|
16
|
+
<script>
|
|
17
|
+
/* eslint-disable no-alert, no-console */
|
|
18
|
+
// optionally import default styles
|
|
19
|
+
import SideBar from './components/SideBar'
|
|
20
|
+
|
|
21
|
+
export default {
|
|
22
|
+
name: 'app',
|
|
23
|
+
components: {
|
|
24
|
+
SideBar
|
|
25
|
+
},
|
|
26
|
+
computed: {
|
|
27
|
+
tabs: function(){
|
|
28
|
+
let temp = [...this.tabArray]
|
|
29
|
+
for(let i in this.tabArray){
|
|
30
|
+
temp[i].contextCard = this.contextArray[i]
|
|
31
|
+
}
|
|
32
|
+
return temp
|
|
33
|
+
}
|
|
34
|
+
},
|
|
35
|
+
data: function(){
|
|
36
|
+
return {
|
|
37
|
+
tabArray: [{title: 'Flatmap', id:1},{title: 'Heart Scaffold', id:2},{title: 'Stomach Scaffold', id:3}],
|
|
38
|
+
contextArray: [null,{
|
|
39
|
+
title: "Neural paths mapped to a heart scaffold",
|
|
40
|
+
description: "Points are mapped to their positions on a 3d heart that is mapped to the data.",
|
|
41
|
+
bannerImage: 'https://image.prntscr.com/image/aNIksBFARaKwlKhpnDCKbA.png',
|
|
42
|
+
keys: [{
|
|
43
|
+
image: "https://image.prntscr.com/image/VqNcZ8fSQJu5TJEf9ahwvA.png",
|
|
44
|
+
text: "Neural path"
|
|
45
|
+
}],
|
|
46
|
+
},{
|
|
47
|
+
title: "ICN fitted Scaffold",
|
|
48
|
+
description: "Points are mapped to their positions on a 3d heart that is mapped to the data.",
|
|
49
|
+
bannerImage: 'https://image.prntscr.com/image/BKgqmjSaQjK-B9hy_W7haQ.png',
|
|
50
|
+
keys: [{
|
|
51
|
+
image: "https://image.prntscr.com/image/DO_ZZXl7RtOXgVDv-Vw6yA.png",
|
|
52
|
+
text: "Data type 1"
|
|
53
|
+
},{
|
|
54
|
+
image: "https://image.prntscr.com/image/tsnuRyFZTbmYfSjrMHTK8w.png",
|
|
55
|
+
text: "Data type 2"
|
|
56
|
+
},{
|
|
57
|
+
image: "https://image.prntscr.com/image/DO_ZZXl7RtOXgVDv-Vw6yA.png",
|
|
58
|
+
text: "Data type 3"
|
|
59
|
+
},{
|
|
60
|
+
image: "https://image.prntscr.com/image/tsnuRyFZTbmYfSjrMHTK8w.png",
|
|
61
|
+
text: "Data type 4"
|
|
62
|
+
}
|
|
63
|
+
]
|
|
64
|
+
}],
|
|
65
|
+
sideBarVisibility: true,
|
|
66
|
+
envVars: {
|
|
67
|
+
API_LOCATION: process.env.VUE_APP_API_LOCATION,
|
|
68
|
+
ALGOLIA_KEY: process.env.VUE_APP_ALGOLIA_KEY,
|
|
69
|
+
ALGOLIA_ID: process.env.VUE_APP_ALGOLIA_ID,
|
|
70
|
+
ALGOLIA_INDEX: process.env.VUE_APP_ALGOLIA_INDEX,
|
|
71
|
+
PENNSIEVE_API_LOCATION: process.env.VUE_APP_PENNSIEVE_API_LOCATION
|
|
72
|
+
},
|
|
73
|
+
activeId: 1,
|
|
74
|
+
}
|
|
75
|
+
},
|
|
76
|
+
methods:{
|
|
77
|
+
searchChanged: function(data){
|
|
78
|
+
console.log(data);
|
|
79
|
+
},
|
|
80
|
+
tabClicked: function(id){
|
|
81
|
+
this.activeId = id
|
|
82
|
+
},
|
|
83
|
+
action: function(val){
|
|
84
|
+
console.log("action fired: ", val)
|
|
85
|
+
},
|
|
86
|
+
openSearch: function(){
|
|
87
|
+
this.$refs.sideBar.openSearch('heart', [])
|
|
88
|
+
},
|
|
89
|
+
singleFacets: function(){
|
|
90
|
+
this.$refs.sideBar.addFilter({facet: 'Heart', term:'Anatomical structure', facetPropPath: 'anatomy.organ.name'})
|
|
91
|
+
},
|
|
92
|
+
multiFacets: function(){
|
|
93
|
+
this.$refs.sideBar.openSearch('', [{facet: 'Male', term:'Sex', facetPropPath:'attributes.subject.sex.value'}, {facet: 'Heart', term:'Anatomical structure', facetPropPath: 'anatomy.organ.name'}])
|
|
94
|
+
},
|
|
95
|
+
neuronSearch: function(){
|
|
96
|
+
this.$refs.sideBar.openNeuronSearch('neuron-type-keast-10')
|
|
97
|
+
}
|
|
98
|
+
}
|
|
99
|
+
}
|
|
100
|
+
</script>
|
|
101
|
+
|
|
102
|
+
<style>
|
|
103
|
+
#app {
|
|
104
|
+
height:100%;
|
|
105
|
+
width: 100%;
|
|
106
|
+
position:absolute;
|
|
107
|
+
font-family: "Asap",sans-serif;
|
|
108
|
+
}
|
|
109
|
+
body {
|
|
110
|
+
margin:0px;
|
|
111
|
+
}
|
|
112
|
+
</style>
|
package/src/algolia/algolia.js
CHANGED
|
@@ -1,98 +1,99 @@
|
|
|
1
|
-
/* eslint-disable no-alert, no-console */
|
|
2
|
-
import algoliasearch from 'algoliasearch'
|
|
3
|
-
|
|
4
|
-
// export `createAlgoliaClient` to use it in page components
|
|
5
|
-
export class AlgoliaClient {
|
|
6
|
-
constructor(algoliaId, algoliaKey, PENNSIEVE_API_LOCATION='https://api.pennsieve.io') {
|
|
7
|
-
this.client = algoliasearch(
|
|
8
|
-
algoliaId,
|
|
9
|
-
algoliaKey
|
|
10
|
-
)
|
|
11
|
-
this.PENNSIEVE_API_LOCATION = PENNSIEVE_API_LOCATION
|
|
12
|
-
}
|
|
13
|
-
initIndex(ALGOLIA_INDEX) {
|
|
14
|
-
this.index = this.client.initIndex(ALGOLIA_INDEX);
|
|
15
|
-
}
|
|
16
|
-
|
|
17
|
-
getAlgoliaFacets (propPathMapping) {
|
|
18
|
-
const map = new Map(Object.entries(propPathMapping));
|
|
19
|
-
const facetPropPaths = Array.from(map.keys() );
|
|
20
|
-
let facetData = []
|
|
21
|
-
let facetId = 0
|
|
22
|
-
return this.index
|
|
23
|
-
.search('', {
|
|
24
|
-
sortFacetValuesBy: 'alpha',
|
|
25
|
-
facets: facetPropPaths
|
|
26
|
-
})
|
|
27
|
-
.then(response => {
|
|
28
|
-
facetPropPaths.map((facetPropPath) => {
|
|
29
|
-
var children = []
|
|
30
|
-
const responseFacets = response.facets
|
|
31
|
-
if (responseFacets === undefined) {return}
|
|
32
|
-
const responseFacetChildren =
|
|
33
|
-
responseFacets[facetPropPath] == undefined
|
|
34
|
-
? {}
|
|
35
|
-
: responseFacets[facetPropPath]
|
|
36
|
-
Object.keys(responseFacetChildren).map(facet => {
|
|
37
|
-
children.push({
|
|
38
|
-
label: facet,
|
|
39
|
-
id: facetId++,
|
|
40
|
-
facetPropPath: facetPropPath
|
|
41
|
-
})
|
|
42
|
-
})
|
|
43
|
-
if (children.length > 0) {
|
|
44
|
-
facetData.push({
|
|
45
|
-
label: map.get(facetPropPath),
|
|
46
|
-
id: facetId++,
|
|
47
|
-
children: children,
|
|
48
|
-
key: facetPropPath
|
|
49
|
-
})
|
|
50
|
-
}
|
|
51
|
-
})
|
|
52
|
-
return facetData
|
|
53
|
-
})
|
|
54
|
-
}
|
|
55
|
-
|
|
56
|
-
// Returns all DOIs of all versions for a given discover dataset
|
|
57
|
-
_discoverAllDois (discoverId, PENNSIEVE_API_LOCATION='https://api.pennsieve.io') {
|
|
58
|
-
return new Promise(resolve => {
|
|
59
|
-
fetch(`${PENNSIEVE_API_LOCATION}/discover/datasets/${discoverId}/versions`).then(r=>r.json()).then(dataset => {
|
|
60
|
-
resolve(dataset.map(version => version.doi))
|
|
61
|
-
})
|
|
62
|
-
})
|
|
63
|
-
}
|
|
64
|
-
|
|
65
|
-
// Get all dois given a list of discoverIds
|
|
66
|
-
_expandDois (discoverIds, PENNSIEVE_API_LOCATION='https://api.pennsieve.io') {
|
|
67
|
-
return new Promise(resolve => {
|
|
68
|
-
let promiseList = discoverIds.map(discoverId => this._discoverAllDois(discoverId, PENNSIEVE_API_LOCATION))
|
|
69
|
-
Promise.all(promiseList).then((values) => {
|
|
70
|
-
resolve(values.flat())
|
|
71
|
-
});
|
|
72
|
-
})
|
|
73
|
-
}
|
|
74
|
-
|
|
75
|
-
/**
|
|
76
|
-
* Get Search results
|
|
77
|
-
* This is using fetch from the Algolia API
|
|
78
|
-
*/
|
|
79
|
-
search (filter, query='', hitsperPage=10, page=1) {
|
|
80
|
-
return new Promise(resolve => {
|
|
81
|
-
this.index
|
|
82
|
-
.search(query, {
|
|
83
|
-
facets:['*'],
|
|
84
|
-
hitsPerPage: hitsperPage,
|
|
85
|
-
page: page-1,
|
|
86
|
-
filters: filter
|
|
87
|
-
})
|
|
88
|
-
.then(response => {
|
|
89
|
-
let searchData = {
|
|
90
|
-
items: response.hits,
|
|
91
|
-
total: response.nbHits,
|
|
92
|
-
discoverIds: response.hits.map(r=>r.pennsieve.identifier)
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
}
|
|
1
|
+
/* eslint-disable no-alert, no-console */
|
|
2
|
+
import algoliasearch from 'algoliasearch'
|
|
3
|
+
|
|
4
|
+
// export `createAlgoliaClient` to use it in page components
|
|
5
|
+
export class AlgoliaClient {
|
|
6
|
+
constructor(algoliaId, algoliaKey, PENNSIEVE_API_LOCATION='https://api.pennsieve.io') {
|
|
7
|
+
this.client = algoliasearch(
|
|
8
|
+
algoliaId,
|
|
9
|
+
algoliaKey
|
|
10
|
+
)
|
|
11
|
+
this.PENNSIEVE_API_LOCATION = PENNSIEVE_API_LOCATION
|
|
12
|
+
}
|
|
13
|
+
initIndex(ALGOLIA_INDEX) {
|
|
14
|
+
this.index = this.client.initIndex(ALGOLIA_INDEX);
|
|
15
|
+
}
|
|
16
|
+
|
|
17
|
+
getAlgoliaFacets (propPathMapping) {
|
|
18
|
+
const map = new Map(Object.entries(propPathMapping));
|
|
19
|
+
const facetPropPaths = Array.from(map.keys() );
|
|
20
|
+
let facetData = []
|
|
21
|
+
let facetId = 0
|
|
22
|
+
return this.index
|
|
23
|
+
.search('', {
|
|
24
|
+
sortFacetValuesBy: 'alpha',
|
|
25
|
+
facets: facetPropPaths
|
|
26
|
+
})
|
|
27
|
+
.then(response => {
|
|
28
|
+
facetPropPaths.map((facetPropPath) => {
|
|
29
|
+
var children = []
|
|
30
|
+
const responseFacets = response.facets
|
|
31
|
+
if (responseFacets === undefined) {return}
|
|
32
|
+
const responseFacetChildren =
|
|
33
|
+
responseFacets[facetPropPath] == undefined
|
|
34
|
+
? {}
|
|
35
|
+
: responseFacets[facetPropPath]
|
|
36
|
+
Object.keys(responseFacetChildren).map(facet => {
|
|
37
|
+
children.push({
|
|
38
|
+
label: facet,
|
|
39
|
+
id: facetId++,
|
|
40
|
+
facetPropPath: facetPropPath
|
|
41
|
+
})
|
|
42
|
+
})
|
|
43
|
+
if (children.length > 0) {
|
|
44
|
+
facetData.push({
|
|
45
|
+
label: map.get(facetPropPath),
|
|
46
|
+
id: facetId++,
|
|
47
|
+
children: children,
|
|
48
|
+
key: facetPropPath
|
|
49
|
+
})
|
|
50
|
+
}
|
|
51
|
+
})
|
|
52
|
+
return facetData
|
|
53
|
+
})
|
|
54
|
+
}
|
|
55
|
+
|
|
56
|
+
// Returns all DOIs of all versions for a given discover dataset
|
|
57
|
+
_discoverAllDois (discoverId, PENNSIEVE_API_LOCATION='https://api.pennsieve.io') {
|
|
58
|
+
return new Promise(resolve => {
|
|
59
|
+
fetch(`${PENNSIEVE_API_LOCATION}/discover/datasets/${discoverId}/versions`).then(r=>r.json()).then(dataset => {
|
|
60
|
+
resolve(dataset.map(version => version.doi))
|
|
61
|
+
})
|
|
62
|
+
})
|
|
63
|
+
}
|
|
64
|
+
|
|
65
|
+
// Get all dois given a list of discoverIds
|
|
66
|
+
_expandDois (discoverIds, PENNSIEVE_API_LOCATION='https://api.pennsieve.io') {
|
|
67
|
+
return new Promise(resolve => {
|
|
68
|
+
let promiseList = discoverIds.map(discoverId => this._discoverAllDois(discoverId, PENNSIEVE_API_LOCATION))
|
|
69
|
+
Promise.all(promiseList).then((values) => {
|
|
70
|
+
resolve(values.flat())
|
|
71
|
+
});
|
|
72
|
+
})
|
|
73
|
+
}
|
|
74
|
+
|
|
75
|
+
/**
|
|
76
|
+
* Get Search results
|
|
77
|
+
* This is using fetch from the Algolia API
|
|
78
|
+
*/
|
|
79
|
+
search (filter, query='', hitsperPage=10, page=1) {
|
|
80
|
+
return new Promise(resolve => {
|
|
81
|
+
this.index
|
|
82
|
+
.search(query, {
|
|
83
|
+
facets:['*'],
|
|
84
|
+
hitsPerPage: hitsperPage,
|
|
85
|
+
page: page-1,
|
|
86
|
+
filters: filter
|
|
87
|
+
})
|
|
88
|
+
.then(response => {
|
|
89
|
+
let searchData = {
|
|
90
|
+
items: response.hits,
|
|
91
|
+
total: response.nbHits,
|
|
92
|
+
discoverIds: response.hits.map(r=>r.pennsieve.identifier),
|
|
93
|
+
dois: response.hits.map(r=>r.item.curie.split(':')[1])
|
|
94
|
+
}
|
|
95
|
+
resolve(searchData)
|
|
96
|
+
})
|
|
97
|
+
})
|
|
98
|
+
}
|
|
99
|
+
}
|