Show sourcecode
The following files exists in this folder. Click to view.
webbserverprogrammering/submissions/projekt-quiz/
README.md
admin/
create_admin.php
create_quiz.php
css/
dashboard.php
debug_questions.php
includes/
index.php
leaderboard.php
login.php
logout.php
my_results.php
quiz.php
quiz_result.php
register.php
sqlcredentials
create_quiz.php
270 lines UTF-8 Unix (LF)
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270
<?php
session_start();
require_once 'includes/db_connect.php';
require_once 'includes/functions.php';
require_once 'includes/session_config.php';
$errors = [];
if (isset($_POST['create_quiz'])) {
// Validera input
$quiz_title = trim($_POST['quiz_title']);
$quiz_description = trim($_POST['quiz_description']);
$questions_raw = $_POST['questions'] ?? [];
$answers_raw = $_POST['answers'] ?? [];
$correct_raw = $_POST['correct'] ?? [];
$questions = [];
if (empty($quiz_title)) {
$errors[] = "Quiz-titel måste fyllas i";
}
if (!is_array($questions_raw) || count($questions_raw) < 1) {
$errors[] = "Du måste ha minst 1 fråga";
}
if (empty($errors)) {
$questionNumber = 0;
foreach ($questions_raw as $qIndex => $qText) {
$questionNumber++;
$qText = trim($qText);
$answers = isset($answers_raw[$qIndex]) ? $answers_raw[$qIndex] : [];
$answers = array_map('trim', $answers);
$correct = isset($correct_raw[$qIndex]) ? intval($correct_raw[$qIndex]) : null;
if (empty($qText)) {
$errors[] = "Fråga $questionNumber måste ha en text";
continue;
}
// Filter empty answers but keep track of correct answer
$answers_struct = [];
$new_correct_index = null;
$new_index = 0;
foreach ($answers as $orig_index => $answer_text) {
if ($answer_text !== '') {
$answers_struct[] = ['text' => $answer_text];
if ($correct !== null && $orig_index == $correct) {
$new_correct_index = $new_index;
}
$new_index++;
}
}
if (count($answers_struct) < 2) {
$errors[] = "Fråga $questionNumber måste ha minst 2 svar";
}
if ($new_correct_index === null) {
$errors[] = "Fråga $questionNumber måste ha ett rätt svar markerat";
}
$questions[] = [
'text' => $qText,
'answers' => $answers_struct,
'correct_answer' => $new_correct_index
];
}
}
if (empty($errors) && !empty($questions)) {
// Spara till databas - use admin_id if admin, else user_id
if (isset($_SESSION['admin_logged_in']) && $_SESSION['admin_logged_in'] === true) {
$creator_id = $_SESSION['admin_id'];
} else {
$creator_id = isset($_SESSION['user_id']) ? $_SESSION['user_id'] : null;
}
saveQuizToDatabase($pdo, $quiz_title, $quiz_description, $questions, $creator_id);
}
}
$page_title = 'Skapa Quiz';
require_once 'includes/header.php';
?>
<div class="container">
<h1>Skapa nytt Quiz</h1>
<?php if (!empty($errors)): ?>
<div class="error-message">
<?php foreach ($errors as $error): ?>
<p><?php echo htmlspecialchars($error); ?></p>
<?php endforeach; ?>
</div>
<?php endif; ?>
<form method="POST">
<div class="form-group">
<label for="quiz_title">Quiz-titel:</label>
<input type="text" name="quiz_title" id="quiz_title" required placeholder="T.ex. Geografi Quiz"
value="<?php echo isset($_POST['quiz_title']) ? htmlspecialchars($_POST['quiz_title']) : ''; ?>">
</div>
<div class="form-group">
<label for="quiz_description">Beskrivning:</label>
<textarea name="quiz_description" id="quiz_description" placeholder="Berätta lite om quizet..."><?php echo isset($_POST['quiz_description']) ? htmlspecialchars($_POST['quiz_description']) : ''; ?></textarea>
</div>
<h2>Frågor</h2>
<div id="questions">
<div class="question-block" data-uid="0">
<h3 class="question-title">Fråga 1</h3>
<div class="form-group">
<label>Frågetext:</label>
<input type="text" name="questions[0]" placeholder="Skriv din fråga här" required>
</div>
<div class="answers-grid">
<div class="answer-input">
<input type="text" name="answers[0][]" placeholder="Svar 1" required>
<label class="radio-label">
<input type="radio" name="correct[0]" value="0" required> Rätt
</label>
</div>
<div class="answer-input">
<input type="text" name="answers[0][]" placeholder="Svar 2" required>
<label class="radio-label">
<input type="radio" name="correct[0]" value="1"> Rätt
</label>
</div>
<div class="answer-input">
<input type="text" name="answers[0][]" placeholder="Svar 3 (valfritt)">
<label class="radio-label">
<input type="radio" name="correct[0]" value="2"> Rätt
</label>
</div>
<div class="answer-input">
<input type="text" name="answers[0][]" placeholder="Svar 4 (valfritt)">
<label class="radio-label">
<input type="radio" name="correct[0]" value="3"> Rätt
</label>
</div>
</div>
<button type="button" class="btn btn-small btn-danger" onclick="removeQuestion(this)">Ta bort fråga</button>
</div>
</div>
<div class="form-actions" style="margin-top: 20px;">
<button type="button" class="btn btn-secondary" onclick="addQuestion()">+ Lägg till fråga</button>
<button type="submit" name="create_quiz" class="btn btn-primary">Spara Quiz</button>
</div>
</form>
</div>
<style>
.answers-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
gap: 15px;
margin: 20px 0;
}
.answer-input {
display: flex;
align-items: center;
gap: 10px;
background: var(--bg-input);
padding: 10px 15px;
border-radius: 8px;
border: 1px solid var(--border-color);
}
.answer-input input[type="text"] {
flex: 1;
background: transparent;
border: none;
color: var(--text-primary);
font-size: 15px;
}
.answer-input input[type="text"]:focus {
outline: none;
}
.radio-label {
display: flex;
align-items: center;
gap: 5px;
color: var(--text-secondary);
font-size: 0.9em;
cursor: pointer;
white-space: nowrap;
}
.radio-label input[type="radio"] {
accent-color: var(--success);
}
</style>
<script>
let uniqueIdCounter = 1;
function addQuestion(e) {
if (e) e.preventDefault();
const questionsDiv = document.getElementById('questions');
const questionCount = document.querySelectorAll('.question-block').length;
const uid = uniqueIdCounter++;
const newQuestion = document.createElement('div');
newQuestion.className = 'question-block';
newQuestion.setAttribute('data-uid', uid);
newQuestion.innerHTML = `
<h3 class="question-title">Fråga ${questionCount + 1}</h3>
<div class="form-group">
<label>Frågetext:</label>
<input type="text" name="questions[${uid}]" placeholder="Skriv din fråga här" required>
</div>
<div class="answers-grid">
<div class="answer-input">
<input type="text" name="answers[${uid}][]" placeholder="Svar 1" required>
<label class="radio-label">
<input type="radio" name="correct[${uid}]" value="0" required> Rätt
</label>
</div>
<div class="answer-input">
<input type="text" name="answers[${uid}][]" placeholder="Svar 2" required>
<label class="radio-label">
<input type="radio" name="correct[${uid}]" value="1"> Rätt
</label>
</div>
<div class="answer-input">
<input type="text" name="answers[${uid}][]" placeholder="Svar 3 (valfritt)">
<label class="radio-label">
<input type="radio" name="correct[${uid}]" value="2"> Rätt
</label>
</div>
<div class="answer-input">
<input type="text" name="answers[${uid}][]" placeholder="Svar 4 (valfritt)">
<label class="radio-label">
<input type="radio" name="correct[${uid}]" value="3"> Rätt
</label>
</div>
</div>
<button type="button" class="btn btn-small btn-danger" onclick="removeQuestion(this)">Ta bort fråga</button>
`;
questionsDiv.appendChild(newQuestion);
}
function removeQuestion(button) {
const questionBlock = button.closest('.question-block');
if (document.querySelectorAll('.question-block').length > 1) {
questionBlock.remove();
renumberQuestions();
} else {
alert('Du måste ha minst en fråga!');
}
}
function renumberQuestions() {
const questions = document.querySelectorAll('.question-block');
questions.forEach((q, index) => {
const title = q.querySelector('.question-title');
if (title) {
title.textContent = `Fråga ${index + 1}`;
}
});
}
</script>
<?php require_once 'includes/footer.php'; ?>