From 7316238f16655bd127b04476bbf7864b27f940f9 Mon Sep 17 00:00:00 2001
From: Sivaldo <sivaldodavi@disroot.org>
Date: Sat, 13 Jun 2026 19:20:23 -0300
Subject: Commit inicial

---
 layouts/partials/quiz-runtime.html | 447 +++++++++++++++++++++++++++++++++++++
 1 file changed, 447 insertions(+)
 create mode 100644 layouts/partials/quiz-runtime.html

(limited to 'layouts/partials/quiz-runtime.html')

diff --git a/layouts/partials/quiz-runtime.html b/layouts/partials/quiz-runtime.html
new file mode 100644
index 0000000..9ce5aab
--- /dev/null
+++ b/layouts/partials/quiz-runtime.html
@@ -0,0 +1,447 @@
+<script>
+/* ── ESTADO DA APLICAÇÃO ── */
+let currentQuiz = null;
+/* questions, qIndex, acertos, erros, answered → usam _qState (quiz-engine.html) */
+
+const BASE_TITLE = document.title;
+
+let activeFloater       = null;
+let currentTextComments = {};
+let lastSubjectRoute    = null;
+
+/* ── UTILITÁRIOS ── */
+/* shuffle, esc, md → quiz-parser.html | _qState, _renderQuestion, etc. → quiz-engine.html */
+
+function slugifyText(s) {
+  return String(s || '')
+    .normalize('NFD').replace(/[\u0300-\u036f]/g, '')
+    .toLowerCase().replace(/[^a-z0-9]+/g, '-').replace(/^-+|-+$/g, '');
+}
+
+function show(id) {
+  ['page-home','page-quiz','page-result','page-text'].forEach(p => {
+    const el = document.getElementById(p);
+    if (el) el.classList.toggle('active', p === id);
+  });
+}
+
+/* ── ROTEAMENTO ── */
+function encodeHash(type, a, b, c) {
+  if (type === 'home')     return '';
+  if (type === 'disc')     return '#disc/' + encodeURIComponent(a);
+  if (type === 'assunto')  return '#assunto/' + [a, b].map(encodeURIComponent).join('/');
+  if (type === 'quiz')     return '#quiz/'    + [a, b, c].map(encodeURIComponent).join('/');
+  if (type === 'simulado') return '#simulado/' + [a, b].map(encodeURIComponent).join('/');
+  return '';
+}
+
+function decodeHash(hash) {
+  if (!hash || hash === '#') return { type: 'home' };
+  const parts = (hash.startsWith('#') ? hash.slice(1) : hash)
+    .split('/').map(s => { try { return decodeURIComponent(s); } catch(e) { return s; } });
+  
+  const type = parts[0];
+  if (type === 'disc' && parts.length >= 2)
+    return { type: 'disc', disc: parts[1] };
+  if (type === 'assunto' && parts.length >= 3)
+    return { type: 'assunto', discFolder: parts[1], slug: parts[2] };
+  if (type === 'quiz' && parts.length >= 4)
+    return { type: 'quiz', discFolder: parts[1], slug: parts[2], quizId: parts[3] };
+  if (type === 'simulado' && parts.length >= 3)
+    return { type: 'simulado', discFolder: parts[1], quizId: parts[2] };
+  
+  return { type: 'home' };
+}
+
+function navigate(hash, replace) {
+  const url = window.location.pathname + window.location.search + (hash || '');
+  if (replace) history.replaceState({ hash }, '', url || window.location.pathname);
+  else         history.pushState({ hash }, '', url || window.location.pathname);
+}
+
+function renderRoute(route) {
+  if (route.type === 'disc')         _showDisc(route.disc);
+  else if (route.type === 'assunto') _openSubject(route.discFolder, route.slug);
+  else if (route.type === 'quiz')    _startQuiz(route.discFolder, route.slug, route.quizId);
+  else if (route.type === 'simulado')_startSimulado(route.discFolder, route.quizId);
+  else _showHome();
+}
+
+window.addEventListener('popstate', () => renderRoute(decodeHash(window.location.hash)));
+
+/* ── INTERFACE: HOME ── */
+function showHome() { navigate('', false); _showHome(); }
+
+function _showHome() {
+  closeFloater();
+  buildHome();
+  show('page-home');
+  document.getElementById('breadcrumb').textContent = '';
+  document.title = BASE_TITLE;
+}
+
+function buildHome() {
+  const el = document.getElementById('page-home');
+  el.innerHTML = `
+    <div class="disc-grid">
+      ${DATA.map(disc => {
+        const n  = disc.subjects.length;
+        const nq = disc.subjects.reduce((acc, s) => acc + s.quizzes.length, 0) + (disc.quizzes ? disc.quizzes.length : 0);
+        const meta = [
+          n  ? `${n} assunto${n  > 1 ? 's' : ''}` : null,
+          nq ? `${nq} quiz${nq > 1 ? 'zes' : ''}` : null,
+        ].filter(Boolean).join(' · ') || 'sem conteúdo';
+        return `
+          <a class="disc-card fade" href="${encodeHash('disc', disc.discipline)}"
+             onclick="openDisc('${esc(disc.discipline)}');return false;">
+            <div class="disc-card-name">${esc(disc.discipline)}</div>
+            <div class="disc-card-meta">${meta}</div>
+          </a>`;
+      }).join('')}
+    </div>`;
+}
+
+/* ── INTERFACE: DISCIPLINA ── */
+function openDisc(discName) { navigate(encodeHash('disc', discName), false); _showDisc(discName); }
+
+function _showDisc(discName) {
+  closeFloater();
+  const disc = DATA.find(d => d.discipline === discName);
+  if (!disc) { _showHome(); return; }
+
+  const introHtml = disc.intro && disc.intro.content
+    ? `<div class="disc-intro">
+         <article class="prose disc-intro-prose">${disc.intro.content}</article>
+         ${disc.intro.references && disc.intro.references.length
+           ? `<div class="references disc-intro-refs">
+                <div class="ref-head">referências</div>
+                <div class="ref-list">${disc.intro.references.map(r => `<p>${esc(r)}</p>`).join('')}</div>
+              </div>`
+           : ''}
+       </div>`
+    : '';
+
+  const simuladosHtml = disc.quizzes && disc.quizzes.length ? `
+    <div class="subject-group">
+      <div class="sq-label" style="margin-bottom:10px;">Simulados da Disciplina</div>
+      ${disc.quizzes.map(qz => `
+        <a class="sq-item" href="${encodeHash('simulado', disc.folderKey, qz.id)}"
+           onclick="startSimulado('${esc(disc.folderKey)}','${esc(qz.id)}');return false;"
+           style="border-bottom:none; background:var(--surface); padding: 10px; border-radius: 4px; margin-bottom: 5px;">
+          <span class="sq-name" style="color:var(--amber); font-weight:bold;">${esc(qz.title)}</span>
+          <span class="sq-meta">${qz.questions.length} questões</span>
+        </a>
+      `).join('')}
+    </div>
+  ` : '';
+
+  const subjectsHtml = disc.subjects.map(s => {
+    const bits = [];
+    if (s.text) bits.push('texto');
+    if (s.quizzes.length) bits.push(`${s.quizzes.length} quiz${s.quizzes.length > 1 ? 'zes' : ''}`);
+    const meta = bits.join(' · ') || 'vazio';
+    return `
+      <a class="subject-row" href="${encodeHash('assunto', disc.folderKey, s.slug)}"
+         onclick="openSubject('${esc(disc.folderKey)}','${esc(s.slug)}');return false;">
+        <span class="subject-row-name">${esc(s.name)}</span>
+        <span class="subject-row-meta">${meta}</span>
+      </a>`;
+  }).join('');
+
+  const el = document.getElementById('page-home');
+  el.innerHTML = `
+    <div class="discipline fade">
+      <div class="disc-back"><a href="#" onclick="showHome();return false;">← disciplinas</a></div>
+      <div class="discipline-name">${esc(disc.discipline)}</div>
+      ${introHtml}
+      ${simuladosHtml}
+      <div class="subject-list">${subjectsHtml || '<p class="empty-note">sem assuntos ainda</p>'}</div>
+    </div>`;
+
+  show('page-home');
+  document.getElementById('breadcrumb').textContent = disc.discipline;
+  document.title = disc.discipline + ' · ' + BASE_TITLE;
+}
+
+/* ── INTERFACE: ASSUNTO ── */
+function openSubject(discFolder, slug) {
+  navigate(encodeHash('assunto', discFolder, slug), false);
+  _openSubject(discFolder, slug);
+}
+
+function _openSubject(discFolder, slug) {
+  closeFloater();
+  const disc = DATA.find(d => d.folderKey === discFolder);
+  if (!disc) { _showHome(); return; }
+  const sub = disc.subjects.find(s => s.slug === slug);
+  if (!sub) { _showDisc(disc.discipline); return; }
+
+  lastSubjectRoute = { discFolder, slug, discName: disc.discipline, subjectName: sub.name };
+
+  document.getElementById('text-discipline').textContent = disc.discipline;
+  document.getElementById('text-title').textContent      = sub.name;
+
+  const qzWrap = document.getElementById('text-quizzes');
+  const qzList = document.getElementById('text-quizzes-list');
+  
+  if (sub.quizzes.length) {
+    qzWrap.style.display = '';
+    qzList.innerHTML = sub.quizzes.map(qz => {
+      const mc   = qz.questions.filter(q => q.type === 'mc').length;
+      const open = qz.questions.filter(q => q.type === 'open').length;
+      const meta = [
+        mc   ? `${mc} mc`        : null,
+        open ? `${open} abertas` : null,
+      ].filter(Boolean).join(' · ') || `${qz.questions.length} questões`;
+      return `
+        <a class="sq-item" href="${encodeHash('quiz', discFolder, slug, qz.id)}"
+           onclick="startQuiz('${esc(discFolder)}','${esc(slug)}','${esc(qz.id)}');return false;">
+          <span class="sq-name">${esc(qz.title)}</span>
+          <span class="sq-meta">${meta}</span>
+        </a>`;
+    }).join('');
+  } else {
+    qzWrap.style.display = 'none';
+    qzList.innerHTML = '';
+  }
+
+  const prose = document.getElementById('prose');
+  if (sub.text && sub.text.content) {
+    prose.innerHTML = sub.text.content;
+    currentTextComments = {};
+    buildToc(prose);
+  } else {
+    prose.innerHTML = '<p class="empty-note">Texto ainda não disponível para este assunto.</p>';
+    document.getElementById('text-toc').style.display = 'none';
+  }
+
+  const refContainer = document.getElementById('text-references-container');
+  const refList      = document.getElementById('text-references-list');
+  const refs = sub.text ? (sub.text.references || []) : [];
+  
+  if (refs.length) {
+    refContainer.style.display = 'block';
+    refList.innerHTML = refs.map(r => `<p>${esc(r)}</p>`).join('');
+  } else {
+    refContainer.style.display = 'none';
+  }
+
+  document.getElementById('breadcrumb').textContent = `${disc.discipline} · ${sub.name}`;
+  document.title = sub.name + ' · ' + BASE_TITLE;
+  show('page-text');
+  window.scrollTo(0, 0);
+}
+
+/* ── INTERFACE: SUMÁRIO (TOC) ── */
+function buildToc(proseEl) {
+  const tocWrap = document.getElementById('text-toc');
+  const tocList = document.getElementById('text-toc-list');
+  tocList.innerHTML = '';
+
+  const headings = proseEl.querySelectorAll('h2, h3');
+  if (!headings.length) { tocWrap.style.display = 'none'; return; }
+
+  const used = new Set();
+  headings.forEach(h => {
+    if (!h.id) {
+      let base = slugifyText(h.textContent) || 'sec';
+      let id = base, i = 2;
+      while (used.has(id) || document.getElementById(id)) { id = base + '-' + i++; }
+      h.id = id;
+    }
+    used.add(h.id);
+  });
+
+  headings.forEach(h => {
+    const li = document.createElement('li');
+    li.className = 'toc-' + h.tagName.toLowerCase();
+    const a = document.createElement('a');
+    a.href = '#' + h.id;
+    a.textContent = h.textContent;
+    a.addEventListener('click', e => {
+      e.preventDefault();
+      h.scrollIntoView({ behavior: 'smooth', block: 'start' });
+      history.replaceState(history.state, '', '#' + h.id);
+    });
+    li.appendChild(a);
+    tocList.appendChild(li);
+  });
+
+  tocWrap.style.display = '';
+}
+
+/* ── INTERFACE: COMPONENTES FLUTUANTES ── */
+document.addEventListener('click', e => {
+  const footnoteLink = e.target.closest('a[href^="#fn:"]');
+  const closeBtn     = e.target.closest('.f-close');
+  
+  if (closeBtn) { closeFloater(); return; }
+  
+  if (footnoteLink) {
+    e.preventDefault(); e.stopPropagation(); closeFloater();
+    const targetId        = footnoteLink.getAttribute('href').substring(1);
+    const footnoteElement = document.getElementById(targetId);
+    if (footnoteElement) {
+      const contentClone = footnoteElement.cloneNode(true);
+      const backLink = contentClone.querySelector('.footnote-backref');
+      if (backLink) backLink.remove();
+      const parentParagraph = footnoteLink.closest('p, li');
+      const quoteText = parentParagraph ? parentParagraph.innerText.substring(0, 40) + '…' : 'Nota';
+      openFloater(footnoteLink, quoteText, contentClone.innerHTML);
+      footnoteLink.classList.add('active');
+    }
+  } else if (activeFloater && !e.target.closest('.floater')) {
+    closeFloater();
+  }
+});
+
+function openFloater(target, quote, innerHTMLContent) {
+  const f = document.createElement('div');
+  f.className = 'floater';
+  f.innerHTML = `
+    <div class="f-label"><span>comentário</span><span class="f-close">×</span></div>
+    <div class="f-quote">${quote}</div>
+    <div>${innerHTMLContent}</div>`;
+  document.body.appendChild(f);
+  
+  const r       = target.getBoundingClientRect();
+  const top     = window.scrollY + r.bottom + 8;
+  const padding = 20;
+  let   left    = window.scrollX + r.left;
+  const maxLeft = window.innerWidth - f.offsetWidth - padding;
+  
+  if (left > maxLeft) left = Math.max(padding, maxLeft);
+  
+  f.style.top  = top + 'px';
+  f.style.left = left + 'px';
+  activeFloater = f;
+}
+
+function closeFloater() {
+  if (activeFloater) { activeFloater.remove(); activeFloater = null; }
+  document.querySelectorAll('a[href^="#fn:"]').forEach(a => a.classList.remove('active'));
+}
+
+document.addEventListener('keydown', e => { if (e.key === 'Escape') closeFloater(); });
+
+/* ── MOTOR: QUIZ E SIMULADO ── */
+function startQuiz(discFolder, slug, quizId) {
+  navigate(encodeHash('quiz', discFolder, slug, quizId), false);
+  _startQuiz(discFolder, slug, quizId);
+}
+
+function _startQuiz(discFolder, slug, quizId) {
+  closeFloater();
+  const disc = DATA.find(d => d.folderKey === discFolder);
+  if (!disc) { _showHome(); return; }
+  const sub = disc.subjects.find(s => s.slug === slug);
+  if (!sub) { _showDisc(disc.discipline); return; }
+  const quiz = sub.quizzes.find(q => q.id === quizId);
+  if (!quiz) { _openSubject(discFolder, slug); return; }
+
+  lastSubjectRoute = { discFolder, slug, discName: disc.discipline, subjectName: sub.name };
+  currentQuiz = { 
+    isSimulado: false, discFolder, slug, quizId, 
+    subjectName: sub.name, quizTitle: quiz.title 
+  };
+  
+  _qState.questions = prepareQuizQuestions(quiz.questions);
+  _qState.qIndex = _qState.acertos = _qState.erros = 0;
+  _clearProgress('spa_' + discFolder + '_' + slug + '_' + quizId);
+
+  document.getElementById('breadcrumb').textContent = `${disc.discipline} · ${sub.name} · ${quiz.title}`;
+  document.title = `${quiz.title} · ${sub.name} · ${BASE_TITLE}`;
+  
+  show('page-quiz');
+  renderQuestion();
+}
+
+function startSimulado(discFolder, quizId) {
+  navigate(encodeHash('simulado', discFolder, quizId), false);
+  _startSimulado(discFolder, quizId);
+}
+
+function _startSimulado(discFolder, quizId) {
+  closeFloater();
+  const disc = DATA.find(d => d.folderKey === discFolder);
+  if (!disc) { _showHome(); return; }
+  const quiz = disc.quizzes.find(q => q.id === quizId);
+  if (!quiz) { _showDisc(disc.discipline); return; }
+
+  lastSubjectRoute = null; 
+  currentQuiz = { 
+    isSimulado: true, discFolder, quizId, 
+    subjectName: disc.discipline, quizTitle: quiz.title 
+  };
+  
+  _qState.questions = prepareQuizQuestions(quiz.questions);
+  _qState.qIndex = _qState.acertos = _qState.erros = 0;
+  _clearProgress('spa_sim_' + discFolder + '_' + quizId);
+
+  document.getElementById('breadcrumb').textContent = `${disc.discipline} · ${quiz.title}`;
+  document.title = `${quiz.title} · ${disc.discipline} · ${BASE_TITLE}`;
+  
+  show('page-quiz');
+  renderQuestion();
+}
+
+function restartQuiz() {
+  if (currentQuiz.isSimulado) {
+    _clearProgress('spa_sim_' + currentQuiz.discFolder + '_' + currentQuiz.quizId);
+    _startSimulado(currentQuiz.discFolder, currentQuiz.quizId);
+  } else {
+    _clearProgress('spa_' + currentQuiz.discFolder + '_' + currentQuiz.slug + '_' + currentQuiz.quizId);
+    _startQuiz(currentQuiz.discFolder, currentQuiz.slug, currentQuiz.quizId);
+  }
+}
+
+function backToSubject() {
+  if (currentQuiz && currentQuiz.isSimulado) {
+    openDisc(currentQuiz.subjectName);
+  } else if (lastSubjectRoute) {
+    navigate(encodeHash('assunto', lastSubjectRoute.discFolder, lastSubjectRoute.slug), false);
+    _openSubject(lastSubjectRoute.discFolder, lastSubjectRoute.slug);
+  } else {
+    showHome();
+  }
+}
+
+function renderQuestion() {
+  _renderQuestion(_qState.questions[_qState.qIndex]);
+  const progKey = currentQuiz
+    ? 'spa_' + (currentQuiz.isSimulado
+        ? 'sim_' + currentQuiz.discFolder + '_' + currentQuiz.quizId
+        : currentQuiz.discFolder + '_' + currentQuiz.slug + '_' + currentQuiz.quizId)
+    : null;
+  if (progKey) _saveProgress(progKey);
+}
+
+/* selectOpt, showRef, selfJudge, setFeedback → definidos em quiz-parser.html */
+
+function nextQuestion() {
+  _qState.qIndex++;
+  if (_qState.qIndex >= _qState.questions.length) { showResult(); return; }
+  const body = document.getElementById('quiz-body');
+  body.classList.add('fade-out');
+  setTimeout(() => { body.classList.remove('fade-out'); renderQuestion(); }, 100);
+}
+
+/* ── TELA DE RESULTADOS ── */
+function showResult() {
+  show('page-result');
+  _buildResult();
+  document.getElementById('breadcrumb').textContent = currentQuiz.subjectName + ' · ' + currentQuiz.quizTitle;
+}
+
+/* ── INICIALIZAÇÃO DE ROTA ── */
+(function init() {
+  const route = decodeHash(window.location.hash);
+  if (route.type !== 'home') {
+    history.replaceState({ hash: window.location.hash }, '', window.location.href);
+    renderRoute(route);
+  } else {
+    history.replaceState({ hash: '' }, '', window.location.pathname + window.location.search);
+    _showHome();
+  }
+})();
+</script>
-- 
cgit v1.2.3