Create custom.js

custom.js

@@ -0,0 +1,44 @@
+// custom.js
+const recognition = new (window.SpeechRecognition || window.webkitSpeechRecognition)();
+recognition.continuous = false;
+recognition.lang = "en-US";
+
+function startListening() {
+    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...";
+}
+
+recognition.onresult = (event) => {
+    const transcript = event.results[0][0].transcript;
+    document.querySelector("#voiceInput input").value = transcript;
+    document.querySelector("#voiceInput input").dispatchEvent(new Event("change"));
+};
+
+recognition.onend = () => {
+    document.getElementById("micButton").textContent = "🎤 Speak";
+};
+
+recognition.onerror = (event) => {
+    console.error("Speech recognition error", event.error);
+    document.getElementById("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
+});