Refactored everything into modules.

public/js/ai-fiction.js

@@ -9,12 +9,10 @@ import { LayoutRenderer } from './layout-renderer.js';
 import { AudioManager } from './audio-manager.js';
 import { TtsPlayer } from './tts-player.js';
 import { PersistenceManager } from './persistence-manager.js';
-// import { InkStoryPlayer } from './ink-story-player.js'; // Replaced by SocketClient logic
+import { InputHandler } from './input-handler.js';
+import { SocketClient } from './socket-client.js';
 import { UiController } from './ui-controller.js';
-// Assuming InputHandler and SocketClient are loaded globally via <script> tags in HTML
-// If using modules properly, they would need imports:
-// import { InputHandler } from './input-handler.js';
-// import { SocketClient } from './socket-client.js';
+import { ttsFactory } from './tts-factory.js';
 
 export class AnimatedFiction {
     /**
@@ -71,11 +69,6 @@ export class AnimatedFiction {
         this.initializeTextMeasurement();
 
         // 2. Input, Socket, and UI Controller
-        // Ensure InputHandler and SocketClient classes are available globally
-        if (typeof InputHandler === 'undefined' || typeof SocketClient === 'undefined') {
-            console.error("InputHandler or SocketClient class not found. Ensure scripts are loaded correctly.");
-            return; // Stop initialization if core components are missing
-        }
         this.inputHandler = new InputHandler('player_input', 'cursor');
         this.socketClient = new SocketClient(this.config.serverUrl); // Pass server URL if provided