Change placeholder depending on metacategory.
--- a/src/iconolab/templates/iconolab/detail_image.html Fri Mar 17 14:01:36 2017 +0100
+++ b/src/iconolab/templates/iconolab/detail_image.html Fri Mar 17 14:36:09 2017 +0100
@@ -173,7 +173,8 @@
template: template,
data: function() {
return {
- active: null
+ active: null,
+ placeholder: 'Ajouter mon commentaire…'
}
},
watch: {
@@ -195,6 +196,14 @@
return classes;
}
+ },
+ methods: {
+ setActive: function(active, placeholder) {
+ Object.assign(this, {
+ active: active,
+ placeholder: placeholder || 'Ajouter mon commentaire…'
+ });
+ }
}
});
});
--- a/src/iconolab/templates/partials/comment_form.html Fri Mar 17 14:01:36 2017 +0100
+++ b/src/iconolab/templates/partials/comment_form.html Fri Mar 17 14:36:09 2017 +0100
@@ -18,7 +18,8 @@
{% if 'request_for_contribution' in metacategories %}
<label title="{{ metacategories.request_for_contribution.label }}"
v-bind:class="{ active: active === 'request-for-contribution' }"
- v-on:click.prevent="active = 'request-for-contribution'" class="btn btn-default btn-request-for-contribution">
+ v-on:click.prevent="setActive('request-for-contribution', 'Détailler mon appel à contribution…')"
+ class="btn btn-default btn-request-for-contribution">
<input type="radio" name="{{ comment_form.metacategories.name }}" value="{{ metacategories.request_for_contribution.id }}">
<i class="fa fa-users"></i>
</label>
@@ -26,7 +27,8 @@
{% if 'reference' in metacategories %}
<label title="{{ metacategories.reference.label }}"
v-bind:class="{ active: active === 'reference' }"
- v-on:click.prevent="active = 'reference'" class="btn btn-default btn-reference">
+ v-on:click.prevent="setActive('reference')"
+ class="btn btn-default btn-reference">
<input type="radio" name="{{ comment_form.metacategories.name }}" value="{{ metacategories.reference.id }}">
<i class="fa fa-book"></i>
</label>
@@ -34,14 +36,16 @@
<label title="Commentaire"
v-bind:class="{ active: active === 'comment' }"
- v-on:click.prevent="active = 'comment'" class="btn btn-default btn-comment">
+ v-on:click.prevent="setActive('comment')"
+ class="btn btn-default btn-comment">
<i class="fa fa-comment"></i>
</label>
{% if 'agree' in metacategories %}
<label title="{{ metacategories.agree.label }}"
v-bind:class="{ active: active === 'agree' }"
- v-on:click.prevent="active = 'agree'" class="btn btn-default btn-agree">
+ v-on:click.prevent="setActive('agree', 'Expliquez pourquoi vous êtes d\'accord…')"
+ class="btn btn-default btn-agree">
<input type="radio" name="{{ comment_form.metacategories.name }}" value="{{ metacategories.agree.id }}">
<i class="fa fa-thumbs-up"></i>
</label>
@@ -49,7 +53,8 @@
{% if 'disagree' in metacategories %}
<label title="{{ metacategories.disagree.label }}"
v-bind:class="{ active: active === 'disagree' }"
- v-on:click.prevent="active = 'disagree'" class="btn btn-default btn-disagree">
+ v-on:click.prevent="setActive('disagree', 'Expliquez pourquoi vous n\'êtes pas d\'accord…')"
+ class="btn btn-default btn-disagree">
<input type="radio" name="{{ comment_form.metacategories.name }}" value="{{ metacategories.disagree.id }}">
<i class="fa fa-thumbs-down"></i>
</label>
@@ -64,7 +69,7 @@
<textarea class="form-control input-sm"
name="{{ comment_form.comment.name }}"
id="id_{{ comment_form.comment.name }}"
- placeholder="Ajouter mon commentaire..."></textarea>
+ v-bind:placeholder="placeholder"></textarea>
</fieldset>
<button type="submit" class="btn btn-xs btn-primary">Commenter</button>