Toggle annotation on click.
--- a/src_js/iconolab-bundle/src/components/editor/AnnotationForm.vue Tue Mar 14 16:49:55 2017 +0100
+++ b/src_js/iconolab-bundle/src/components/editor/AnnotationForm.vue Tue Mar 14 17:02:43 2017 +0100
@@ -9,7 +9,7 @@
<span v-if="!readonly">Annuler</span>
</button>
<div v-if="!annotation" class="alert alert-warning text-center">
- Aucune annotation sélectionnée.
+ Aucune annotation sélectionnée
</div>
<form v-bind:action="formAction" method="post">
<slot>
--- a/src_js/iconolab-bundle/src/components/editor/AnnotationList.vue Tue Mar 14 16:49:55 2017 +0100
+++ b/src_js/iconolab-bundle/src/components/editor/AnnotationList.vue Tue Mar 14 17:02:43 2017 +0100
@@ -2,15 +2,12 @@
<div class="list-group">
<a v-for="annotation in annotations"
ref="annotations"
- @click="onAnnotationClick($event, annotation)"
+ @click="toggleAnnotation($event, annotation)"
:href="'#' + annotation.annotation_guid"
class="list-group-item"
v-bind:class="{ active: isActive(annotation) }">
<h3 class="small list-group-item-heading">
{{ annotation.title }}
- <button type="button" class="close" data-dismiss="alert" aria-label="Close" @click="onAnnotationClose">
- <span aria-hidden="true">×</span>
- </button>
</h3>
<p class="list-group-item-text" v-for="tag in annotation.tags">{{ tag.tag_label }}</p>
<div class="list-group-item-footer">
@@ -42,14 +39,13 @@
}
},
methods: {
- onAnnotationClick: function(e, annotation) {
+ toggleAnnotation: function(e, annotation) {
e.preventDefault();
- this.$emit('click:annotation', annotation);
- },
- onAnnotationClose: function(e) {
- e.preventDefault();
- e.stopPropagation();
- this.$emit('close:annotation');
+ if (this.annotation && this.annotation === annotation) {
+ this.$emit('close:annotation');
+ } else {
+ this.$emit('click:annotation', annotation);
+ }
},
isActive: function(annotation) {
return annotation === this.annotation;