From b6472aa2756b9b57a3ca45a4ff8ea8def96cf344 Mon Sep 17 00:00:00 2001 From: Georg Tomitsch Date: Tue, 1 Apr 2025 10:28:53 +0200 Subject: [PATCH] Fix game server communication by updating ai-fiction.js and adding socket.io script --- public/index.html | 102 ++++++++++++++++++++++++---------------- public/js/ai-fiction.js | 28 +++++++---- 2 files changed, 82 insertions(+), 48 deletions(-) diff --git a/public/index.html b/public/index.html index cd43388..e70dae9 100644 --- a/public/index.html +++ b/public/index.html @@ -1,43 +1,65 @@ - - - - - AI Interactive Fiction - - - - - - - -
-
-
-
-

AI Interactive Fiction

-

A modern take on text adventures

-
-
- ⋆ -
-
+ + + + + + + ai-fiction Book Runtime + + + +

We are using Node.js , + Chromium , + and Electron .

+
+
+
+

powered by Generative AI

+

AI Interactive Fiction

+

An open-world text adventure

+
❦
+
+
+ speech + speed* + restart + save + load +
+
+
+ +
+ +
+ + +
+
+
*click on page or press spacebar to fast forward text animation
+
+
+
+
+
-
-
- Restart - Speech - Speed Reset - Save - Load -
-
-
- - -
-
-
-
- +
+
What do you want to do next?
+
+ + + + + + + + + + + + + \ No newline at end of file diff --git a/public/js/ai-fiction.js b/public/js/ai-fiction.js index e2f7e8a..59979d1 100644 --- a/public/js/ai-fiction.js +++ b/public/js/ai-fiction.js @@ -74,15 +74,15 @@ class AIFiction { // Toggle speech this.speechButton.addEventListener('click', () => { - if (tts.isReady()) { - const enabled = tts.toggle(); + if (ttsHandler && typeof ttsHandler.isEnabled === 'function') { + const enabled = ttsHandler.toggle(); this.updateSpeechButton(enabled); if (enabled) { // Speak the last narrative if speech was just enabled const lastNarrative = this.storyContainer.lastElementChild; if (lastNarrative && lastNarrative.classList.contains('narrative')) { - tts.speak(lastNarrative.textContent); + ttsHandler.speak(lastNarrative.textContent); } } } else { @@ -156,6 +156,15 @@ class AIFiction { // Narrative response received this.socket.on('narrativeResponse', (data) => { + // Clear any pending "thinking" indicators + if (this.currentCommandTimeout) { + clearTimeout(this.currentCommandTimeout); + this.currentCommandTimeout = null; + + // Remove any existing thinking indicators + document.querySelectorAll('.thinking').forEach(el => el.remove()); + } + this.addNarrative(data.text); if (data.suggestions && data.suggestions.length > 0) { @@ -273,7 +282,7 @@ class AIFiction { this.storyContainer.appendChild(element); // Apply SmartyPants transformations for better typography - const processedText = SmartyPants.process(text); + const processedText = SmartyPants.smartypantsu ? SmartyPants.smartypantsu(text, 1) : text; // Clear any existing typing timeouts if (this.typingTimeout) { @@ -284,8 +293,8 @@ class AIFiction { this.typeText(element, processedText, 0); // Read text aloud if speech is enabled - if (tts && tts.enabled) { - tts.speak(text); + if (ttsHandler && ttsHandler.isEnabled()) { + ttsHandler.speak(text); } } @@ -343,7 +352,7 @@ class AIFiction { const element = document.createElement('div'); element.id = id; element.className = 'thinking'; - element.innerHTML = '

Thinking

'; + element.innerHTML = '

Thinking...

'; element.style.fontStyle = 'italic'; element.style.color = '#777'; this.storyContainer.appendChild(element); @@ -412,7 +421,10 @@ class AIFiction { * Scroll the story container to the bottom */ scrollToBottom() { - this.storyContainer.scrollTop = this.storyContainer.scrollHeight; + const container = document.getElementById('page_right'); + if (container) { + container.scrollTop = container.scrollHeight; + } } }