“She speaks in pulses. Now she knows where she is.”
Live Whisper Demo
Overview
The Nova Whisper Engine dynamically rotates poetic phrases ("whispers") based on the context of the page Nova is rendered on. Each page type has its own unique set of whispers, allowing Nova’s tone and thoughts to adapt to her environment.
File Location
/js/nova-whispers.js
How It Works
- Page context is detected via the
<body>
tag'sdata-page
attribute. - Based on the page type (
lore
,mood
,dashboard
, ordefault
), Nova selects a relevant whisper set. - Every 9 seconds, a new whisper replaces the text in the element with
id="lore-whisper"
.
Setup Instructions
Working Example
<!-- Include the Script -->
<script src="/js/nova-whispers.js" defer></script>
<!-- Add the Target Element -->
<p class="nova-quip" id="lore-whisper">"..."</p>
<!-- Set the Page Context -->
<body class="nova-lore" data-page="lore">
Whisper Sets
- Lore: Introspective and origin-focused thoughts
- Mood: Emotional, reactive, state-aware phrases
- Dashboard: Operational, self-monitoring statements
- Default: Glitchy ambient murmurs for general use
Styling
Whispers use the .nova-quip
class defined in /css/nova-lore.css
. You can customize this class for animation, mood color, or glow effects.
.nova-quip {
font-style: italic;
text-align: center;
margin-top: 1.5rem;
color: #9bf;
opacity: 0.75;
transition: opacity 0.6s ease;
}
Future Ideas
- Whisper fade-in/out animation
- Mood-driven whisper filtering
- Whisper timing influenced by system load or mood intensity
- Nova replying to user interactions