Use radio buttons if appropriate #9

This commit is contained in:
Yingtong Li 2018-01-08 19:02:37 +08:00
parent 05de3ec5d7
commit 22af38a91a
Signed by: RunasSudo
GPG Key ID: 7234E476BF21C61A
1 changed files with 35 additions and 13 deletions

View File

@ -1,6 +1,6 @@
{# {#
Eos - Verifiable elections Eos - Verifiable elections
Copyright © 2017 RunasSudo (Yingtong Li) Copyright © 2017-18 RunasSudo (Yingtong Li)
This program is free software: you can redistribute it and/or modify This program is free software: you can redistribute it and/or modify
it under the terms of the GNU Affero General Public License as published by it under the terms of the GNU Affero General Public License as published by
@ -28,16 +28,34 @@
choices. Click the check-boxes to the left of the choices to make your selection, then click the ‘Continue’ button. If you make a mistake, click the check-boxes again to clear your selection. choices. Click the check-boxes to the left of the choices to make your selection, then click the ‘Continue’ button. If you make a mistake, click the check-boxes again to clear your selection.
</small></p> </small></p>
{% set is_radio = election.questions.__getitem__(questionNum).max_choices == 1 %}
<div id="question-choices" class="ui form" style="margin-bottom: 1em;"> <div id="question-choices" class="ui form" style="margin-bottom: 1em;">
<div class="grouped fields"> <div class="grouped fields">
{% for choice in election.questions.__getitem__(questionNum).randomised_choices().impl %} {% for choice in election.questions.__getitem__(questionNum).randomised_choices().impl %}
<div class="field"> <div class="field">
<div class="ui checkbox"> <div class="ui{% if is_radio %} radio{% endif %} checkbox">
<input type="checkbox" id="question-choice-{{ election.questions.__getitem__(questionNum).choices.impl.indexOf(choice) }}" onchange="choicesChanged();"> <input
{% if is_radio %}
name="question-choices"
type="radio"
{% else %}
type="checkbox"
{% endif %}
id="question-choice-{{ election.questions.__getitem__(questionNum).choices.impl.indexOf(choice) }}" onchange="choicesChanged();">
<label for="question-choice-{{ election.questions.__getitem__(questionNum).choices.impl.indexOf(choice) }}">{{ choice.name }}{% if choice.party %} – {{ choice.party }}{% endif %}</label> <label for="question-choice-{{ election.questions.__getitem__(questionNum).choices.impl.indexOf(choice) }}">{{ choice.name }}{% if choice.party %} – {{ choice.party }}{% endif %}</label>
</div> </div>
</div> </div>
{% endfor %} {% endfor %}
{% if is_radio and election.questions.__getitem__(questionNum).min_choices == 0 %}
<div class="field">
<div class="ui{% if is_radio %} radio{% endif %} checkbox">
<input name="question-choices" type="radio" id="question-choice-none" onchange="choicesChanged();" checked>
<label for="question-choice-none"><i>None of the above</i></label>
</div>
</div>
{% endif %}
</div> </div>
</div> </div>
@ -47,15 +65,17 @@
<script> <script>
function choicesChanged() { function choicesChanged() {
var numChoices = $("#question-choices input:checked").length; {% if not is_radio %}
if (numChoices >= election.questions.__getitem__(booth.questionNum).max_choices) { var numChoices = $("#question-choices input:checked").length;
// Prevent making any more selections if (numChoices >= election.questions.__getitem__(booth.questionNum).max_choices) {
$("#question-choices input:not(:checked)").prop("disabled", true); // Prevent making any more selections
$("#message-max-choices").removeClass("hidden"); $("#question-choices input:not(:checked)").prop("disabled", true);
} else { $("#message-max-choices").removeClass("hidden");
$("#question-choices input").prop("disabled", false); } else {
$("#message-max-choices").addClass("hidden"); $("#question-choices input").prop("disabled", false);
} $("#message-max-choices").addClass("hidden");
}
{% endif %}
} }
// Fill in ballot with previous selections // Fill in ballot with previous selections
@ -69,7 +89,9 @@
function saveSelections() { function saveSelections() {
selections = []; selections = [];
$("#question-choices input:checked").each(function(i, el) { $("#question-choices input:checked").each(function(i, el) {
selections.push(parseInt(el.id.substring("question-choice-".length))); if (el.id !== "question-choice-none") {
selections.push(parseInt(el.id.substring("question-choice-".length)));
}
}); });
if (selections.length < election.questions.__getitem__(booth.questionNum).min_choices) { if (selections.length < election.questions.__getitem__(booth.questionNum).min_choices) {