NEXUS AI Assistant by HTKhan

\n {isActive && (\n $\"Heart$ \n )}\n

\n );\n}\n\n// Rest of the code remains exactly the same as in the existing code\nfunction App() {\n const [isListening, setIsListening] = useState(false);\n const [isProcessing, setIsProcessing] = useState(false);\n const [isSpeaking, setIsSpeaking] = useState(false);\n const [conversation, setConversation] = useState<{role: string, content: string}[]>([]);\n const recognitionRef = useRef(null);\n const synthesisRef = useRef(null);\n const utteranceRef = useRef(null);\n\n useEffect(() => {\n // Initialize speech recognition and synthesis\n recognitionRef.current = new (window.SpeechRecognition || window.webkitSpeechRecognition)();\n synthesisRef.current = window.speechSynthesis;\n\n recognitionRef.current.continuous = false;\n recognitionRef.current.interimResults = false;\n recognitionRef.current.lang = 'en-US';\n\n recognitionRef.current.onresult = async (event: any) => {\n const transcript = event.results[0][0].transcript;\n setIsProcessing(true);\n \n try {\n const response = await fetch('/chat', {\n method: 'POST',\n body: JSON.stringify({ \n messages: [...conversation, { role: 'user', content: transcript }],\n conversationId: window.localStorage.getItem('conversationId') || undefined\n })\n });\n const { reply, conversationId } = await response.json();\n \n // Store conversation ID in local storage\n if (conversationId) {\n window.localStorage.setItem('conversationId', conversationId);\n }\n\n // Speak the response\n utteranceRef.current = new SpeechSynthesisUtterance(reply);\n utteranceRef.current.onstart = () => {\n setIsProcessing(false);\n setIsSpeaking(true);\n };\n utteranceRef.current.onend = () => {\n setIsSpeaking(false);\n setIsListening(false);\n };\n synthesisRef.current.speak(utteranceRef.current);\n } catch (error) {\n console.error('Chat error:', error);\n setIsProcessing(false);\n setIsListening(false);\n }\n };\n\n recognitionRef.current.onerror = () => {\n setIsListening(false);\n setIsProcessing(false);\n };\n }, [conversation]);\n\n const handleMainButtonClick = () => {\n if (isSpeaking) {\n // Interrupt speaking\n if (synthesisRef.current) {\n synthesisRef.current.cancel();\n setIsSpeaking(false);\n setIsListening(false);\n }\n } else if (isListening) {\n // Stop listening\n if (recognitionRef.current) {\n recognitionRef.current.stop();\n setIsListening(false);\n }\n } else {\n // Start listening\n setIsListening(true);\n recognitionRef.current.start();\n }\n };\n\n const clearConversation = async () => {\n // Clear conversation in local storage and on server\n window.localStorage.removeItem('conversationId');\n \n try {\n await fetch('/clear-conversation', { method: 'POST' });\n setConversation([]);\n } catch (error) {\n console.error('Error clearing conversation:', error);\n }\n };\n\n return (\n

\n NEXUS\n

\n \n

\n \n \n

\n \n

\n\n {conversation.length > 0 && (\n \n )}\n

\n );\n}\n\nfunction client() {\n createRoot(document.getElementById(\"root\")).render();\n}\nif (typeof document !== \"undefined\") { client(); }\n\nexport default async function server(request: Request): Promise {\n const { blob } = await import(\"https://esm.town/v/std/blob\");\n const { OpenAI } = await import(\"https://esm.town/v/std/openai\");\n const openai = new OpenAI();\n\n // Clear conversation endpoint\n if (request.method === 'POST' && new URL(request.url).pathname === '/clear-conversation') {\n const conversationId = new URL(request.url).searchParams.get('conversationId');\n if (conversationId) {\n await blob.delete(`conversation_${conversationId}`);\n }\n return new Response(JSON.stringify({ success: true }), {\n headers: { 'Content-Type': 'application/json' }\n });\n }\n\n // Chat endpoint\n if (request.method === 'POST' && new URL(request.url).pathname === '/chat') {\n const { messages, conversationId } = await request.json();\n \n // Generate or use existing conversation ID\n const currentConversationId = conversationId || crypto.randomUUID();\n \n // Retrieve previous conversation context\n let previousContext: {role: string, content: string}[] = [];\n try {\n const storedConversation = await blob.getJSON(`conversation_${currentConversationId}`);\n previousContext = storedConversation?.messages || [];\n } catch {}\n\n // Combine previous context with new messages, limiting to last 10 interactions\n const combinedMessages = [...previousContext, ...messages].slice(-20);\n \n const completion = await openai.chat.completions.create({\n messages: combinedMessages,\n model: \"gpt-4o-mini\",\n max_tokens: 250,\n });\n \n const reply = completion.choices[0].message.content || \"I'm not sure how to respond.\";\n \n // Store updated conversation context\n await blob.setJSON(`conversation_${currentConversationId}`, { \n messages: [...combinedMessages, { role: 'assistant', content: reply }] \n });\n\n return new Response(JSON.stringify({ \n reply, \n conversationId: currentConversationId \n }), {\n headers: { 'Content-Type': 'application/json' }\n });\n }\n\n return new Response(`\n \n \n NEXUS AI Assistant by HTKhan\n \n \n \n \n

\n \n \n \n \n `, {\n headers: { 'Content-Type': 'text/html' }\n });\n}\n\nconst css = `\n:root {\n --primary-color: #00ffff;\n --secondary-color: #0080ff;\n --background-color: #000000;\n --text-color: #ffffff;\n}\n\n* {\n box-sizing: border-box;\n margin: 0;\n padding: 0;\n}\n\nbody {\n font-family: 'Inter', 'Arial', sans-serif;\n background-color: #000000;\n color: var(--text-color);\n display: flex;\n justify-content: center;\n align-items: center;\n height: 100vh;\n overflow: hidden;\n perspective: 1000px;\n}\n\n.ai-interface {\n width: 100%;\n height: 100%;\n background-color: #000000;\n display: flex;\n flex-direction: column;\n align-items: center;\n padding: 30px;\n position: relative;\n overflow: hidden;\n transition: all 0.3s ease;\n}\n\n.waveform-container {\n display: flex;\n flex-direction: column;\n align-items: center;\n width: 100%;\n margin-bottom: 20px;\n}\n\n.voice-waveform {\n width: 100%;\n max-width: 300px;\n height: 100px;\n display: flex;\n justify-content: center;\n align-items: center;\n opacity: 0.7;\n}\n\n.heart-rate-gif {\n width: 200px;\n height: auto;\n object-fit: contain;\n}\n\n.ai-header {\n width: 100%;\n display: flex;\n justify-content: center;\n margin-bottom: 30px;\n background-color: #000000;\n}\n\n.ai-logo {\n text-align: center;\n}\n\n.logo-text {\n display: block;\n font-size: 2.5rem;\n font-weight: 800;\n background: linear-gradient(90deg, var(--primary-color), var(--secondary-color));\n -webkit-background-clip: text;\n -webkit-text-fill-color: transparent;\n letter-spacing: 2px;\n}\n\n.interaction-zone {\n flex-grow: 1;\n display: flex;\n justify-content: center;\n align-items: center;\n width: 100%;\n background-color: #000000;\n}\n\n.holographic-border {\n position: relative;\n display: flex;\n justify-content: center;\n align-items: center;\n width: 100%;\n background-color: #000000;\n}\n\n.interaction-button {\n width: 200px;\n height: 200px;\n border-radius: 50%;\n border: 2px solid var(--primary-color);\n background: rgba(0,0,0,0.5);\n display: flex;\n justify-content: center;\n align-items: center;\n cursor: pointer;\n transition: all 0.3s ease;\n position: relative;\n overflow: hidden;\n}\n\n.interaction-button svg {\n width: 80px;\n height: 80px;\n color: var(--primary-color);\n z-index: 2;\n}\n\n.interaction-button.start {\n box-shadow: 0 0 30px rgba(0,255,255,0.3);\n}\n\n.interaction-button.listening {\n animation: pulse 1.5s infinite;\n background: rgba(255,0,0,0.1);\n border-color: red;\n}\n\n.interaction-button.speaking {\n background: rgba(255,165,0,0.1);\n border-color: orange;\n}\n\n.reset-conversation-btn {\n background: transparent;\n border: 1px solid var(--primary-color);\n color: var(--primary-color);\n padding: 10px 20px;\n border-radius: 20px;\n margin-top: 20px;\n cursor: pointer;\n transition: all 0.3s ease;\n}\n\n.reset-conversation-btn:hover {\n background: var(--primary-color);\n color: var(--background-color);\n}\n\n@keyframes pulse {\n 0% { transform: scale(1); }\n 50% { transform: scale(1.05); }\n 100% { transform: scale(1); }\n}\n`;","deleted","label",[99],"permalink","https://www.val.town/x/HTKhan18/chatGPTVoiceModeClone/code/main.tsx","extension","actionData","errors"]