Test video

.pe-quiz-container { border: 1px solid #ccc; padding: 20px; margin-bottom: 20px; border-radius: 8px; font-family: sans-serif; max-width: 600px; /* Begræns bredden for bedre læsbarhed */ margin-left: auto; /* Centrer containeren hvis muligt */ margin-right: auto; } .pe-question-block { margin-bottom: 15px; padding-bottom: 15px; border-bottom: 1px dashed #eee; } .pe-question-block:last-child { border-bottom: none; } .pe-question-text { font-weight: bold; margin-bottom: 10px; display: block; /* Sørg for at det tager fuld bredde */ } .pe-quiz-button { margin-right: 10px; padding: 8px 15px; border: 1px solid #ddd; background-color: #f7f7f7; cursor: pointer; border-radius: 4px; } .pe-quiz-button:hover { background-color: #eee; } .pe-quiz-button.disabled { cursor: not-allowed; opacity: 0.6; } .pe-feedback { margin-top: 10px; font-style: italic; min-height: 1.2em; /* Undgå at layout hopper */ } .pe-feedback.correct { color: green; } .pe-feedback.incorrect { color: red; } .pe-score-section { margin-top: 20px; padding-top: 15px; border-top: 1px solid #ccc; font-weight: bold; } .pe-reset-button { margin-top: 15px; padding: 10px 20px; background-color: #0073aa; /* Lidt WordPress blå */ color: white; border: none; border-radius: 4px; cursor: pointer; } .pe-reset-button:hover { background-color: #005177; } const quizData = { q1: { question: "1. Prompt engineering handler kun om at skrive lange og detaljerede prompts.", answer: false, explanation: "Klarhed og specificitet er ofte vigtigere end ren længde." }, q2: { question: "2. Kontekst er afgørende for at få gode resultater fra en sprogmodel.", answer: true, explanation: "Kontekst hjælper modellen med at forstå opgaven og begrænsninger." }, q3: { question: "3. Man kan bruge 'roller' (f.eks. \"Opfør dig som en ekspert i...\") til at forbedre svarenes kvalitet.", answer: true, explanation: "At tildele en rolle kan guide modellen til at svare i en bestemt stil eller med et bestemt fokus." }, q4: { question: "4. Det er umuligt at få en sprogmodel til at generere kode.", answer: false, explanation: "Mange store sprogmodeller er trænet på store mængder kode og kan generere kode på flere programmeringssprog." }, q5: { question: "5. 'Few-shot prompting' betyder, at man slet ingen eksempler giver i prompten.", answer: false, explanation: "'Few-shot' betyder at give *nogle få* eksempler. 'Zero-shot' betyder ingen eksempler." } }; let score = 0; const totalQuestions = Object.keys(quizData).length; let answeredQuestions = 0; // Tæller hvor mange spørgsmål der er besvaret // Funktion til at initialisere quizzen function initializeQuiz() { document.getElementById('pe-total-questions').innerText = totalQuestions; document.getElementById('pe-score').innerText = score; // Nulstil knapper og feedback ved start (vigtigt for reset) Object.keys(quizData).forEach(questionId => { const questionBlock = document.getElementById(`pe-q${questionId.substring(1)}`); // f.eks. pe-q1 const buttons = questionBlock.querySelectorAll('.pe-quiz-button'); const feedbackElement = document.getElementById(`pe-feedback-${questionId}`); buttons.forEach(button => { button.disabled = false; button.classList.remove('disabled'); }); feedbackElement.innerHTML = ''; feedbackElement.className = 'pe-feedback'; // Nulstil klasser }); answeredQuestions = 0; // Nulstil tæller } // Funktion til at tjekke svar function checkAnswer(questionId, userAnswer) { const questionData = quizData[questionId]; const feedbackElement = document.getElementById(`pe-feedback-${questionId}`); const questionBlock = document.getElementById(`pe-${questionId}`); const buttons = questionBlock.querySelectorAll('.pe-quiz-button'); // Deaktiver knapper for dette spørgsmål buttons.forEach(button => { button.disabled = true; button.classList.add('disabled'); }); if (userAnswer === questionData.answer) { feedbackElement.innerText = "Korrekt! " + (questionData.explanation || ""); feedbackElement.className = 'pe-feedback correct'; // Tilføj correct klasse score++; } else { const correctAnswerText = questionData.answer ? "Sandt" : "Falsk"; feedbackElement.innerText = `Forkert. Det rigtige svar var ${correctAnswerText}. ` + (questionData.explanation || ""); feedbackElement.className = 'pe-feedback incorrect'; // Tilføj incorrect klasse } answeredQuestions++; // Tæl besvaret spørgsmål op updateScore(); } // Funktion til at opdatere scoren function updateScore() { document.getElementById('pe-score').innerText = score; // Du kan tilføje logik her, f.eks. vise en samlet besked når alle spørgsmål er besvaret // if (answeredQuestions === totalQuestions) { // alert(`Quiz færdig! Din score er ${score} ud af ${totalQuestions}`); // } } // Funktion til at nulstille quizzen function resetQuiz() { score = 0; initializeQuiz(); // Geninitialiserer og nulstiller knapper/feedback } // Initialiser quizzen når siden er loadet document.addEventListener('DOMContentLoaded', initializeQuiz); // Fallback hvis DOMContentLoaded allerede er sket (f.eks. i nogle editor previews) if (document.readyState === "complete" || document.readyState === "interactive") { initializeQuiz(); }