141 lines
4.1 KiB
HTML
141 lines
4.1 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<header>
|
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/water.css@2/out/dark.css">
|
|
<script>
|
|
let session = Number(
|
|
Date.
|
|
now().
|
|
toString().
|
|
split("").
|
|
reverse().
|
|
join("")
|
|
).toString(36)
|
|
console.log("session", session)
|
|
</script>
|
|
</header>
|
|
<body>
|
|
<!--{{USER}}-->
|
|
<form id="flash" action="">
|
|
<input type="text" name="idq" readonly=true value="" style="display: none;">
|
|
<div name="question"></div>
|
|
<div name="clues"></div>
|
|
<div name="solution"></div>
|
|
<input type="button" value="clue">
|
|
<input type="text" name="answer">
|
|
<input type="button" value="pass" onclick="passQuestion(this.parentElement)">
|
|
<input type="button" value="fail" onclick="failQuestion(this.parentElement)">
|
|
<input type="button" value="skip" onclick="skipQuestion(this.parentElement)">
|
|
</form>
|
|
</body>
|
|
<footer>
|
|
<script>
|
|
let knowledgebase = {{ASSIGNMENTS_JSON}}
|
|
knowledgebase = Object.
|
|
keys(knowledgebase).
|
|
map((key) => [
|
|
[key, knowledgebase[key]]
|
|
])
|
|
console.log(0, knowledgebase)
|
|
|
|
function passQuestion(form) {
|
|
if (!form.children.answer.retake) {
|
|
pushAnswer(form.children.idq.value, form.children.answer.value, true)
|
|
}
|
|
nextQuestion(form)
|
|
}
|
|
|
|
function failQuestion(form) {
|
|
if (!form.children.answer.retake) {
|
|
pushAnswer(form.children.idq.value, form.children.answer.value, false)
|
|
}
|
|
queueRedoQuestion(form)
|
|
nextQuestion(form)
|
|
}
|
|
|
|
function skipQuestion(form) {
|
|
queueRedoQuestion(form)
|
|
nextQuestion(form)
|
|
}
|
|
|
|
function queueRedoQuestion(form) {
|
|
knowledgebase.push([[
|
|
form.children.idq.value,
|
|
{
|
|
Q: form.children.question.value,
|
|
Clues: form.children.clues.value,
|
|
Solution: form.children.solution.value,
|
|
Retake: true,
|
|
},
|
|
]])
|
|
}
|
|
|
|
function pushAnswer(idq, answer, passed) {
|
|
http("post", `/api/questions/${idq}/answers`, noopcallback,
|
|
JSON.stringify(
|
|
{
|
|
"answer": answer,
|
|
"passed": new Boolean(passed),
|
|
}
|
|
),
|
|
)
|
|
}
|
|
|
|
function nextQuestion(form) {
|
|
form.children.answer.value = ""
|
|
let todo = knowledgebase.shift()
|
|
if (!todo) {
|
|
todo = [0]
|
|
}
|
|
todo = todo[0]
|
|
if (! todo) {
|
|
todo = ["", {Q: "ALL DONE"}]
|
|
}
|
|
|
|
form.children.idq.value = todo[0]
|
|
|
|
form.children.question.innerHTML = `<h3>${todo[1].Q}</h3>`
|
|
form.children.question.value = todo[1].Q
|
|
|
|
let clues = ""
|
|
for (var i in todo[1].Clues) {
|
|
clues += `<details><summary>clue #${i}</summary>${todo[1].Clues[i]}</details>`
|
|
}
|
|
form.children.clues.innerHTML = clues
|
|
form.children.clues.value = todo[1].Clues
|
|
|
|
let solution = ""
|
|
for (var i in todo[1].Solution) {
|
|
solution += `<br>${todo[1].Solution[i]}`
|
|
}
|
|
if (solution) {
|
|
solution = `<details><summary>solution</summary>${solution}</details>`
|
|
}
|
|
form.children.solution.innerHTML = solution
|
|
form.children.solution.value = todo[1].Solution
|
|
|
|
form.children.answer.retake = todo[1].Retake
|
|
}
|
|
|
|
function noopcallback(responseBody, responseStatus) {
|
|
console.log(responseStatus, responseBody)
|
|
}
|
|
function http(method, remote, callback, body) {
|
|
var xmlhttp = new XMLHttpRequest();
|
|
xmlhttp.onreadystatechange = function() {
|
|
if (xmlhttp.readyState == XMLHttpRequest.DONE) {
|
|
callback(xmlhttp.responseText, xmlhttp.status)
|
|
}
|
|
};
|
|
xmlhttp.open(method, remote, true);
|
|
if (typeof body == "undefined") {
|
|
body = null
|
|
}
|
|
xmlhttp.send(body);
|
|
}
|
|
|
|
nextQuestion(document.getElementById("flash"))
|
|
</script>
|
|
</footer>
|
|
</html>
|