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

improving physics / sba exams

Browse Source
This commit is contained in:
Ross
2023-12-11 13:57:02 +00:00
parent 66ce7b42ac
commit 472fe6ee96
13 changed files with 280 additions and 231 deletions
Download Patch File Download Diff File Expand all files Collapse all files
sbas/templates/sbas/exam_start.html
+4
View File
@@ -10,6 +10,10 @@
Enter your CID and passcode in the below boxes.<br />
<p><input id="cid-box" type="text" value="Candidate ID"></p>
<p><input id="passcode-box" type="text" value="Passcode"></p>
{% if exam.time_limit %}
This exam has a time limit of {{ exam.get_time_limit }}. The time will start when you click the Start Exam button below.<br/>
{% endif %}
<button>Start exam</button>
sbas/templates/sbas/exam_take.html
+25 -104
View File
@@ -2,34 +2,13 @@
{% block content %}
<span id="user-id">
{% if request.user.is_authenticated %}
User: {{request.user}}
{% else %}
CID: {{cid}}
{% endif %}
{% if request.user.is_authenticated %}
User: {{request.user}}
{% else %}
CID: {{cid}}
{% endif %}
</span>
<div id="timeup">
Allocated time over.
</div>
<div id="clockdiv">
Time remaining:
{% comment %} <div>
<span class="days"></span>
<div class="smalltext">Days</div>
</div> {% endcomment %}
<div>
<span class="hours num"></span>
<span class="smalltext">Hours</span>
</div>
<div>
<span class="minutes num"></span>
<span class="smalltext">Minutes</span>
</div>
<div>
<span class="seconds num"></span>
<span class="smalltext">Seconds</span>
</div>
</div>
{% include "exam_clock.html" %}
<div class="no-select">
<h2>{{exam.name}}: Question [<span id="question-number">{{pos|add:1}}</span>/<span id="exam-length">{{exam_length}}</span>]</h2>
{% if exam.publish_results %}
@@ -58,13 +37,13 @@
</div>
{% if previous > -1 %}
<button type="submit" name="previous" class="save btn btn-default">Previous</button>
<button type="submit" name="previous" class="save btn btn-default" title="Click to save your answer(s) and go to the previous question">Previous</button>
{% endif %}
{% if next %}
<button type="submit" name="next" class="save btn btn-default">Next</button>
<button type="submit" name="next" class="save btn btn-default" title="Click to save your answer(s) and go to the next quesiton">Next</button>
{% else %}
{% if not exam.publish_results %}
<button type="submit" name="save" class="save btn btn-default">Save</button>
<button type="submit" name="save" class="save btn btn-default" title="Click to save your current answer(s)">Save</button>
{% endif %}
{% endif %}
@@ -73,7 +52,7 @@
<p>{{question.feedback|safe}}</p>
{% endif %}
<br />
<button type="submit" name="finish" class="save btn btn-default">Overview</button>
<button type="submit" name="finish" class="save btn btn-default" title="Click to go to the overview page (your answers will be saved).">Overview</button>
<button type="submit" id="goto-button" value="test" name="goto" class="hide">goto</button>
</form>
</div>
@@ -83,6 +62,11 @@
<div id="menu-list">
</div>
<details><summary>Help</summary>
<p>Each question contains a list of 5 different statements. One of these is the single BEST answer.</p>
<p>Click on the correct statement to select it. Once selected it will be highlighted. </p>
<p>Your answers are saved when navigating between questions (or if the save button is clicked on the final question). An overview of all the questions can be seen by clicking on the overview button (or by clicking <a target="_blank" href="{% url 'sbas:exam_scores_cid_user' pk=exam.pk cid=cid passcode=passcode %}">here</a>).</p>
</details>
{% endblock %}
{% block js %}
@@ -113,8 +97,10 @@
$("ul.sba-answer-list li[data-ans='{{saved_answer}}']").addClass("selected"); {% endif %}
for (let i = 0; i < {{ exam_length }}; i++) {
$("#menu-list").append($(
`<button class="question-menu-item" name="goto-${i}" data-qn="${i}">${i+1}</button>`));
qbutton = $(`<button class="question-menu-item" name="goto-${i}" data-qn="${i}">${i+1}</button>`)
if (i == {{pos}}) {qbutton.addClass("current-question")}
$("#menu-list").append(qbutton);
}
$("button.question-menu-item").on("click", (e) => {
@@ -124,50 +110,6 @@
});
function getTimeRemaining(endtime) {
const total = Date.parse(endtime) - Date.parse(new Date());
const seconds = Math.floor((total / 1000) % 60);
const minutes = Math.floor((total / 1000 / 60) % 60);
const hours = Math.floor((total / (1000 * 60 * 60)) % 24);
//const days = Math.floor(total / (1000 * 60 * 60 * 24));
return {
total,
//days,
hours,
minutes,
seconds
};
}
function initializeClock(id, endtime) {
console.log("Start clock", endtime)
const clock = document.getElementById(id);
clock.style.display = "block"
const daysSpan = clock.querySelector('.days');
const hoursSpan = clock.querySelector('.hours');
const minutesSpan = clock.querySelector('.minutes');
const secondsSpan = clock.querySelector('.seconds');
function updateClock() {
const t = getTimeRemaining(endtime);
//daysSpan.innerHTML = t.days;
hoursSpan.innerHTML = ('0' + t.hours).slice(-2);
minutesSpan.innerHTML = ('0' + t.minutes).slice(-2);
secondsSpan.innerHTML = ('0' + t.seconds).slice(-2);
if (t.total <= 0) {
clearInterval(timeinterval);
timeup.style.display = "block"
clock.style.display = "none"
}
}
const timeinterval = setInterval(updateClock, 1000);
updateClock();
}
/* beautify ignore:end */
})
</script>
{% endblock %}
@@ -180,36 +122,15 @@
.selected {
border: 1px solid purple;
}
#clockdiv{
font-family: sans-serif;
display: inline-block;
font-weight: 100;
text-align: center;
font-size: 12px;
display: none;
color: darkgray;
li:hover::before {
content: "Click to select";
float: right
}
#clockdiv > div{
padding: 1px;
border-radius: 3px;
{% comment %} background: purple; {% endcomment %}
display: inline-block;
}
#clockdiv div > span.num{
color: white;
padding: 1px;
border-radius: 3px;
display: inline-block;
li:hover.selected::before {
content: "Chosen answer";
float: right
}
#timeup {
display: none;
color: red;
font-weight: 100;
text-align: center;
font-size: 12px;
}
</style>
{% endblock %}
sbas/templates/sbas/exam_take_overview.html
+24 -4
View File
@@ -1,12 +1,15 @@
{% extends 'base.html' %}
{% block content %}
<span id="user-id">
{% if request.user.is_authenticated %}
User: {{request.user}}
{% else %}
CID: {{cid}}
{% endif %}
</span>
{% include "exam_clock.html" %}
<h2>Exam: {{exam.name}}</h2>
{% if exam.publish_results %}
@@ -21,26 +24,43 @@
</div>
{% endif %}
<div><p>Questions</p></div>
<div class="overview-text">{{answer_count}} out of {{exam_length}} questions answered. Click to go to question.</div>
{% if not exam.publish_results and answer_count != exam_length %}
<div id="unanswered-questions-alert" class="alert alert-warning" role="alert">
You have unanswered questions.
</div>
{% endif %}
<div class="overview-text">{{answer_count}} out of {{exam_length}} questions answered. Unanswered questions are shown in red. <p>Click to go to a question.</p></div>
<div class="sba-finish-list">
{% for question, answer in question_answer_tuples %}
{% if request.user.is_authenticated %}
<a href="{% url 'sbas:exam_take_user' pk=exam.id sk=forloop.counter0 %}"><button {% if not answer %}class="unanswered"{% endif %}>{{forloop.counter}}: {{answer.answer}}</button></a>
<a href="{% url 'sbas:exam_take_user' pk=exam.id sk=forloop.counter0 %}"><button {% if not answer %}class="unanswered" title="You have not answered this question"{% endif %}>{{forloop.counter}}: {{answer.answer}}</button></a>
{% else %}
<a href="{% url 'sbas:exam_take' pk=exam.id sk=forloop.counter0 cid=cid passcode=passcode %}"><button {% if not answer %}class="unanswered"{% endif %}>{{forloop.counter}}: {{answer.answer}}</button></a>
<a href="{% url 'sbas:exam_take' pk=exam.id sk=forloop.counter0 cid=cid passcode=passcode %}"><button {% if not answer %}class="unanswered" title="You have not answered this question"{% endif %}>{{forloop.counter}}: {{answer.answer}}</button></a>
{% endif %}
{% endfor %}
</div>
<div id="time-details">
Start time: {{cid_user_exam.start_time}}<br/>
Last change time: {{cid_user_exam.end_time}}
</div>
{% endblock %}
{% block js %}
<script>
$(document).ready(() => {
{% if not exam.publish_results %}
let time_limit = '{{exam.time_limit}}'
if (time_limit != "None") {
let end_time = new Date({{cid_user_exam.start_time|date:"U"}}*1000+parseInt('{{exam.time_limit}}')*1000);
initializeClock("clockdiv", end_time);
}
{% endif %}
})
</script>
{% endblock %}