Safe Social Media Use Quiz
1. Quiz
2. Results
Your Score:
--%
Complete the quiz to see your results.
Feedback: ${feedback}
${detailedReport}
`;
}
return true; // Indicate successful calculation
};
// --- PDF Download Function ---
const downloadResultsPDF = () => {
// Check if jsPDF is loaded
if (typeof window.jspdf === 'undefined') {
alert("Error: PDF library (jsPDF) could not be loaded. Please check your internet connection.");
return;
}
const { jsPDF } = window.jspdf;
const doc = new jsPDF();
const title = "Safe Social Media Use Quiz Results";
const scoreText = `Score: ${quizResults.score} / ${totalQuestions} (${quizResults.percentage}%)`;
const feedbackText = `Feedback: ${quizResults.feedback}`;
// --- PDF Formatting ---
doc.setFont("helvetica", "bold");
doc.setFontSize(18);
doc.text(title, 105, 25, { align: "center" }); // Center title
doc.setFontSize(14);
doc.text(scoreText, 105, 40, { align: "center" });
doc.setFont("helvetica", "normal");
doc.setFontSize(12);
// Use splitTextToSize for auto-wrapping feedback
const feedbackLines = doc.splitTextToSize(feedbackText, 170); // 170mm width
doc.text(feedbackLines, 20, 55);
let yPos = 55 + (feedbackLines.length * 7) + 10; // Starting Y for details
doc.setFont("helvetica", "bold");
doc.text("Your Answer Review", 20, yPos);
yPos += 10;
doc.setFont("helvetica", "normal");
// Loop through questions for detailed report
const formData = new FormData(quizForm);
for (let i = 1; i <= totalQuestions; i++) {
const questionKey = `q${i}`;
const userAnswer = formData.get(questionKey);
const correctAnswer = correctAnswers[questionKey];
const questionText = questions[i-1];
let resultText = "";
if (userAnswer === correctAnswer) {
resultText = "Your answer was CORRECT.";
} else if (userAnswer) {
resultText = `Your answer ('${userAnswer}') was INCORRECT. The correct answer was '${correctAnswer}'.`;
} else {
resultText = "You did not answer this question.";
}
// Check for page break
if (yPos > 270) {
doc.addPage();
yPos = 20; // Reset Y position on new page
}
doc.setFont("helvetica", "bold");
const qLines = doc.splitTextToSize(questionText, 170);
doc.text(qLines, 20, yPos);
yPos += (qLines.length * 5) + 2; // Adjust Y based on lines
doc.setFont("helvetica", "normal");
const rLines = doc.splitTextToSize(resultText, 170);
doc.text(rLines, 20, yPos);
yPos += (rLines.length * 5) + 8; // Extra spacing for next question
}
// Save the PDF
doc.save("Social_Media_Safety_Quiz_Results.pdf");
};
// --- Event Listeners ---
// Tab clicks
tabs.forEach((tab, index) => {
tab.addEventListener('click', () => {
// Do not allow clicking to results tab if quiz isn't submitted
if (index === 1 && quizResults.percentage === 0) {
// Optionally show a message
// alert("Please submit the quiz first.");
return;
}
showSsmuTab(index);
});
});
// Next button
nextBtn.addEventListener('click', () => {
if (currentTabIndex < tabs.length - 1) {
// If on the first tab (Quiz), calculate results first
if (currentTabIndex === 0) {
if (calculateResults()) {
showSsmuTab(currentTabIndex + 1);
}
} else {
showSsmuTab(currentTabIndex + 1);
}
}
});
// Previous button
prevBtn.addEventListener('click', () => {
if (currentTabIndex > 0) {
showSsmuTab(currentTabIndex - 1);
}
});
// Submit Quiz Button (on tab 1)
submitQuizBtn.addEventListener('click', () => {
if (calculateResults()) {
showSsmuTab(1); // Go to results tab
}
});
// PDF Download Button (on tab 2)
downloadPdfBtn.addEventListener('click', downloadResultsPDF);
// --- Initial Setup ---
showSsmuTab(0); // Show the first tab by default
});