@abi-software/map-side-bar 1.5.0 → 1.5.2

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.
Files changed (37) hide show
  1. package/CHANGELOG.md +228 -228
  2. package/LICENSE +201 -201
  3. package/README.md +146 -146
  4. package/babel.config.js +14 -14
  5. package/dist/map-side-bar.common.js +423 -182
  6. package/dist/map-side-bar.common.js.map +1 -1
  7. package/dist/map-side-bar.css +1 -1
  8. package/dist/map-side-bar.umd.js +423 -182
  9. package/dist/map-side-bar.umd.js.map +1 -1
  10. package/dist/map-side-bar.umd.min.js +1 -1
  11. package/dist/map-side-bar.umd.min.js.map +1 -1
  12. package/package-lock.json +14536 -14536
  13. package/package.json +75 -75
  14. package/public/index.html +17 -17
  15. package/src/App.vue +164 -164
  16. package/src/algolia/algolia.js +188 -188
  17. package/src/algolia/utils.js +69 -69
  18. package/src/assets/_variables.scss +43 -43
  19. package/src/assets/styles.scss +7 -7
  20. package/src/components/BadgesGroup.vue +144 -144
  21. package/src/components/Cascader.vue +49 -49
  22. package/src/components/ContextCard.vue +397 -397
  23. package/src/components/DatasetCard.vue +328 -328
  24. package/src/components/EventBus.js +3 -3
  25. package/src/components/ImageGallery.vue +531 -531
  26. package/src/components/SearchFilters.vue +586 -587
  27. package/src/components/SearchHistory.vue +146 -0
  28. package/src/components/SideBar.vue +235 -232
  29. package/src/components/SidebarContent.vue +564 -554
  30. package/src/components/Tabs.vue +78 -78
  31. package/src/components/hardcoded-context-info.js +79 -79
  32. package/src/components/index.js +8 -8
  33. package/src/components/species-map.js +8 -8
  34. package/src/main.js +8 -8
  35. package/src/mixins/S3Bucket.vue +31 -31
  36. package/static.json +6 -6
  37. package/vue.config.js +19 -19
@@ -1,144 +1,144 @@
1
- <template>
2
- <div v-if="categories['All'].size > 1" class="container" ref="container">
3
- <div>
4
- View data types:
5
- </div>
6
- <template v-for="(item, key) in categories" >
7
- <el-button
8
- v-if="item.size > 0"
9
- :class="[{ 'active': key == active},'tag-button']"
10
- @click="categoryClicked(key)"
11
- size="small" :key="key">{{ key + " (" + item.size + ")" }}
12
- </el-button>
13
- </template>
14
- </div>
15
- </template>
16
-
17
-
18
- <script>
19
- /* eslint-disable no-alert, no-console */
20
- import Vue from "vue";
21
- import { Button } from "element-ui";
22
- import lang from "element-ui/lib/locale/lang/en";
23
- import locale from "element-ui/lib/locale";
24
-
25
- locale.use(lang);
26
- Vue.use(Button);
27
-
28
- export default {
29
- name: "BadgesGroup",
30
- props: {
31
- /**
32
- * Object containing information for
33
- * the required viewing.
34
- */
35
- additionalLinks: {
36
- type: Array,
37
- default: () => {
38
- return [];
39
- },
40
- },
41
- datasetBiolucida: {
42
- type: Object,
43
- default: () => {
44
- return {};
45
- },
46
- },
47
- entry: {
48
- type: Object,
49
- default: () => {
50
- return {};
51
- },
52
- },
53
- },
54
- data: function () {
55
- return {
56
- //Always start with 1 image - the dataset thumbnail itself
57
- categories: { "All": {size: 1}, "Dataset": {size: 1} },
58
- active: "All"
59
- };
60
- },
61
- methods: {
62
- addToCategories: function (array, name) {
63
- if (array && array.length > 0) {
64
- this.categories[name] = { size: array.length };
65
- this.categories["All"].size += array.length;
66
- }
67
- },
68
- addSimulationsToCategories: function (array) {
69
- if (array && array.length > 0) {
70
- const size = 1;
71
- this.categories["Simulations"] = { size };
72
- this.categories["All"].size += size;
73
- }
74
- },
75
- categoryClicked: function(name) {
76
- this.active = name;
77
- this.$emit("categoryChanged", name);
78
- }
79
- },
80
- watch: {
81
- datasetBiolucida: {
82
- deep: true,
83
- immediate: true,
84
- handler: function (biolucidaData) {
85
- if ("dataset_images" in biolucidaData) {
86
- this.addToCategories(biolucidaData["dataset_images"], "Images");
87
- }
88
- }
89
- },
90
- entry: {
91
- deep: true,
92
- immediate: true,
93
- handler: function () {
94
- this.addToCategories(this.entry.scaffolds, 'Scaffolds');
95
- this.addToCategories(this.entry.segmentation, 'Segmentations');
96
- this.addToCategories(this.entry.plots, 'Plots');
97
- this.addSimulationsToCategories(this.entry.simulation);
98
- /** disable the following
99
- this.addToCategories(this.entry.images, 'Images');
100
- this.addToCategories(this.entry.videos, 'Videos');
101
- **/
102
- }
103
- }
104
- },
105
- };
106
- </script>
107
-
108
- <!-- Add "scoped" attribute to limit CSS to this component only -->
109
- <style scoped lang="scss">
110
- @import "~element-ui/packages/theme-chalk/src/button";
111
-
112
- .tag-button,
113
- .tag-button:hover,
114
- .tag-button:focus,
115
- .tag-button.active
116
- {
117
- border-radius: 4px;
118
- font-size: 0.75rem;
119
- padding: 0.2rem 0.2rem;
120
- margin: 0.5rem 0 0 0;
121
- margin-right: 0.75rem!important;
122
- }
123
-
124
- .tag-button,
125
- .tag-button:hover,
126
- .tag-button:focus
127
- {
128
- background: #f9f2fc;
129
- border: 1px solid $app-primary-color;
130
- color: $app-primary-color;
131
- }
132
-
133
- .tag-button.active
134
- {
135
- background: $app-primary-color;
136
- border: 1px solid $app-primary-color;
137
- color: #fff;
138
- }
139
-
140
- .tag-button+.tag-button
141
- {
142
- margin-left:0;
143
- }
144
- </style>
1
+ <template>
2
+ <div v-if="categories['All'].size > 1" class="container" ref="container">
3
+ <div>
4
+ View data types:
5
+ </div>
6
+ <template v-for="(item, key) in categories" >
7
+ <el-button
8
+ v-if="item.size > 0"
9
+ :class="[{ 'active': key == active},'tag-button']"
10
+ @click="categoryClicked(key)"
11
+ size="small" :key="key">{{ key + " (" + item.size + ")" }}
12
+ </el-button>
13
+ </template>
14
+ </div>
15
+ </template>
16
+
17
+
18
+ <script>
19
+ /* eslint-disable no-alert, no-console */
20
+ import Vue from "vue";
21
+ import { Button } from "element-ui";
22
+ import lang from "element-ui/lib/locale/lang/en";
23
+ import locale from "element-ui/lib/locale";
24
+
25
+ locale.use(lang);
26
+ Vue.use(Button);
27
+
28
+ export default {
29
+ name: "BadgesGroup",
30
+ props: {
31
+ /**
32
+ * Object containing information for
33
+ * the required viewing.
34
+ */
35
+ additionalLinks: {
36
+ type: Array,
37
+ default: () => {
38
+ return [];
39
+ },
40
+ },
41
+ datasetBiolucida: {
42
+ type: Object,
43
+ default: () => {
44
+ return {};
45
+ },
46
+ },
47
+ entry: {
48
+ type: Object,
49
+ default: () => {
50
+ return {};
51
+ },
52
+ },
53
+ },
54
+ data: function () {
55
+ return {
56
+ //Always start with 1 image - the dataset thumbnail itself
57
+ categories: { "All": {size: 1}, "Dataset": {size: 1} },
58
+ active: "All"
59
+ };
60
+ },
61
+ methods: {
62
+ addToCategories: function (array, name) {
63
+ if (array && array.length > 0) {
64
+ this.categories[name] = { size: array.length };
65
+ this.categories["All"].size += array.length;
66
+ }
67
+ },
68
+ addSimulationsToCategories: function (array) {
69
+ if (array && array.length > 0) {
70
+ const size = 1;
71
+ this.categories["Simulations"] = { size };
72
+ this.categories["All"].size += size;
73
+ }
74
+ },
75
+ categoryClicked: function(name) {
76
+ this.active = name;
77
+ this.$emit("categoryChanged", name);
78
+ }
79
+ },
80
+ watch: {
81
+ datasetBiolucida: {
82
+ deep: true,
83
+ immediate: true,
84
+ handler: function (biolucidaData) {
85
+ if ("dataset_images" in biolucidaData) {
86
+ this.addToCategories(biolucidaData["dataset_images"], "Images");
87
+ }
88
+ }
89
+ },
90
+ entry: {
91
+ deep: true,
92
+ immediate: true,
93
+ handler: function () {
94
+ this.addToCategories(this.entry.scaffolds, 'Scaffolds');
95
+ this.addToCategories(this.entry.segmentation, 'Segmentations');
96
+ this.addToCategories(this.entry.plots, 'Plots');
97
+ this.addSimulationsToCategories(this.entry.simulation);
98
+ /** disable the following
99
+ this.addToCategories(this.entry.images, 'Images');
100
+ this.addToCategories(this.entry.videos, 'Videos');
101
+ **/
102
+ }
103
+ }
104
+ },
105
+ };
106
+ </script>
107
+
108
+ <!-- Add "scoped" attribute to limit CSS to this component only -->
109
+ <style scoped lang="scss">
110
+ @import "~element-ui/packages/theme-chalk/src/button";
111
+
112
+ .tag-button,
113
+ .tag-button:hover,
114
+ .tag-button:focus,
115
+ .tag-button.active
116
+ {
117
+ border-radius: 4px;
118
+ font-size: 0.75rem;
119
+ padding: 0.2rem 0.2rem;
120
+ margin: 0.5rem 0 0 0;
121
+ margin-right: 0.75rem!important;
122
+ }
123
+
124
+ .tag-button,
125
+ .tag-button:hover,
126
+ .tag-button:focus
127
+ {
128
+ background: #f9f2fc;
129
+ border: 1px solid $app-primary-color;
130
+ color: $app-primary-color;
131
+ }
132
+
133
+ .tag-button.active
134
+ {
135
+ background: $app-primary-color;
136
+ border: 1px solid $app-primary-color;
137
+ color: #fff;
138
+ }
139
+
140
+ .tag-button+.tag-button
141
+ {
142
+ margin-left:0;
143
+ }
144
+ </style>
@@ -1,49 +1,49 @@
1
- <script>
2
- /* eslint-disable no-alert, no-console */
3
- import { Cascader } from "element-ui";
4
-
5
- export default {
6
- name: 'CustomCascader',
7
- extends: Cascader,
8
- methods:{
9
- //Modify this internal function to disable Show all tags
10
- computePresentTags() {
11
- const { isDisabled, leafOnly, showAllLevels, separator, collapseTags } = this;
12
- const checkedNodes = this.getCheckedNodes(leafOnly);
13
- const tags = [];
14
- const genTag = node => ({
15
- node,
16
- key: node.uid,
17
- text: node.getText(showAllLevels, separator),
18
- hitState: false,
19
- closable: !isDisabled && !node.isDisabled
20
- });
21
- let customNodes = checkedNodes.filter(node =>
22
- {
23
- return !(node.getText(showAllLevels, separator).includes("Show all"));
24
- }
25
- );
26
- if (customNodes.length) {
27
- const [first, ...rest] = customNodes;
28
- const restCount = rest.length;
29
- tags.push(genTag(first));
30
- if (restCount) {
31
- if (collapseTags) {
32
- tags.push({
33
- key: -1,
34
- text: `+ ${restCount}`,
35
- closable: false
36
- });
37
- } else {
38
- rest.forEach(node => tags.push(genTag(node)));
39
- }
40
- }
41
- }
42
- this.checkedNodes = checkedNodes;
43
- this.presentTags = tags;
44
- this.$emit("tags-changed", this.presentTags);
45
- }
46
- }
47
- }
48
-
49
- </script>
1
+ <script>
2
+ /* eslint-disable no-alert, no-console */
3
+ import { Cascader } from "element-ui";
4
+
5
+ export default {
6
+ name: 'CustomCascader',
7
+ extends: Cascader,
8
+ methods:{
9
+ //Modify this internal function to disable Show all tags
10
+ computePresentTags() {
11
+ const { isDisabled, leafOnly, showAllLevels, separator, collapseTags } = this;
12
+ const checkedNodes = this.getCheckedNodes(leafOnly);
13
+ const tags = [];
14
+ const genTag = node => ({
15
+ node,
16
+ key: node.uid,
17
+ text: node.getText(showAllLevels, separator),
18
+ hitState: false,
19
+ closable: !isDisabled && !node.isDisabled
20
+ });
21
+ let customNodes = checkedNodes.filter(node =>
22
+ {
23
+ return !(node.getText(showAllLevels, separator).includes("Show all"));
24
+ }
25
+ );
26
+ if (customNodes.length) {
27
+ const [first, ...rest] = customNodes;
28
+ const restCount = rest.length;
29
+ tags.push(genTag(first));
30
+ if (restCount) {
31
+ if (collapseTags) {
32
+ tags.push({
33
+ key: -1,
34
+ text: `+ ${restCount}`,
35
+ closable: false
36
+ });
37
+ } else {
38
+ rest.forEach(node => tags.push(genTag(node)));
39
+ }
40
+ }
41
+ }
42
+ this.checkedNodes = checkedNodes;
43
+ this.presentTags = tags;
44
+ this.$emit("tags-changed", this.presentTags);
45
+ }
46
+ }
47
+ }
48
+
49
+ </script>