Update custom.js

custom.js

@@ -3,42 +3,56 @@ const recognition = new (window.SpeechRecognition || window.webkitSpeechRecognit
 recognition.continuous = false;
 recognition.lang = "en-US";
 
-function startListening() {
-    const apiKey = document.querySelector("#apiKeyInput input").value;
+// Initialize chat box scrolling
+function scrollChat() {
+    const chatBox = document.getElementById("chatBox");
+    if (chatBox) {
+        chatBox.scrollTop = chatBox.scrollHeight;
+    }
+}
+
+// Observe chat box changes for auto-scroll
+const observer = new MutationObserver(scrollChat);
+if (document.getElementById("chatBox")) {
+    observer.observe(document.getElementById("chatBox"), {
+        childList: true,
+        subtree: true
+    });
+}
+
+// Expose function to global scope
+window.startListening = function() {
+    const apiKey = document.querySelector("#apiKeyInput input")?.value;
     if (!apiKey) {
         alert("Please enter your OpenAI API key first!");
         return;
     }
     
     recognition.start();
-    document.getElementById("micButton").textContent = "🔴 Listening...";
+    const micButton = document.getElementById("micButton");
+    if (micButton) micButton.textContent = "🔴 Listening...";
 }
 
 recognition.onresult = (event) => {
     const transcript = event.results[0][0].transcript;
-    document.querySelector("#voiceInput input").value = transcript;
-    document.querySelector("#voiceInput input").dispatchEvent(new Event("change"));
+    const voiceInput = document.querySelector("#voiceInput input");
+    if (voiceInput) {
+        voiceInput.value = transcript;
+        voiceInput.dispatchEvent(new Event("change"));
+    }
 };
 
 recognition.onend = () => {
-    document.getElementById("micButton").textContent = "🎤 Speak";
+    const micButton = document.getElementById("micButton");
+    if (micButton) micButton.textContent = "🎤 Speak";
 };
 
 recognition.onerror = (event) => {
     console.error("Speech recognition error", event.error);
-    document.getElementById("micButton").textContent = "🎤 Speak";
+    const micButton = document.getElementById("micButton");
+    if (micButton) micButton.textContent = "🎤 Speak";
     alert("Speech recognition error: " + event.error);
 };
 
-// Initialize chat box scrolling
-function scrollChat() {
-    const chatBox = document.getElementById("chatBox");
-    chatBox.scrollTop = chatBox.scrollHeight;
-}
-
-// Observe chat box changes for auto-scroll
-const observer = new MutationObserver(scrollChat);
-observer.observe(document.getElementById("chatBox"), {
-    childList: true,
-    subtree: true
-});
+// Initial scroll
+setTimeout(scrollChat, 500);