Commit inicialHEADmain

1 files changed, 170 insertions, 0 deletions

diff --git a/static/quiz-engine.js b/static/quiz-engine.js
new file mode 100644
index 0000000..03e50a5
--- /dev/null
+++ b/static/quiz-engine.js
@@ -0,0 +1,170 @@
+/**
+ * Quiz Engine - Renderiza questões na página
+ */
+
+function _renderQuestion(q) {
+  if (!q) return;
+  const body = document.getElementById('quiz-body');
+  if (!body) return;
+
+  const counter = document.getElementById('q-counter');
+  if (counter) {
+    counter.textContent = `${_qState.qIndex + 1} de ${_qState.questions.length}`;
+  }
+
+  const prog = document.getElementById('prog');
+  if (prog) {
+    const pct = ((_qState.qIndex + 1) / _qState.questions.length) * 100;
+    prog.style.width = pct + '%';
+  }
+
+  if (q.type === 'mc') {
+    body.innerHTML = `<div class="mc-area fade">
+      <p class="q-text">${md(q.text)}</p>
+      <div class="options">
+        ${q.options
+          .map(
+            (o, i) => `<button class="opt" data-opt="${esc(o)}" data-answer="${esc(q.answer)}" onclick="selectOpt(this)" aria-label="Opção ${LETRAS[i]}: ${o}">
+            <span class="opt-letter">${LETRAS[i]}</span>
+            <span>${md(o)}</span>
+          </button>`
+          )
+          .join('')}
+      </div>
+      <div class="feedback-line" id="feedback" aria-live="polite" aria-atomic="true"><span class="feedback-dot"></span><span id="feedback-msg"></span></div>
+      ${q.comment ? `<div class="comment-block" id="comment"><div class="comment-label">comentário</div><div>${md(q.comment)}</div></div>` : ''}
+    </div>`;
+  } else {
+    // Modo Flashcard para questões abertas
+    const isRevealed = _qState.flipped || false;
+    body.innerHTML = `<div class="flashcard-area fade">
+      <p class="q-text">${md(q.text)}</p>
+      <div class="flashcard-simple" id="flashcard">
+        ${!isRevealed ? `<button class="btn btn-reveal" onclick="flipFlashcard()">Revelar Resposta</button>` : `<div class="ref-label">resposta de referência</div><div class="ref-content">${md(q.reference)}</div>`}
+      </div>
+      <div class="feedback-line" id="feedback" aria-live="polite" aria-atomic="true"><span class="feedback-dot"></span><span id="feedback-msg"></span></div>
+      ${q.comment ? `<div class="comment-block" id="comment"><div class="comment-label">comentário</div><div>${md(q.comment)}</div></div>` : ''}
+      <div class="flashcard-btns" id="flashcard-btns">
+        <button class="btn btn-ok" onclick="markFlashcardOk()">✓ Acertei</button>
+        <button class="btn btn-bad" onclick="markFlashcardBad()">✗ Errei</button>
+      </div>
+    </div>`;
+  }
+}
+
+function selectOpt(btn) {
+  if (_qState.answered) return;
+  _qState.answered = true;
+  const chosen = btn.dataset.opt;
+  const correct = btn.dataset.answer;
+  btn.closest('.options').querySelectorAll('.opt').forEach((b) => {
+    b.disabled = true;
+    if (b.dataset.opt === correct) b.classList.add('correct');
+    else if (b === btn) b.classList.add('wrong');
+    else b.classList.add('revealed');
+  });
+  if (chosen === correct) {
+    _qState.acertos++;
+    setFeedback(true, 'Correto');
+  } else {
+    _qState.erros++;
+    setFeedback(false, 'Incorreto — a correta está destacada');
+  }
+  document.getElementById('comment')?.classList.add('show');
+  document.getElementById('btn-next').style.display = '';
+}
+
+function flipFlashcard() {
+  const card = document.getElementById('flashcard');
+  if (card) {
+    _qState.flipped = true;
+    _renderQuestion(_qState.questions[_qState.qIndex]);
+  }
+}
+
+function markFlashcardOk() {
+  _qState.answered = true;
+  _qState.acertos++;
+  setFeedback(true, 'Marcado como acertado');
+  document.getElementById('comment')?.classList.add('show');
+  document.getElementById('flashcard-btns').innerHTML = '';
+  document.getElementById('btn-next').style.display = '';
+}
+
+function markFlashcardBad() {
+  _qState.answered = true;
+  _qState.erros++;
+  setFeedback(false, 'Marcado como errado');
+  document.getElementById('comment')?.classList.add('show');
+  document.getElementById('flashcard-btns').innerHTML = '';
+  document.getElementById('btn-next').style.display = '';
+}
+
+function setFeedback(ok, msg) {
+  const fb = document.getElementById('feedback');
+  fb.className = 'feedback-line show ' + (ok ? 'ok' : 'bad');
+  document.getElementById('feedback-msg').textContent = msg;
+}
+
+function _buildResult() {
+  const { acertos, erros, questions } = _qState;
+  const total = questions.length;
+  const pct = total ? Math.round((acertos / total) * 100) : 0;
+  let nivel, detalhe;
+  if (pct >= 90) {
+    nivel = 'Excelente';
+    detalhe = 'Domínio consistente do conteúdo. Mantenha revisão periódica.';
+  } else if (pct >= 70) {
+    nivel = 'Bom';
+    detalhe = 'Base sólida com pontos a refinar. Revise os erros e releia os comentários.';
+  } else if (pct >= 50) {
+    nivel = 'Regular';
+    detalhe = 'Compreensão parcial, com lacunas importantes. Retome o material teórico.';
+  } else {
+    nivel = 'Insuficiente';
+    detalhe = 'Os conceitos centrais ainda não estão consolidados. Estude o tema e refaça.';
+  }
+  document.getElementById('res-pct').textContent = pct + '%';
+  document.getElementById('res-a').textContent = acertos;
+  document.getElementById('res-a2').textContent = acertos;
+  document.getElementById('res-e').textContent = erros;
+  document.getElementById('res-t').textContent = total;
+  document.getElementById('res-msg-body').innerHTML = `<strong>${nivel}</strong> — ${acertos} de ${total} (${pct}%). ${detalhe}`;
+}
+
+function _saveProgress(key) {
+  try {
+    localStorage.setItem(PROGRESS_PREFIX + key, JSON.stringify({
+      questions: _qState.questions,
+      qIndex: _qState.qIndex,
+      acertos: _qState.acertos,
+      erros: _qState.erros,
+      flipped: _qState.flipped,
+    }));
+  } catch (e) {}
+}
+
+function _loadProgress(key) {
+  try {
+    const s = localStorage.getItem(PROGRESS_PREFIX + key);
+    if (!s) return false;
+    const d = JSON.parse(s);
+    if (!d.questions || !d.questions.length) return false;
+    Object.assign(_qState, {
+      questions: d.questions,
+      qIndex: d.qIndex || 0,
+      acertos: d.acertos || 0,
+      erros: d.erros || 0,
+      flipped: d.flipped || false,
+    });
+    return true;
+  } catch (e) {
+    return false;
+  }
+}
+
+function _clearProgress(key) {
+  try {
+    localStorage.removeItem(PROGRESS_PREFIX + key);
+  } catch (e) {}
+}