`;
explanationArea.innerHTML = explanationHTML;
explanationArea.style.display = "block";
}
// Audio: read current question aloud with objects
function readCurrentQuestionAloud() {
if (quizFinished) return;
const q = QUESTIONS[currentQuestionIndex];
const objectsWords = q.objects.replace(/[^a-zA-Z0-9\u{1F300}-\u{1F6FF}]/gu, ' ').trim() || " objects";
let spoken = `Question: Identify the number. Look at ${q.objects}. How many objects do you see? Choose the correct number.`;
speakText(spoken, 0.92, 1.08);
}
// Build Number Chart 1-20 with click-to-speak
function buildNumberChart() {
numberGridDiv.innerHTML = "";
for (let i = 1; i <= 20; i++) {
const numDiv = document.createElement("div");
numDiv.classList.add("num-card");
numDiv.innerText = i;
const numberWord = (i === 1 ? "one" : i === 2 ? "two" : i === 3 ? "three" : i === 4 ? "four" : i === 5 ? "five" : i === 6 ? "six" : i === 7 ? "seven" : i === 8 ? "eight" : i === 9 ? "nine" : i === 10 ? "ten" : i === 11 ? "eleven" : i === 12 ? "twelve" : i === 13 ? "thirteen" : i === 14 ? "fourteen" : i === 15 ? "fifteen" : i === 16 ? "sixteen" : i === 17 ? "seventeen" : i === 18 ? "eighteen" : i === 19 ? "nineteen" : "twenty");
numDiv.addEventListener("click", () => {
speakText(numberWord, 0.9, 1.0);
});
numberGridDiv.appendChild(numDiv);
}
}
// Timer function
function startTimer() {
if (timerInterval) clearInterval(timerInterval);
timerInterval = setInterval(() => {
if (!quizFinished) {
timerSeconds++;
const mins = Math.floor(timerSeconds / 60);
const secs = timerSeconds % 60;
timerDisplaySpan.innerText = `${mins.toString().padStart(2,'0')}:${secs.toString().padStart(2,'0')}`;
}
}, 1000);
}
// Initialize / Reset everything (fresh start)
function initQuiz() {
buildNumberChart();
startTimer();
currentQuestionIndex = 0;
userAnswers = new Array(TOTAL_QS).fill(null);
answeredStatus = new Array(TOTAL_QS).fill(false);
marksEarned = 0;
quizFinished = false;
selectedOptionValue = null;
updateStats();
explanationArea.style.display = "none";
explanationArea.innerHTML = "";
loadCurrentQuestion();
submitBtn.disabled = false;
resetQuestionBtn.disabled = false;
feedbackMsgDiv.innerText = "🌟 Tap an answer and submit! Have fun 🌟";
}
// Event listeners
submitBtn.addEventListener("click", handleSubmit);
resetQuestionBtn.addEventListener("click", resetCurrentSelection);
audioReadBtn.addEventListener("click", readCurrentQuestionAloud);
learnExampleBtn.addEventListener("click", () => {
exampleSection.classList.toggle("show");
});
// Start everything
initQuiz();
