From b99ac96ffacbb870751253a42335a4f6f83a8215 Mon Sep 17 00:00:00 2001
From: Spencer Grimes <toamidan@gmail.com>
Date: Tue, 3 Feb 2026 18:02:08 -0600
Subject: [PATCH] Add tap reaction with version display

Tap the screen to see a surprised face and version number.
Returns to normal after 1.5 seconds.

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
---
 index.html | 48 ++++++++++++++++++++++++++++++++++++++++++++----
 1 file changed, 44 insertions(+), 4 deletions(-)

diff --git a/index.html b/index.html
index b088db8..24258cc 100644
--- a/index.html
+++ b/index.html
@@ -198,11 +198,14 @@
         const emoteEl = document.getElementById('emote');
         const messageEl = document.getElementById('message');
         const POLL_INTERVAL = 2000;
+        const VERSION = 'v1.0.0';
 
         // Sound system
         let audioCtx = null;
         let soundEnabled = new URLSearchParams(window.location.search).get('sound') === 'on';
         let lastState = null;
+        let lastData = null;
+        let isReacting = false;
 
         function initAudio() {
             if (!audioCtx) {
@@ -251,6 +254,11 @@
             setTimeout(() => playTone(784, 0.15), 200);
         }
 
+        function playReactSound() {
+            // Cute surprised chirp
+            playTone(600, 0.08, 'sine', 0.06);
+        }
+
         function handleStateChange(newState, newEmote) {
             if (!lastState) {
                 lastState = newState;
@@ -273,15 +281,42 @@
             }
         }
 
-        // Enable sound on first tap (browser autoplay policy)
+        // Handle tap - enable sound and show reaction
         document.body.addEventListener('click', () => {
+            // Enable sound on first tap (browser autoplay policy)
             if (!soundEnabled) {
                 soundEnabled = true;
                 initAudio();
-                // Brief confirmation chirp
-                playTone(660, 0.08, 'sine', 0.05);
             }
-        }, { once: false });
+
+            // Show surprised reaction and version
+            if (!isReacting) {
+                isReacting = true;
+                const prevEmote = emoteEl.textContent;
+                const prevColor = emoteEl.style.color;
+                const prevClass = emoteEl.className;
+                const prevMsg = messageEl.textContent;
+
+                // Surprised face!
+                emoteEl.textContent = '( °o°)';
+                emoteEl.className = 'popping';
+                messageEl.textContent = `Kao ${VERSION}`;
+                playReactSound();
+
+                // Return to normal after 1.5s
+                setTimeout(() => {
+                    if (lastData) {
+                        updateDisplay(lastData);
+                    } else {
+                        emoteEl.textContent = prevEmote;
+                        emoteEl.style.color = prevColor;
+                        emoteEl.className = prevClass;
+                        messageEl.textContent = prevMsg;
+                    }
+                    isReacting = false;
+                }, 1500);
+            }
+        });
 
         // Also init if ?sound=on
         if (soundEnabled) {
@@ -305,6 +340,11 @@
         }
 
         function updateDisplay(data) {
+            lastData = data;
+
+            // Don't update display while showing reaction
+            if (isReacting) return;
+
             // Check for state changes and play sounds
             handleStateChange(data.current_state, data.active_emote);