diff --git a/src/components/AnnotationSelector.vue b/src/components/AnnotationSelector.vue
index ec75a6c..054293d 100644
--- a/src/components/AnnotationSelector.vue
+++ b/src/components/AnnotationSelector.vue
@@ -229,17 +229,15 @@ export default {
*/
computeSelectedAnnotations(newVal, selectedCategories) {
let sc = new Set(selectedCategories.map(sc => getCategoryId(sc)));
- let selectedAnnotations = newVal
+ return newVal
// exclude annotations from selected categories
.filter(a => !sc.has(a.split(SEPARATOR, 2)[0]))
- .map(a => this.annotationById[a]);
- selectedAnnotations.forEach(a => {
- if (!a) {
- console.warn('Term is not selectable');
- }
+ .map(a => this.annotationById[a] || {
+ classUri: a.split(SEPARATOR, 2)[0],
+ className: "",
+ termUri: a.split(SEPARATOR, 2)[1],
+ termName: ""
});
-
- return selectedAnnotations.filter(a => a)
},
/**
* Selected categories.
diff --git a/src/components/DatasetPreview.vue b/src/components/DatasetPreview.vue
index 72ef8a7..bb80152 100644
--- a/src/components/DatasetPreview.vue
+++ b/src/components/DatasetPreview.vue
@@ -2,20 +2,15 @@
{{ dataset.name }}
-
- {{ term.termName }}
- mdi-plus
-
-
+ class="text-capitalize mb-1 mr-1">
{{ term.termName }}
+ mdi-plus
+ mdi-minus
@@ -51,6 +46,7 @@ export default {
selectedAnnotations: Array,
availableAnnotations: Array
},
+ events: ["annotation-selected", "annotation-unselected"],
data() {
return {
includedTerms: []
@@ -126,13 +122,20 @@ export default {
* @param term
* @returns {boolean}
*/
- isClickable(term) {
- return this.availableAnnotationIds.has(this.getId(term))
- && !this.selectedCategoryIds.has(getCategoryId(term))
- && !this.selectedAnnotationIds.has(this.getId(term));
+ isSelectable(term) {
+ return !this.selectedCategoryIds.has(getCategoryId(term)) && !this.selectedAnnotationIds.has(this.getId(term));
+ },
+ isUnselectable(term) {
+ return this.selectedAnnotationIds.has(this.getId(term));
},
handleChipClick(term) {
- this.$emit("chip-clicked", term);
+ if (this.isSelectable(term)) {
+ this.$emit("annotation-selected", term);
+ } else if (this.isUnselectable(term)) {
+ this.$emit("annotation-unselected", term);
+ } else {
+ console.warn(`Term ${term} cannot be unselected.`, term);
+ }
},
getChipColor(objectClass) {
return this.chipColorMap[objectClass] || "orange";
@@ -144,7 +147,19 @@ export default {
updateTerms() {
this.includedTerms = [];
this.getTerms().then(terms => {
- this.includedTerms = terms.sort((a, b) => OBJECT_CLASS_PRIORITY[a.objectClass] - OBJECT_CLASS_PRIORITY[b.objectClass]);
+ // we don't display the same term from different object classes
+ let seenIds = new Set();
+ this.includedTerms = terms
+ .sort((a, b) => OBJECT_CLASS_PRIORITY[a.objectClass] - OBJECT_CLASS_PRIORITY[b.objectClass])
+ .filter(term => {
+ let id = this.getId(term);
+ if (seenIds.has(id)) {
+ console.log("Skipped already seen term");
+ return true;
+ }
+ seenIds.add(id);
+ return true;
+ });
});
}
},
diff --git a/src/views/Browser.vue b/src/views/Browser.vue
index 050eb1d..42ac645 100644
--- a/src/views/Browser.vue
+++ b/src/views/Browser.vue
@@ -70,7 +70,8 @@
:selected-categories="searchSettings.categories"
:selected-annotations="searchSettings.annotations"
:available-annotations="datasetsAnnotations"
- @chip-clicked="handleChipClicked">
+ @annotation-selected="selectTerm"
+ @annotation-unselected="unselectTerm"/>
@@ -101,7 +102,7 @@