Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Collapsable box for participants in evaluation form #2388

Open
wants to merge 5 commits into
base: main
Choose a base branch
from
Open

Collapsable box for participants in evaluation form #2388

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
f28b071
added card with collapsible to show participants
ybrnr Feb 3, 2025
0cc8eca
Merge branch 'main' into iss2333
ybrnr Feb 3, 2025
41ef8a9
added correct collapse/show logic
ybrnr Feb 10, 2025
f8e41dc
added dynamic change of participants counter
ybrnr Feb 10, 2025
d01cd06
added formatting from jannos review
ybrnr Feb 17, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
18 changes: 18 additions & 0 deletions evap/evaluation/templates/evaluation_form_general_questionnaires.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,24 @@
{% include 'questionnaires_widget.html' with field=field questionnaires_with_answers=questionnaires_with_answers_per_contributor|get:None%}
</div>
</div>
{% elif field == evaluation_form.participants %}
<div class="mb-3 d-md-flex">
{% include 'bootstrap_form_field_label.html' with field=field class='col-md-3 pe-4' %}
<div class="col-md-7 card collapsible overflow-visible">
<div class="card-header d-flex">
<a class="collapse-toggle{% if collapse_participants and evaluation.participants.count > 0 %} collapsed{% endif %}"
data-bs-toggle="collapse" href="#contributor-{{ contribution_result.contributor.id }}"
aria-controls="contributor-{{ contribution_result.contributor.id }}">
</a>
<span class="badge rounded-pill badge-btn ms-auto" id="participant_counter">{{ evaluation.participants.count }}</span>
</div>
<div class="collapse{% if not collapse_participants or evaluation.participants.count == 0 %} show{% endif %}" id="contributor-{{ contribution_result.contributor.id }}">
<div class="card-body">
{% include 'bootstrap_form_field_widget.html' with field=field %}
Comment on lines +24 to +26
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

What is this about contributors here?

</div>
</div>
</div>
</div>
{% else %}
{% include 'bootstrap_form_field.html' with field=field %}
{% endif %}
Expand Down
14 changes: 14 additions & 0 deletions evap/evaluation/templates/evap_evaluation_edit_js.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -71,6 +71,20 @@
});
}
}

// Update participant count displayed in form
let participant_list = document.getElementById("id_participants").tomselect;
participant_list.on("item_add", function() {
count_participants();
});
participant_list.on("item_remove", function() {
count_participants();
});

function count_participants(){
participant_counter = document.getElementById("participant_counter");
participant_counter.innerHTML = participant_list.items.length;
Comment on lines +76 to +86
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think we can remove some specifics from this: Let's make it so that the participant_counter does not need to have a id anymore and instead it has, say, data-track-tomselect-count="#id_participants".

Additionally, we should use innerText instead of innerHTML

}
</script>

{% block additional_javascript %}
Expand Down
2 changes: 1 addition & 1 deletion evap/staff/templates/staff_evaluation_form.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -38,7 +38,7 @@ <h3>

<div class="card mb-3">
<div class="card-body">
{% include 'evaluation_form_general_questionnaires.html' with evaluation=evaluation evaluation_form=evaluation_form %}
{% include 'evaluation_form_general_questionnaires.html' with evaluation=evaluation evaluation_form=evaluation_form collapse_participants=True %}
</div>
</div>
<div class="card mb-3">
Expand Down