Tried to fix the problem with veryfying the asnwers.

This commit is contained in:
sergiusz 2020-12-07 01:21:16 +01:00
parent c3598b099f
commit 051a878a69
3 changed files with 18 additions and 19 deletions

View File

@ -18,8 +18,6 @@ capitula = [
for capitulum in capitula: for capitulum in capitula:
capitulum['filename'] = capitulum['title'].replace(' ', '_') capitulum['filename'] = capitulum['title'].replace(' ', '_')
print(capitula)
@app.route('/') @app.route('/')
@app.route('/index') @app.route('/index')
@app.route('/llpsi') @app.route('/llpsi')

View File

@ -1,4 +1,5 @@
input[type="text"] { input[type="text"] {
-webkit-appearance: none;
border: none; border: none;
border-bottom: 1px solid black; border-bottom: 1px solid black;
} }
@ -9,4 +10,4 @@ input[type="text"].incorrect {
input[type="text"].correct { input[type="text"].correct {
background-color: green; background-color: green;
} }

View File

@ -6,12 +6,12 @@
<link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='css/LLPSI.css') }}"> <link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='css/LLPSI.css') }}">
<script type="text/javascript"> <script type="text/javascript">
function adjust_size() { function adjust_size() {
const forms = document.querySelectorAll('form'); const pensum = document.querySelector('#Pensum');
const form = forms[0]; const inputs = pensum.querySelectorAll('input');
inputs.forEach((input) => {
Array.from(form.elements).forEach((input) => {
if (input.type=="text") { if (input.type=="text") {
input.setAttribute("style", input.getAttribute("style") + "; width: " + input.dataset.expected.length + "em"); input.setAttribute("value", "");
input.setAttribute("style", "width: " + input.dataset.expected.length + "em");
} }
}); });
} }
@ -54,11 +54,10 @@
function validate() { function validate() {
const forms = document.querySelectorAll('form'); const pensum = document.querySelector('#Pensum');
const form = forms[0]; const inputs = pensum.querySelectorAll('input');
inputs.forEach((input) => {
Array.from(form.elements).forEach((input) => {
if (input.type=="text" && document.getElementById('vowel_length').checked == false) { if (input.type=="text" && document.getElementById('vowel_length').checked == false) {
is_macron_ok = (input.value == input_to_nomacron(input.dataset.expected)); is_macron_ok = (input.value == input_to_nomacron(input.dataset.expected));
is_double_ok = false; is_double_ok = false;
@ -77,26 +76,27 @@
} }
function show_answers() { function show_answers() {
const forms = document.querySelectorAll('form'); const pensum = document.querySelector('#Pensum');
const form = forms[0]; const inputs = pensum.querySelectorAll('input');
Array.from(form.elements).forEach((input) => { inputs.forEach((input) => {
if (input.type=="text") { if (input.type=="text") {
input.setAttribute("value", input.dataset.expected); input.setAttribute("value", input.dataset.expected);
input.removeAttribute("class");
} }
}); });
} }
</script> </script>
</head> </head>
<body> <body>
<h1><a href="/latin/llpsi">Lingua Latina Per Se Illustrata</a></h1> <h1><a href="/llpsi">Lingua Latina Per Se Illustrata</a></h1>
<h2>{{pensum_title}}</h2> <h2>{{pensum_title}}</h2>
Quantitās: <input type="checkbox" id="vowel_length"> Quantitās: <input type="checkbox" id="vowel_length">
<form class="Pensum" onsubmit="return validate();"> <div id="Pensum">
{{pensum_content|safe}} {{pensum_content|safe}}
<br> <br>
<input type="submit" value="Mitte"><button onclick="show_answers();">Responsa</button> <button onclick="return validate();">Mitte</button><button onclick="return show_answers();">Responsa</button>
</form> </div>
<script type="text/javascript">adjust_size();</script> <script type="text/javascript">adjust_size();</script>
</body> </body>
</html> </html>