Color Blindness Test

Instructions

You will be shown a series of plates with numbers hidden in a pattern of dots. For each plate, enter the number you see in the box. If you do not see a number, leave the box blank or enter '0'.

Plate 1 of

What number do you see?

Your Results

Your Answers

Disclaimer: This is a screening tool, not a formal diagnosis. For a definitive assessment, please consult a qualified optometrist or ophthalmologist.

Plate ${index + 1} (Normal Vision: ${correctForNormal || 'None'})

Your Answer: ${item.answer || 'None'} ${icon}

`; }).join(''); showScreen('results'); document.getElementById('pdf-download-btn').onclick = () => downloadPdf(result, userAnswers); }; const downloadPdf = async (result, answers) => { let answersHTML = ''; answers.forEach((item, index) => { const correctForNormal = item.plate.type === 'control' ? item.plate.correct : item.plate.normal_sees; const isCorrect = item.answer === correctForNormal; answersHTML += ` Plate ${index + 1} ${correctForNormal || 'None'} ${item.answer || 'None'} `; }); let pdfHTML = `

Color Vision Screening Report

${result.title}

${result.description}

Answer Summary

${answersHTML}

Plate	Answer (Normal Vision)	Your Answer

Disclaimer: This is a screening tool, not a diagnosis. Consult a qualified optometrist for a definitive assessment.

`; pdfContentContainer.innerHTML = pdfHTML; pdfContentContainer.classList.remove('hidden'); pdfContentContainer.style.position = 'absolute'; pdfContentContainer.style.left = '-9999px'; try { const { jsPDF } = window.jspdf; const canvas = await html2canvas(pdfContentContainer, { scale: 2 }); const imgData = canvas.toDataURL('image/png'); const pdf = new jsPDF({ orientation: 'portrait', unit: 'mm', format: 'a4' }); const pdfWidth = pdf.internal.pageSize.getWidth(); const pdfHeight = (canvas.height * pdfWidth) / canvas.width; pdf.addImage(imgData, 'PNG', 0, 0, pdfWidth, pdfHeight); pdf.save('Color-Vision-Report.pdf'); } catch (error) { console.error("Failed to generate PDF:", error); } finally { pdfContentContainer.classList.add('hidden'); pdfContentContainer.style.position = ''; pdfContentContainer.style.left = ''; } }; // --- EVENT LISTENERS --- startBtn.addEventListener('click', startTest); nextBtn.addEventListener('click', nextPlate); answerInput.addEventListener('keydown', (e) => { if (e.key === 'Enter') { e.preventDefault(); nextPlate(); } }); });