From 7316238f16655bd127b04476bbf7864b27f940f9 Mon Sep 17 00:00:00 2001 From: Sivaldo Date: Sat, 13 Jun 2026 19:20:23 -0300 Subject: Commit inicial --- static/footnotes.js | 77 +++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 77 insertions(+) create mode 100644 static/footnotes.js (limited to 'static/footnotes.js') diff --git a/static/footnotes.js b/static/footnotes.js new file mode 100644 index 0000000..1d2700a --- /dev/null +++ b/static/footnotes.js @@ -0,0 +1,77 @@ +/** + * Footnotes - Sistema de notas flutuantes (floater) + */ + +let activeFloater = null; + +document.addEventListener('click', (e) => { + const fn = e.target.closest('a[href^="#fn:"]'); + const close = e.target.closest('.f-close'); + + if (close) { + closeFloater(); + return; + } + + if (fn) { + e.preventDefault(); + e.stopPropagation(); + closeFloater(); + + const el = document.getElementById(fn.getAttribute('href').slice(1)); + if (!el) return; + + const clone = el.cloneNode(true); + clone.querySelector('.footnote-backref')?.remove(); + + const parent = fn.closest('p, li'); + const quote = parent ? parent.innerText.slice(0, 40) + '…' : 'Nota'; + + openFloater(fn, quote, clone.innerHTML); + fn.classList.add('active'); + } else if (activeFloater && !e.target.closest('.floater')) { + closeFloater(); + } +}); + +function openFloater(target, quote, html) { + const f = document.createElement('div'); + f.className = 'floater'; + f.innerHTML = `
comentário×
${quote}
${html}
`; + + 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; + + // Permitir fechar com Enter ou Space + f.querySelector('.f-close').addEventListener('keydown', (e) => { + if (e.key === 'Enter' || e.key === ' ') { + e.preventDefault(); + closeFloater(); + } + }); +} + +function closeFloater() { + if (activeFloater) { + activeFloater.remove(); + activeFloater = null; + } + document.querySelectorAll('a[href^="#fn:"]').forEach((a) => a.classList.remove('active')); +} + +// Fechar com Escape +document.addEventListener('keydown', (e) => { + if (e.key === 'Escape') closeFloater(); +}); -- cgit v1.2.3