102 lines
2.7 KiB
HTML
102 lines
2.7 KiB
HTML
<!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 pensum = document.querySelector('#Pensum');
|
||
const inputs = pensum.querySelectorAll('input');
|
||
inputs.forEach((input) => {
|
||
if (input.type=="text") {
|
||
input.setAttribute("value", "");
|
||
input.setAttribute("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 pensum = document.querySelector('#Pensum');
|
||
const inputs = pensum.querySelectorAll('input');
|
||
|
||
inputs.forEach((input) => {
|
||
if (input.type=="text" && document.getElementById('vowel_length').checked == false) {
|
||
is_macron_ok = (input.value == 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 pensum = document.querySelector('#Pensum');
|
||
const inputs = pensum.querySelectorAll('input');
|
||
|
||
inputs.forEach((input) => {
|
||
if (input.type=="text") {
|
||
input.setAttribute("value", input.dataset.expected);
|
||
input.removeAttribute("class");
|
||
}
|
||
});
|
||
}
|
||
</script>
|
||
</head>
|
||
<body>
|
||
<h1><a href="/llpsi">Lingua Latina Per Se Illustrata</a></h1>
|
||
<h2>{{pensum_title}}</h2>
|
||
Quantitās: <input type="checkbox" id="vowel_length">
|
||
<div id="Pensum">
|
||
{{pensum_content|safe}}
|
||
<br>
|
||
<button onclick="return validate();">Mitte</button><button onclick="return show_answers();">Responsa</button>
|
||
</div>
|
||
<script type="text/javascript">adjust_size();</script>
|
||
</body>
|
||
</html> |