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

Enhance marking UI with new navigation buttons and clipboard functionality; improve answer display with tooltips for clarity

Browse Source
This commit is contained in:
Ross
2025-11-11 12:00:04 +00:00
parent 34ef5106f4
commit 6752f03bf2
4 changed files with 109 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files
anatomy/templates/anatomy/mark2.html
+28 -3
View File
@@ -14,6 +14,7 @@
{% if request.user.is_superuser %}
<a class="btn btn-sm btn-outline-secondary" href="{% url 'admin:anatomy_anatomyquestion_change' question.id %}" title="Admin Edit">Admin Edit</a>
{% endif %}
<a class="btn btn-sm btn-outline-secondary" href="{% url 'anatomy:mark' exam.id question_number %}">Classic mark</a>
</div>
<h6 class="mb-1">{{ question.question_type }}</h6>
{% if question.structure %}
@@ -42,12 +43,11 @@
<div></div>
<div>
{% if question_details.current > 1 %}
<a class="btn btn-outline-secondary btn-sm me-1" href="{% url 'anatomy:mark2' exam.id question_number|add:-1 %}">Previous</a>
<button type="submit" name="previous" class="btn btn-outline-secondary btn-sm me-1">Previous</button>
{% endif %}
<button type="submit" name="save" class="btn btn-primary btn-sm me-1">Save</button>
{% if question_details.current < question_details.total %}
<a class="btn btn-outline-primary btn-sm me-1" href="{% url 'anatomy:mark2' exam.id question_number|add:1 %}">Next</a>
<a class="btn btn-outline-secondary btn-sm" href="{% url 'anatomy:mark' exam.id question_number %}">Classic mark</a>
<button type="submit" name="next" class="btn btn-outline-primary btn-sm me-1">Next</button>
{% endif %}
</div>
</div>
@@ -272,6 +272,31 @@
initMark2();
});
// Ensure the hidden marked_answers field is updated before any form submit
const postForm = document.querySelector('form.post-form');
if (postForm) {
postForm.addEventListener('submit', function(e){
try { updateMarkedAnswersField(); } catch (err) { /* still submit */ }
});
}
// Copy-to-clipboard handler for dropdown items
document.addEventListener('click', function(e){
const btn = e.target.closest('.copy-to-clipboard');
if (!btn) return;
const text = btn.getAttribute('data-text');
if (!text) return;
try {
navigator.clipboard.writeText(text);
// simple visual feedback: change the button text briefly
const prev = btn.textContent;
btn.textContent = 'Copied';
setTimeout(function(){ btn.textContent = prev; }, 1200);
} catch (err) {
console.warn('copy failed', err);
}
});
})();
</script>
{% endblock %}
anatomy/templates/anatomy/partials/mark2_exam_marked_fragment.html
+5 -5
View File
@@ -19,15 +19,15 @@
<div><pre class="mb-0">{{ it.answer }}</pre></div>
<div class="text-end">
{% if it.mark == 'correct' %}
<span class="badge bg-success me-2">2</span>
<span class="badge bg-success me-2" title="Stored answer marked as correct (2)">2</span>
{% elif it.mark == 'half-correct' %}
<span class="badge bg-warning text-dark me-2">1</span>
<span class="badge bg-warning text-dark me-2" title="Stored answer marked as half-correct (1)">1</span>
{% elif it.mark == 'incorrect' %}
<span class="badge bg-danger me-2">0</span>
<span class="badge bg-danger me-2" title="Stored answer marked as incorrect (0)">0</span>
{% else %}
<span class="badge bg-secondary me-2">-</span>
<span class="badge bg-secondary me-2" title="No stored mark for this answer">-</span>
{% endif %}
<span class="badge bg-light text-dark me-2">{{ it.count }}</span>
<span class="badge bg-light text-dark me-2" title="Submitted {{ it.count }} times">{{ it.count }}</span>
</div>
</li>
{% endfor %}
anatomy/templates/anatomy/partials/mark2_marked_list_fragment.html
+45 -3
View File
@@ -1,10 +1,52 @@
{% comment %}Renders only the list items for already-marked answers (used as a partial){% endcomment %}
{% for answer in correct_answers %}
<li class="list-group-item"><pre class="mb-0"><span class="answer correct" title="{{ answer }}" data-answerurl="{% url 'anatomy:question_user_answers_by_compare' question.pk answer|urlencode:'' %}">{{ answer }}</span></pre></li>
{% with answer_url=answer|urlencode:'' %}
<li class="list-group-item d-flex align-items-start">
<div class="me-2">
<div class="btn-group dropstart">
<button class="btn btn-sm btn-link p-0 popover-button" data-bs-toggle="dropdown" aria-expanded="false">+</button>
<ul class="dropdown-menu">
<li><a class="dropdown-item" href="https://www.google.com/search?q={{ answer_url }}" target="_blank">Google answer</a></li>
<li><button class="dropdown-item copy-to-clipboard" data-text="{{ answer|escapejs }}">Copy to clipboard</button></li>
<li><a class="dropdown-item" href="{% url 'anatomy:question_user_answers_by_compare' question.pk answer_url %}" target="_blank">view answers</a></li>
</ul>
</div>
</div>
<pre class="mb-0"><span class="answer correct" title="{{ answer }}" data-answerurl="{% url 'anatomy:question_user_answers_by_compare' question.pk answer_url %}">{{ answer }}</span></pre>
</li>
{% endwith %}
{% endfor %}
{% for answer in half_mark_answers %}
<li class="list-group-item"><pre class="mb-0"><span class="answer half-correct" title="{{ answer }}" data-answerurl="{% url 'anatomy:question_user_answers_by_compare' question.pk answer|urlencode:'' %}">{{ answer }}</span></pre></li>
{% with answer_url=answer|urlencode:'' %}
<li class="list-group-item d-flex align-items-start">
<div class="me-2">
<div class="btn-group dropstart">
<button class="btn btn-sm btn-link p-0 popover-button" data-bs-toggle="dropdown" aria-expanded="false">+</button>
<ul class="dropdown-menu">
<li><a class="dropdown-item" href="https://www.google.com/search?q={{ answer_url }}" target="_blank">Google answer</a></li>
<li><button class="dropdown-item copy-to-clipboard" data-text="{{ answer|escapejs }}">Copy to clipboard</button></li>
<li><a class="dropdown-item" href="{% url 'anatomy:question_user_answers_by_compare' question.pk answer_url %}" target="_blank">view answers</a></li>
</ul>
</div>
</div>
<pre class="mb-0"><span class="answer half-correct" title="{{ answer }}" data-answerurl="{% url 'anatomy:question_user_answers_by_compare' question.pk answer_url %}">{{ answer }}</span></pre>
</li>
{% endwith %}
{% endfor %}
{% for answer in incorrect_answers %}
<li class="list-group-item"><pre class="mb-0"><span class="answer incorrect" title="{{ answer }}" data-answerurl="{% url 'anatomy:question_user_answers_by_compare' question.pk answer|urlencode:'' %}">{{ answer }}</span></pre></li>
{% with answer_url=answer|urlencode:'' %}
<li class="list-group-item d-flex align-items-start">
<div class="me-2">
<div class="btn-group dropstart">
<button class="btn btn-sm btn-link p-0 popover-button" data-bs-toggle="dropdown" aria-expanded="false">+</button>
<ul class="dropdown-menu">
<li><a class="dropdown-item" href="https://www.google.com/search?q={{ answer_url }}" target="_blank">Google answer</a></li>
<li><button class="dropdown-item copy-to-clipboard" data-text="{{ answer|escapejs }}">Copy to clipboard</button></li>
<li><a class="dropdown-item" href="{% url 'anatomy:question_user_answers_by_compare' question.pk answer_url %}" target="_blank">view answers</a></li>
</ul>
</div>
</div>
<pre class="mb-0"><span class="answer incorrect" title="{{ answer }}" data-answerurl="{% url 'anatomy:question_user_answers_by_compare' question.pk answer_url %}">{{ answer }}</span></pre>
</li>
{% endwith %}
{% endfor %}
anatomy/templates/anatomy/partials/mark2_unmarked_list_fragment.html
+31 -5
View File
@@ -1,8 +1,34 @@
{% comment %}Renders only the list items for unmarked answers (used as a partial){% endcomment %}
{% for answer in user_answers %}
{% if answer in answer_suggest_incorrect %}
<li class="list-group-item"><pre class="mb-0"><span class="answer incorrect suggest" title="{{ answer }}" data-answerurl="{% url 'anatomy:question_user_answers_by_compare' question.pk answer|urlencode:'' %}">{{ answer }}</span></pre></li>
{% else %}
<li class="list-group-item"><pre class="mb-0"><span class="answer not-marked" title="{{ answer }}" data-answerurl="{% url 'anatomy:question_user_answers_by_compare' question.pk answer|urlencode:'' %}">{{ answer }}</span></pre></li>
{% endif %}
{% with answer_url=answer|urlencode:'' %}
{% if answer in answer_suggest_incorrect %}
<li class="list-group-item d-flex align-items-start">
<div class="me-2">
<div class="btn-group dropstart">
<button class="btn btn-sm btn-link p-0 popover-button" data-bs-toggle="dropdown" aria-expanded="false">+</button>
<ul class="dropdown-menu">
<li><a class="dropdown-item" href="https://www.google.com/search?q={{ answer_url }}" target="_blank">Google answer</a></li>
<li><button class="dropdown-item copy-to-clipboard" data-text="{{ answer|escapejs }}">Copy to clipboard</button></li>
<li><a class="dropdown-item" href="{% url 'anatomy:question_user_answers_by_compare' question.pk answer_url %}" target="_blank">view answers</a></li>
</ul>
</div>
</div>
<pre class="mb-0"><span class="answer incorrect suggest" title="{{ answer }}" data-answerurl="{% url 'anatomy:question_user_answers_by_compare' question.pk answer_url %}">{{ answer }}</span></pre>
</li>
{% else %}
<li class="list-group-item d-flex align-items-start">
<div class="me-2">
<div class="btn-group dropstart">
<button class="btn btn-sm btn-link p-0 popover-button" data-bs-toggle="dropdown" aria-expanded="false">+</button>
<ul class="dropdown-menu">
<li><a class="dropdown-item" href="https://www.google.com/search?q={{ answer_url }}" target="_blank">Google answer</a></li>
<li><button class="dropdown-item copy-to-clipboard" data-text="{{ answer|escapejs }}">Copy to clipboard</button></li>
<li><a class="dropdown-item" href="{% url 'anatomy:question_user_answers_by_compare' question.pk answer_url %}" target="_blank">view answers</a></li>
</ul>
</div>
</div>
<pre class="mb-0"><span class="answer not-marked" title="{{ answer }}" data-answerurl="{% url 'anatomy:question_user_answers_by_compare' question.pk answer_url %}">{{ answer }}</span></pre>
</li>
{% endif %}
{% endwith %}
{% endfor %}