erste funktionsfähige Prüfung der Eingaben

This commit is contained in:
2024-12-16 13:16:35 +01:00
committed by Eric Blommel
parent 496522b4b4
commit 5a4ec524da
4 changed files with 145 additions and 15 deletions

View File

@@ -0,0 +1,44 @@
document.addEventListener('DOMContentLoaded', function () {
console.log('tasks.js wurde geladen.');
// Event-Delegation für "Antwort prüfen" Buttons
const checkButtons = document.querySelectorAll('.check-answer');
console.log(`Found ${checkButtons.length} check-answer buttons.`);
checkButtons.forEach(function (button) {
button.addEventListener('click', function () {
console.log('Antwort prüfen Button geklickt.');
const variableContainer = this.closest('.variable-container');
const input = variableContainer.querySelector('input');
const userAnswer = input.value.trim();
const correctAnswer = input.getAttribute('data-correct-answer').trim().toLowerCase();
const feedback = variableContainer.querySelector('.feedback');
if (userAnswer.toLowerCase() === correctAnswer) {
feedback.style.color = 'green';
feedback.textContent = 'Richtig!';
} else {
feedback.style.color = 'red';
feedback.textContent = 'Falsch. Versuchen Sie es erneut.';
}
feedback.style.display = 'block';
});
});
// Event-Delegation für "Antwort anzeigen" Buttons
const showButtons = document.querySelectorAll('.show-answer');
console.log(`Found ${showButtons.length} show-answer buttons.`);
showButtons.forEach(function (button) {
button.addEventListener('click', function () {
console.log('Antwort anzeigen Button geklickt.');
const variableContainer = this.closest('.variable-container');
const input = variableContainer.querySelector('input');
const correctAnswer = input.getAttribute('data-correct-answer');
const correctAnswerDiv = variableContainer.querySelector('.correct-answer span');
correctAnswerDiv.textContent = correctAnswer;
correctAnswerDiv.parentElement.style.display = 'block';
});
});
});

39
webseite/check_answer.php Normal file
View File

@@ -0,0 +1,39 @@
<?php
require_once "classes/task.php";
header('Content-Type: application/json');
// Sicherheitsüberprüfungen hier (z.B. Authentifizierung)
// Eingaben validieren
$taskId = isset($_POST['task_id']) ? intval($_POST['task_id']) : null;
$variableIndex = isset($_POST['variable_index']) ? intval($_POST['variable_index']) : null;
$userAnswer = isset($_POST['user_answer']) ? trim($_POST['user_answer']) : '';
if ($taskId === null || $variableIndex === null || $userAnswer === '') {
echo json_encode(['success' => false, 'message' => 'Ungültige Eingaben.']);
exit;
}
// Laden Sie die Aufgaben und Variablen entsprechend Ihrer Datenstruktur
$tasks = $topicData->getTasks();
if (!isset($tasks[$taskId])) {
echo json_encode(['success' => false, 'message' => 'Aufgabe nicht gefunden.']);
exit;
}
$variables = $tasks[$taskId]->getVariables();
if (!isset($variables[$variableIndex])) {
echo json_encode(['success' => false, 'message' => 'Variable nicht gefunden.']);
exit;
}
$correctAnswer = strtolower(trim($variables[$variableIndex]->getCorrectAnswer()));
$userAnswerLower = strtolower($userAnswer);
if ($userAnswerLower === $correctAnswer) {
echo json_encode(['success' => true, 'message' => 'Richtig!']);
} else {
echo json_encode(['success' => false, 'message' => 'Falsch.']);
}

33
webseite/show_answer.php Normal file
View File

@@ -0,0 +1,33 @@
<?php
require_once "classes/task.php";
header('Content-Type: application/json');
// Sicherheitsüberprüfungen hier (z.B. Authentifizierung)
// Eingaben validieren
$taskId = isset($_POST['task_id']) ? intval($_POST['task_id']) : null;
$variableIndex = isset($_POST['variable_index']) ? intval($_POST['variable_index']) : null;
if ($taskId === null || $variableIndex === null) {
echo json_encode(['success' => false, 'message' => 'Ungültige Eingaben.']);
exit;
}
// Laden Sie die Aufgaben und Variablen entsprechend Ihrer Datenstruktur
$tasks = $topicData->getTasks();
if (!isset($tasks[$taskId])) {
echo json_encode(['success' => false, 'message' => 'Aufgabe nicht gefunden.']);
exit;
}
$variables = $tasks[$taskId]->getVariables();
if (!isset($variables[$variableIndex])) {
echo json_encode(['success' => false, 'message' => 'Variable nicht gefunden.']);
exit;
}
$correctAnswer = $variables[$variableIndex]->getCorrectAnswer();
echo json_encode(['success' => true, 'correct_answer' => $correctAnswer]);

View File

@@ -32,6 +32,7 @@ if (!isset($topicData)) {
<script src="https://cdn.tailwindcss.com"></script>
<script id="MathJax-script" async src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js"></script>
<script src="assets/js/sidebar.js"></script>
<script src="assets/js/tasks.js"></script>
</head>
@@ -124,27 +125,40 @@ if (!isset($topicData)) {
<div class="content-card mt-[8px]">
<h1 class="content-title">Aufgaben</h1>
<div style="display: flex; flex-direction: column; gap: 0.5rem;">
<?php
foreach ($tasks as $index => $task) {
$taskId = $index;
foreach ($tasks as $taskIndex => $task) {
$taskId = $taskIndex;
?>
<div class="task-container"
data-task-id="<?php echo htmlspecialchars($taskId, ENT_QUOTES, 'UTF-8'); ?>">
<p>
<?php echo ($index + 1) . '. ' . htmlspecialchars($task->getText(), ENT_QUOTES, 'UTF-8'); ?>
<?php echo '<b>Aufgabe ' . ($taskIndex + 1) . ':</b> ' . htmlspecialchars($task->getText(), ENT_QUOTES, 'UTF-8'); ?>
</p>
<div style="display: flex; flex-wrap: wrap; gap: 0.5rem; ">
<input type="text" placeholder="Deine Antwort"/>
<button class="bg-white text-[var(--primary-color)] border-2 border-[var(--primary-color)] w-40 h-10 flex items-center justify-center rounded-lg hover:bg-[var(--primary-color)] hover:text-white transition duration-300">
Antwort prüfen
</button>
<button class="bg-white text-[var(--primary-color)] border-2 border-[var(--primary-color)] w-40 h-10 flex items-center justify-center rounded-lg hover:bg-[var(--primary-color)] hover:text-white transition duration-300">
Antwort anzeigen
</button>
<div style="margin-top: 0.5rem;"></div>
</div>
<!-- Diesen Bereich für jeden Eintrag in Variables anzeigen lassen, z.B. x = [Textfeld] ... -->
<?php
$variables = $task->getVariables();
foreach ($variables as $variableIndex => $variable) {
$correctAnswer = $variable;
?>
<div class="variable-container" style="display: flex; flex-wrap: wrap; gap: 0.5rem; ">
<label for="answer<?php echo $taskId . '_' . $variableIndex; ?>"></label>
<input id="answer<?php echo $taskId . '_' . $variableIndex; ?>" type="text"
placeholder="Ihre Antwort" data-correct-answer="<?php echo $correctAnswer; ?>"/>
<button class="check-answer bg-white text-[var(--primary-color)] border-2 border-[var(--primary-color)] w-40 h-10 flex items-center justify-center rounded-lg hover:bg-[var(--primary-color)] hover:text-white transition duration-300">
Antwort prüfen
</button>
<button class="show-answer bg-white text-[var(--primary-color)] border-2 border-[var(--primary-color)] w-40 h-10 flex items-center justify-center rounded-lg hover:bg-[var(--primary-color)] hover:text-white transition duration-300">
Antwort anzeigen
</button>
<div class="feedback" style="color: green; display: none;"></div>
<div class="correct-answer" style="color: blue; display: none; margin-top: 0.5rem;">
Richtige Antwort: <span></span>
</div>
</div>
<?php
}
?>
</div>
<hr>
<?php