ross/penracourses
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Add visual indicators for answer statuses and enhance warning message for missing image annotations

Browse Source
This commit is contained in:
Ross
2026-02-16 10:01:29 +00:00
parent 941c599d24
commit 4d78a6b63a
1 changed files with 23 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files
anatomy/templates/anatomy/question_detail.html
+23 -3
View File
@@ -13,7 +13,7 @@
{% if not question.image_annotations %} {% if not question.image_annotations %}
<div class="alert alert-warning mt-3" role="alert"> <div class="alert alert-warning mt-3" role="alert">
<strong>No image annotations defined.</strong> <strong>No image annotations defined.</strong>
<div class="small">If important markers or arrows are not burned onto the image, please add annotations using the image annotation tool and click <em>Save Annotations</em>. Please note not all questions required image annotations.</div> <div class="small">If important markers or arrows are not burned onto the image, please add annotations using the image annotation tool and click <em>Save Annotations</em>. Please note not all questions required image annotations in which case you can ignore this message.</div>
</div> </div>
{% endif %} {% endif %}
<div class="mt-3 d-flex justify-content-between align-items-start"> <div class="mt-3 d-flex justify-content-between align-items-start">
@@ -48,6 +48,15 @@
<div id="primary-answer-container" hx-get="{% url 'anatomy:primary_answer_htmx' pk=question.pk %}" hx-trigger="load" hx-swap="outerHTML"></div> <div id="primary-answer-container" hx-get="{% url 'anatomy:primary_answer_htmx' pk=question.pk %}" hx-trigger="load" hx-swap="outerHTML"></div>
{% endif %} {% endif %}
<style>
.answer.correct { color: #155724; }
.answer.half-correct { color: #856404; }
.answer.incorrect { color: #721c24; }
.marked-correct { border-left: 4px solid #2a9d3f; }
.marked-half-correct { border-left: 4px solid #ffb020; }
.marked-incorrect { border-left: 4px solid #d3413a; }
</style>
<div class="d-flex justify-content-between align-items-start"> <div class="d-flex justify-content-between align-items-start">
<h6 class="mb-0">Answers</h6> <h6 class="mb-0">Answers</h6>
<div> <div>
@@ -64,7 +73,8 @@
</thead> </thead>
<tbody> <tbody>
{% for answer in question.answers.all|dictsortreversed:"status" %} {% for answer in question.answers.all|dictsortreversed:"status" %}
<tr> {% comment %}Add visual mark state classes consistent with mark2{% endcomment %}
<tr class="{% if answer.status == '2' %}marked-correct{% elif answer.status == '1' %}marked-half-correct{% elif answer.status == '0' %}marked-incorrect{% endif %}">
<td {% if answer.proposed %}class="proposed-answer" data-aid="{{answer.pk}}" data-question-type="anatomy"{% endif %}> <td {% if answer.proposed %}class="proposed-answer" data-aid="{{answer.pk}}" data-question-type="anatomy"{% endif %}>
{% if answer.status == "0" %} {% if answer.status == "0" %}
<div class="d-flex align-items-start"> <div class="d-flex align-items-start">
@@ -80,7 +90,17 @@
<pre class="mb-0">{{ answer.answer }}</pre> <pre class="mb-0">{{ answer.answer }}</pre>
{% endif %} {% endif %}
</td> </td>
<td>{{ answer.get_status_display|default:answer.status }}</td> <td>
{% if answer.status == '2' %}
<span class="answer correct">{{ answer.get_status_display|default:'Correct' }}</span>
{% elif answer.status == '1' %}
<span class="answer half-correct">{{ answer.get_status_display|default:'Half mark' }}</span>
{% elif answer.status == '0' %}
<span class="answer incorrect">{{ answer.get_status_display|default:'Incorrect' }}</span>
{% else %}
<span class="answer not-marked">{{ answer.get_status_display|default:'Unmarked' }}</span>
{% endif %}
</td>
<td> <td>
{% if answer.proposed and can_edit %} {% if answer.proposed and can_edit %}
<div class="btn-group btn-group-sm" role="group"> <div class="btn-group btn-group-sm" role="group">