`;
}).join('');
switchView('quiz');
};
const submitQuiz = () => {
let score = 0;
quizData.forEach(q => {
const studentAnswerEl = document.querySelector(`[name="student-answer-${q.id}"]:checked`) || document.querySelector(`[name="student-answer-${q.id}"]`);
const studentAnswer = studentAnswerEl ? studentAnswerEl.value.trim() : "";
q.studentAnswer = studentAnswer;
if (studentAnswer.toLowerCase() === q.correctAnswer.toLowerCase()) {
score++;
q.isCorrect = true;
} else {
q.isCorrect = false;
}
});
finalScoreEl.textContent = `${score} / ${quizData.length} (${((score / quizData.length) * 100).toFixed(0)}%)`;
resultsBreakdown.innerHTML = quizData.map((q, index) => `
${index + 1}. ${q.questionText}
Your answer: ${q.studentAnswer || "No answer"}
${!q.isCorrect ? `
Correct answer: ${q.correctAnswer}
` : ''}
`).join('');
switchView('results');
};
// --- PDF Generation ---
const generatePdf = async (type) => {
let html = `
${quizTitleInput.value.trim()}
`;
if (type === 'blank') {
html += quizData.map((q, index) => `
${index + 1}. ${q.questionText}
${q.type === 'sa' ? '
Answer: _________________________________
' : `
${q.options.map(opt => `- □ ${opt}
`).join('')}
`}
`).join('');
} else if (type === 'results') {
html += `
${finalScoreEl.textContent}
` + quizData.map((q, index) => `
${index + 1}. ${q.questionText}
Your answer: ${q.studentAnswer || "No answer"}
${!q.isCorrect ? `
Correct answer: ${q.correctAnswer}
` : ''}
`).join('');
}
pdfContentArea.innerHTML = html;
pdfContentArea.style.display = 'block';
pdfContentArea.style.position = 'absolute';
pdfContentArea.style.left = '-9999px';
pdfContentArea.style.width = '800px';
try {
const canvas = await html2canvas(pdfContentArea, { scale: 2 });
const imgData = canvas.toDataURL('image/png');
const { jsPDF } = window.jspdf;
const pdf = new jsPDF({ orientation: 'portrait', unit: 'px', format: 'a4' });
const pdfWidth = pdf.internal.pageSize.getWidth();
const imgHeight = canvas.height * pdfWidth / canvas.width;
pdf.addImage(imgData, 'PNG', 0, 0, pdfWidth, imgHeight);
pdf.save(`${quizTitleInput.value.trim()}-${type}.pdf`);
} catch (error) {
console.error("PDF generation failed:", error);
alert("Could not generate PDF.");
} finally {
pdfContentArea.style.display = 'none';
}
};
// --- Event Listeners ---
addQuestionBtn.addEventListener('click', addQuestion);
questionsContainer.addEventListener('change', e => {
if (e.target.classList.contains('question-type')) {
renderAnswerFields(e.target.closest('.question-block'), e.target.value);
}
});
questionsContainer.addEventListener('click', e => {
if (e.target.classList.contains('remove-question-btn')) {
e.target.closest('.question-block').remove();
}
});
generateQuizBtn.addEventListener('click', generateQuiz);
downloadBlankQuizBtn.addEventListener('click', () => {
// Temporarily generate quiz data without switching view to validate
generateQuiz();
if(setupError.style.display === 'none') {
generatePdf('blank');
}
});
submitQuizBtn.addEventListener('click', submitQuiz);
downloadResultsBtn.addEventListener('click', () => generatePdf('results'));
startOverBtn.addEventListener('click', () => {
// Reset state
questionsContainer.innerHTML = '';
quizTitleInput.value = '';
questionIdCounter = 0;
addQuestion();
switchView('setup');
});
// --- Initial State ---
addQuestion();
switchView('setup');
});
