Interactive
JS-backed widgets in Bifrost: glossary tooltips, reader controls, sharing, keyboard shortcuts, modals, snackbars, listen-button, study-tools, PWA install.
Interactive components are Bifrost’s JS-backed widgets. Each one degrades gracefully: the underlying HTML works without JavaScript (links resolve, text is readable), and the script layer adds affordances like keyboard shortcuts, animated reveals, and clipboard integration.
JavaScript lives in themes/bifrost/static/js/ and is bundled by scripts/bundle.js into themes/bifrost/static/js/dist/core.bundle.js, which base.html loads with defer.
- Glossary tooltip Hover/focus tooltip that shows wiki definitions inline over `.glossary-term` links inside article bodies.
- Reader controls Mobile floating action button (`reader-fab`), the Continue panel and its nav badge, and the scroll progress bar (`reading-progress`).
- Sharing Two share components: `highlight-share` (text-selection popup) and `social-share` (footer share-button row).
- Keyboard shortcuts modal The help overlay listing available keyboard shortcuts, opened by `?`.
- Modal + snackbar The two surface primitives for overlay content: modal mixins (used by search, dropdowns, the shortcuts panel) and snackbar toasts.
- Listen button + audio player Text-to-speech inline trigger and the SoundCloud-style bottom bar that surfaces the active audio session.
- Study tools Per-paragraph bookmark / highlight / note tools inside the Library book reader.
- PWA components Install banner, offline indicator, and update notification — the visual surface of www.wheelofheaven.world's progressive-web-app layer.
- Narrative map (/map/) The interactive Wheel of Heaven map — precessional ellipse, constellations, day boxes, Earth half-arc, hover highlighting, poster-mode toggle, full i18n.