Anki/public/root.html

74 lines
2.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="" onsubmit="return false; trySolve(this.children.idq.value, this.children.answer.value); return false;">
<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="submit" value="submit">
<input type="button" value="skip" onclick="nextQuestion(this.parentElement)">
</form>
</body>
<footer>
<script>
let knowledgebase = {{ASSIGNMENTS_JSON}}
knowledgebase = Object.
keys(knowledgebase).
map((key) => [
[key, knowledgebase[key]]
])
function nextQuestion(form) {
form.children.answer.value = ""
let todo = knowledgebase.pop()
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>`
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
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
}
nextQuestion(document.getElementById("flash"))
</script>
</footer>
</html>