latin/app/templates/LLPSI/Pensum_cloze.html
2020-12-03 20:22:58 +01:00

103 lines
2.7 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!DOCTYPE html>
<html lang="la">
<head>
<meta charset="UTF-8">
<title>Familia Romana Pensum A</title>
<link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='css/LLPSI.css') }}">
<script type="text/javascript">
function adjust_size() {
const forms = document.querySelectorAll('form');
const form = forms[0];
Array.from(form.elements).forEach((input) => {
if (input.type=="text") {
input.setAttribute("style", input.getAttribute("style") + "; width: " + input.dataset.expected.length + "em");
}
});
}
function nomacron_to_macron(char) {
var mapper = { 'A': 'Ā',
'a': 'ā',
'E': 'Ē',
'e': 'ē',
'I': 'Ī',
'i': 'ī',
'O': 'Ō',
'o': 'ō',
'U': 'Ū',
'u': 'ū'};
return mapper[char[0]];
}
function macron_to_nomacron(char) {
var mapper = { 'Ā': 'A',
'ā': 'a',
'Ē': 'E',
'ē': 'e',
'Ī': 'I',
'ī': 'i',
'Ō': 'O',
'ō': 'o',
'Ū': 'U',
'ū': 'u'};
return mapper[char];
}
function input_to_nomacron(input) {
return input.replace(/Ā|ā|Ē|ē|Ī|ī/, macron_to_nomacron);
}
function input_to_macron(input) {
return input.replace(/(\w)\1/, nomacron_to_macron);
}
function validate() {
const forms = document.querySelectorAll('form');
const form = forms[0];
Array.from(form.elements).forEach((input) => {
if (input.type=="text" && document.getElementById('vowel_length').checked == false) {
is_macron_ok = (input.value == input_to_nomacron(input.dataset.expected));
console.log(input_to_nomacron(input.dataset.expected));
is_double_ok = false;
} else {
is_double_ok = (input_to_macron(input.value) == input.dataset.expected);
is_macron_ok = (input.value == input.dataset.expected);
}
if (input.type=="text" && !(is_double_ok || is_macron_ok)) {
input.setAttribute("class", "incorrect");
} else if (input.type=="text") {
input.setAttribute("class", "correct");
}
});
return false;
}
function show_answers() {
const forms = document.querySelectorAll('form');
const form = forms[0];
Array.from(form.elements).forEach((input) => {
if (input.type=="text") {
input.setAttribute("value", input.dataset.expected);
}
});
}
</script>
</head>
<body>
<h1><a href="/latin/llpsi">Lingua Latina Per Se Illustrata</a></h1>
<h2>{{pensum_title}}</h2>
Quantitās: <input type="checkbox" id="vowel_length">
<form class="Pensum" onsubmit="return validate();">
{{pensum_content|safe}}
<br>
<input type="submit" value="Mitte"><button onclick="show_answers();">Responsa</button>
</form>
<script type="text/javascript">adjust_size();</script>
</body>
</html>