thomas.py/pyolingo
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Navigatonsbuttons implementiert

Browse Source
This commit is contained in:
p3t3rp1Lz 2026-04-19 14:21:13 +02:00
parent 8ba08e81e5
commit 37550b3712
4 changed files with 81 additions and 28 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
forms/hinzufuegenKarte.php
View File

@ -80,6 +80,8 @@
FROM farbe;"); FROM farbe;");
$farbe_array = $stmt->fetchAll(PDO::FETCH_ASSOC); $farbe_array = $stmt->fetchAll(PDO::FETCH_ASSOC);
foreach($farbe_array as $farbe) if($farbe['farbe'] == 'red') $red_farbe_id = $farbe['id'];
$stmt = $pdo->prepare("INSERT INTO deutsch(wort, kategorie_id, wort_hinzugefuegt) $stmt = $pdo->prepare("INSERT INTO deutsch(wort, kategorie_id, wort_hinzugefuegt)
VALUES (:wort, :kategorie_id, (:wort_hinzugefuegt)::timestamp);"); VALUES (:wort, :kategorie_id, (:wort_hinzugefuegt)::timestamp);");
$stmt->execute(['wort' => $deutsch, $stmt->execute(['wort' => $deutsch,
@ -112,20 +114,23 @@
for($i = 0; $i < 7; $i++) { for($i = 0; $i < 7; $i++) {
$pp = ($i == 0) ? null : $personalpronomen[$i - 1]['id']; $pp = ($i == 0) ? null : $personalpronomen[$i - 1]['id'];
$stmt = $pdo->prepare("INSERT INTO italienisch (wort, deutsch_id, personalpronomen_id, suffix, endung, farbe_id)
VALUES (:wort, :deutsch_id, :personalpronomen_id, :suffix, :endung, :farbe_id)");
if(count($endung) == 0) { if(count($endung) == 0) {
$stmt = $pdo->prepare("INSERT INTO italienisch (wort, deutsch_id, personalpronomen_id, suffix) $stmt->execute(['wort' => $wortstamm[$i],
VALUES (:wortstamm, :deutsch_id, :personalpronomen_id, :suffix)");
$stmt->execute(['wortstamm' => $wortstamm[$i],
'deutsch_id' => $deutsch_id, 'deutsch_id' => $deutsch_id,
'personalpronomen_id' => $pp, 'personalpronomen_id' => $pp,
'suffix' => $suffix]); 'suffix' => $suffix,
'endung' => null,
'farbe_id' => null]);
} else { } else {
$stmt = $pdo->prepare("INSERT INTO italienisch (wort, deutsch_id, personalpronomen_id, suffix, wortstamm) $stmt->execute(['wort' => $wortstamm[$i],
VALUES (:wort, :deutsch_id, :personalpronomen_id, :suffix, :wortstamm)");
$stmt->execute(['wortstamm' => $endung[$i],
'deutsch_id' => $deutsch_id, 'deutsch_id' => $deutsch_id,
'personalpronomen_id' => $pp, 'personalpronomen_id' => $pp,
'suffix' => $suffix]); 'suffix' => $suffix,
'endung' => $endung[$i],
'farbe_id' => $red_farbe_id]);
} }
} }
} }

49
index.php
View File

@ -104,6 +104,14 @@
</tr> </tr>
</table> </table>
</button> </button>
<div class="menue" id="kartenNavigation">
<button class="button-ellipsoid" id="button_kartenNavigationVorh">
<< vorheriges Wort
</button>
<button class="button-ellipsoid" id="button_kartenNavigationNaech">
nächstes Wort >>
</button>
</div>
<script> <script>
let items = []; let items = [];
let index = 0; let index = 0;
@ -112,15 +120,12 @@
.then(r => r.json()) .then(r => r.json())
.then(data => items = data); .then(data => items = data);
//items.sort(() => Math.random() - 0.5);
document.getElementById("start").onclick = function() { document.getElementById("start").onclick = function() {
if(document.getElementById("start").innerText != "Neustart") { if(document.getElementById("start").innerText != "Neustart") {
document.getElementById("deutsch").style.display = "inline-block"; document.getElementById("deutsch").style.display = "inline-block";
document.getElementById("start").innerText = "Neustart"; document.getElementById("start").innerText = "Neustart";
showVorderseite(); showVorderseite();
} else { } else {
//items.sort(() => Math.random() - 0.5);
index = 0; index = 0;
showVorderseite(); showVorderseite();
document.getElementById("italienisch").style.display = "none"; document.getElementById("italienisch").style.display = "none";
@ -130,6 +135,36 @@
}; };
document.getElementById("deutsch").onclick = function() { document.getElementById("deutsch").onclick = function() {
buttonDeutsch();
}
document.getElementById("italienisch").onclick = function() {
buttonItalienisch();
}
document.getElementById("italienisch_verben").onclick = function() {
buttonItalienischVerben();
}
document.getElementById("button_kartenNavigationVorh").onclick = function() {
index > 0 ? index -= 1 : index = items.length - 1;
buttonDeutsch();
showVorderseite();
document.getElementById("italienisch").style.display = "none";
document.getElementById("italienisch_verben").style.display = "none";
document.getElementById("deutsch").classList.remove("disabled");
}
document.getElementById("button_kartenNavigationNaech").onclick = function() {
index == items.length -1 ? index = 0 : index += 1;
buttonDeutsch();
showVorderseite();
document.getElementById("italienisch").style.display = "none";
document.getElementById("italienisch_verben").style.display = "none";
document.getElementById("deutsch").classList.remove("disabled");
}
function buttonDeutsch() {
document.getElementById("deutsch").classList.add("disabled"); document.getElementById("deutsch").classList.add("disabled");
if(items[index].wortart != "Verben") { if(items[index].wortart != "Verben") {
document.getElementById("italienisch").style.display = "flex"; document.getElementById("italienisch").style.display = "flex";
@ -139,7 +174,7 @@
showRueckseite(); showRueckseite();
}; };
document.getElementById("italienisch").onclick = function() { function buttonItalienisch() {
document.getElementById("italienisch").style.display = "none"; document.getElementById("italienisch").style.display = "none";
document.getElementById("deutsch").classList.remove("disabled"); document.getElementById("deutsch").classList.remove("disabled");
index++; index++;
@ -147,14 +182,14 @@
showVorderseite(); showVorderseite();
}; };
document.getElementById("italienisch_verben").onclick = function() { function buttonItalienischVerben() {
document.getElementById("italienisch_verben").style.display = "none"; document.getElementById("italienisch_verben").style.display = "none";
document.getElementById("deutsch").classList.remove("disabled"); document.getElementById("deutsch").classList.remove("disabled");
index++; index++;
if(index >= items.length) index = 0; if(index >= items.length) index = 0;
showVorderseite(); showVorderseite();
}; };
function showVorderseite() { function showVorderseite() {
resetWords(); resetWords();
let item = items[index]; let item = items[index];
@ -261,7 +296,7 @@
</div> </div>
<div class="menue"> <div class="menue">
<a href="neueKarte.php" class="menueLink"> <a href="neueKarte.php" class="menueLink">
< + neue Karte > < neue Karte >
</a> </a>
<a href="neueKarte.php" class="menueLink"> <a href="neueKarte.php" class="menueLink">
< Kartenansicht > < Kartenansicht >

27
style.css
View File

@ -83,6 +83,20 @@ div.header{
height: 250px; height: 250px;
} }
#button_kartenNavigationVorh {
height: 75px;
width: 450px;
margin-top: 0;
padding: 0;
}
#button_kartenNavigationNaech {
height: 75px;
width: 450px;
margin-top: 0;
padding: 0;
}
#deutsch.disabled { #deutsch.disabled {
pointer-events: none; pointer-events: none;
opacity: 1; opacity: 1;
@ -180,6 +194,12 @@ a:visited {
margin-left: 30px; margin-left: 30px;
} }
#input_suffix {
display: inline-block;
width: 700px;
margin-left: 60px;
}
.hinzufuegenKarteElemente { .hinzufuegenKarteElemente {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
@ -246,7 +266,7 @@ a:visited {
} }
#input_wortstamm { #input_wortstamm {
width: 230px; width: 500px;
} }
#input_endung { #input_endung {
@ -254,6 +274,7 @@ a:visited {
width: 130px; width: 130px;
} }
#input_suffix { #kartenNavigation {
width: 230px; bottom: 200px;
background-color: rgb(122, 122, 122);
} }

12
verben.php
View File

@ -38,7 +38,7 @@
<div> <div>
<p class="kategorie" id="p_deutsch">Suffix:</p> <p class="kategorie" id="p_deutsch">Suffix:</p>
<input class="kategorie" <input class="kategorie"
id="input_deutsch" id="input_suffix"
type="text" type="text"
name="suffix" name="suffix"
value="<?= htmlspecialchars($old['suffix'] ?? '') ?>" value="<?= htmlspecialchars($old['suffix'] ?? '') ?>"
@ -49,14 +49,13 @@
<th></th> <th></th>
<th>Wortstamm</th> <th>Wortstamm</th>
<th>Endung</th> <th>Endung</th>
<!--th>Suffix</th-->
</tr> </tr>
<?php for($i = 0; $i < 7; $i++) { ?> <?php for($i = 0; $i < 7; $i++) { ?>
<tr> <tr>
<td> <td>
<input id="hiddenInputEditTyp" type="hidden" name="farbe_<?= $i ?>" value="red"> <input id="hiddenInputEditTyp" type="hidden" name="farbe_<?= $i ?>" value="red">
<p class="kategorie" id="p_italienisch"> <p class="kategorie" id="p_italienisch">
<?php switch($i){ <?php switch($i) {
case(0): echo 'Grundwort:'; break; case(0): echo 'Grundwort:'; break;
case(1): echo 'io:'; break; case(1): echo 'io:'; break;
case(2): echo 'tu:'; break; case(2): echo 'tu:'; break;
@ -83,13 +82,6 @@
name="endung_<?= $i ?>" name="endung_<?= $i ?>"
value="<?= htmlspecialchars(($old['endung_' . $i] ?? '')) ?>"> value="<?= htmlspecialchars(($old['endung_' . $i] ?? '')) ?>">
</td> </td>
<!--td>
<input class="kategorie"
id="input_suffix"
type="text"
name="suffix_< ?= $i ?>"
value="< ?= htmlspecialchars(($old['suffix_' . $i] ?? '')) ?>">
</td-->
</tr> </tr>
<?php }; ?> <?php }; ?>
</table> </table>