Тест: Насколько хорошо вы знаете вселенную Гарри Поттер?

document.addEventListener(«DOMContentLoaded», () => {
const quizCard = document.querySelector(«.obzorkino-quiz-card»);
if (!quizCard) return;

const optionButtons = quizCard.querySelectorAll(«.obzorkino-quiz-option-btn»);
const submitBtn = quizCard.querySelector(«#quiz-submit-btn»);
const resultBox = quizCard.querySelector(«#quiz-result-box»);
const questions = quizCard.querySelectorAll(«.obzorkino-quiz-question»);

optionButtons.forEach(btn => {
btn.addEventListener(«click», () => {
// Находим вопрос, к которому относится данная кнопка
const questionWrapper = btn.closest(«.obzorkino-quiz-question»);
if (!questionWrapper) return;

// Снимаем выделение только с кнопок текущего вопроса
questionWrapper.querySelectorAll(«.obzorkino-quiz-option-btn»).forEach(b => {
b.classList.remove(«selected»);
});

// Выделяем текущую кнопку
btn.classList.add(«selected»);

// Проверяем, сколько вопросов отвечено
let answeredCount = 0;
questions.forEach(q => {
if (q.querySelector(«.obzorkino-quiz-option-btn.selected»)) {
answeredCount++;
}
});

// Разблокируем кнопку, если отвечены все вопросы
if (answeredCount >= questions.length) {
submitBtn.removeAttribute(«disabled»);
}
});
});

submitBtn.addEventListener(«click», () => {
let correctCount = 0;

questions.forEach(q => {
const selectedBtn = q.querySelector(«.obzorkino-quiz-option-btn.selected»);
const allBtns = q.querySelectorAll(«.obzorkino-quiz-option-btn»);

allBtns.forEach(btn => {
const isCorrect = btn.getAttribute(«data-correct») === «1»;

if (isCorrect) {
btn.classList.add(«correct»);
}

if (btn === selectedBtn && !isCorrect) {
btn.classList.add(«incorrect»);
}

btn.setAttribute(«disabled», «true»);
});

if (selectedBtn && selectedBtn.getAttribute(«data-correct») === «1») {
correctCount++;
}
});

submitBtn.setAttribute(«disabled», «true»);

resultBox.innerHTML = `Вы ответили правильно на ${correctCount} из ${questions.length} вопросов!`;
resultBox.style.display = «block»;
});
});