// Global variables let isDarkMode = true; let currentChat = []; let isTyping = false; // DOM elements const messageInput = document.getElementById('messageInput'); const sendBtn = document.getElementById('sendBtn'); const chatContainer = document.getElementById('chatContainer'); const welcomeScreen = document.getElementById('welcomeScreen'); const themeToggle = document.getElementById('themeToggle'); const settingsBtn = document.getElementById('settingsBtn'); const settingsModal = document.getElementById('settingsModal'); const closeSettings = document.getElementById('closeSettings'); const loadingOverlay = document.getElementById('loadingOverlay'); const suggestions = document.getElementById('suggestions'); // Initialize document.addEventListener('DOMContentLoaded', () => { initializeApp(); }); function initializeApp() { setupEventListeners(); setupAutoResize(); setupQuickActions(); setupSuggestionChips(); // Auto-focus input messageInput.focus(); } // Event listeners function setupEventListeners() { sendBtn.addEventListener('click', sendMessage); messageInput.addEventListener('keypress', (e) => { if (e.key === 'Enter' && !e.shiftKey) { e.preventDefault(); sendMessage(); } }); themeToggle.addEventListener('click', toggleTheme); settingsBtn.addEventListener('click', () => settingsModal.classList.remove('hidden')); closeSettings.addEventListener('click', () => settingsModal.classList.add('hidden')); // Handle suggestion clicks document.querySelectorAll('.suggestion-chip').forEach(chip => { chip.addEventListener('click', () => { messageInput.value = chip.dataset.suggestion; messageInput.focus(); }); }); } // Auto-resize textarea function setupAutoResize() { messageInput.addEventListener('input', () => { messageInput.style.height = 'auto'; messageInput.style.height = Math.min(messageInput.scrollHeight, 120) + 'px'; }); } // Quick actions function setupQuickActions() { document.querySelectorAll('.quick-action-btn').forEach(btn => { btn.addEventListener('click', () => { const prompt = btn.dataset.prompt; messageInput.value = prompt; sendMessage(); }); }); } // Suggestion chips with better suggestions function setupSuggestionChips() { const hindiSuggestions = [ "क्या हाल है?", "मजाक सुनाओ", "मौसम कैसा है?", "कहानी सुनाओ", "समय क्या हुआ?", "कविता सुनाओ", "कोड लिखो", "तुम कैसे हो?", "मदद चाहिए", "नमस्ते" ]; const englishSuggestions = [ "How are you?", "Tell me a joke", "What's the weather?", "Tell a story", "What time is it?", "Write a poem", "Write some code", "How are you doing?", "I need help", "Hello there" ]; // Update suggestions periodically with mix of languages setInterval(() => { const chips = suggestions.querySelectorAll('.suggestion-chip'); chips.forEach((chip, index) => { const useHindi = Math.random() > 0.5; const suggestionsArray = useHindi ? hindiSuggestions : englishSuggestions; const randomIndex = Math.floor(Math.random() * suggestionsArray.length); chip.textContent = suggestionsArray[randomIndex]; chip.dataset.suggestion = suggestionsArray[randomIndex]; }); }, 8000); // Slightly faster update } // Send message with smoother experience async function sendMessage() { const message = messageInput.value.trim(); if (!message || isTyping) return; // Hide welcome screen with smooth transition if (!welcomeScreen.classList.contains('hidden')) { welcomeScreen.style.opacity = '0'; welcomeScreen.style.transition = 'opacity 0.3s ease'; setTimeout(() => { welcomeScreen.classList.add('hidden'); chatContainer.classList.remove('hidden'); chatContainer.style.opacity = '0'; setTimeout(() => { chatContainer.style.opacity = '1'; chatContainer.style.transition = 'opacity 0.3s ease'; }, 10); }, 300); } else { chatContainer.classList.remove('hidden'); } // Add user message addMessage(message, 'user'); messageInput.value = ''; messageInput.style.height = 'auto'; // Show typing indicator showTypingIndicator(); // Generate AI response with improved system await generateAIResponse(message); } // Add message to chat with improved code handling function addMessage(content, sender) { const messageDiv = document.createElement('div'); messageDiv.className = `flex ${sender === 'user' ? 'justify-end' : 'justify-start'} message-enter`; const messageContent = document.createElement('div'); messageContent.className = sender === 'user' ? 'user-message' : 'ai-message'; // Improved code detection with multiple languages if (content.includes('```')) { const parts = content.split('```'); parts.forEach((part, index) => { if (index % 2 === 1) { // Code block with syntax highlighting const pre = document.createElement('pre'); pre.className = 'code-block'; const code = document.createElement('code'); // Detect language for better formatting const firstLine = part.trim().split('\n')[0]; let language = 'javascript'; if (firstLine.includes('python') || firstLine.includes('py')) language = 'python'; if (firstLine.includes('html')) language = 'html'; if (firstLine.includes('css')) language = 'css'; if (firstLine.includes('java')) language = 'java'; code.className = `language-${language}`; code.textContent = part.replace(firstLine, '').trim(); pre.appendChild(code); messageContent.appendChild(pre); } else if (part.trim()) { // Regular text with proper line breaks part.split('\n').forEach(textLine => { if (textLine.trim()) { const p = document.createElement('p'); p.textContent = textLine; p.style.marginBottom = '0.5rem'; messageContent.appendChild(p); } }); } }); } else { // Handle regular text with line breaks content.split('\n').forEach(textLine => { if (textLine.trim()) { const p = document.createElement('p'); p.textContent = textLine; p.style.marginBottom = '0.5rem'; messageContent.appendChild(p); } }); } messageDiv.appendChild(messageContent); chatContainer.appendChild(messageDiv); // Smooth scroll to bottom setTimeout(() => { chatContainer.scrollTo({ top: chatContainer.scrollHeight, behavior: 'smooth' }); }, 50); // Store in current chat currentChat.push({ content, sender, timestamp: new Date() }); } // Show typing indicator function showTypingIndicator() { isTyping = true; const typingDiv = document.createElement('div'); typingDiv.className = 'flex justify-start message-enter'; typingDiv.id = 'typingIndicator'; const typingContent = document.createElement('div'); typingContent.className = 'typing-indicator'; typingContent.innerHTML = ''; typingDiv.appendChild(typingContent); chatContainer.appendChild(typingDiv); chatContainer.scrollTop = chatContainer.scrollHeight; } // Generate AI response with strict Hindi-first behavior async function generateAIResponse(userMessage) { // Faster response time await new Promise(resolve => setTimeout(resolve, 200 + Math.random() * 100)); const typingIndicator = document.getElementById('typingIndicator'); if (typingIndicator) typingIndicator.remove(); let response = ""; const hasHindi = /[\u0900-\u097F]/.test(userMessage); const hasEnglish = /[a-zA-Z]/.test(userMessage); const useHindi = hasHindi || !hasEnglish; const lowerMessage = userMessage.toLowerCase(); // Greetings - Normal human-like if (lowerMessage.includes('नमस्ते') || lowerMessage.includes('हैलो') || lowerMessage === 'hi' || lowerMessage === 'hello') { response = "नमस्ते!"; } else if (lowerMessage.includes('हाल') || lowerMessage.includes('कैसे') || lowerMessage.includes('how are')) { response = useHindi ? "ठीक हूँ। आप?" : "I'm good. You?"; } // Joke - Direct joke, no intro else if (lowerMessage.includes('joke') || lowerMessage.includes('मजाक') || lowerMessage.includes('मजा')) { response = useHindi ? "डॉक्टर: आपको 1 दिन की दवा लेनी है।\nमरीज़: कब से?\nडॉक्टर: कब से क्या?" : "Doctor: Take 1 day of medicine.\nPatient: Since when?\nDoctor: Since when what?"; } // Story - Immediate full story else if (lowerMessage.includes('कहानी') || lowerMessage.includes('story') || lowerMessage.includes('कहो')) { response = useHindi ? "एक चूहा था जो रोज़ दाना बीनता। एक दिन उसे सोने का सिक्का मिला। खुश होकर उसने उसे छिपाया। दूसरे दिन चोर आया, सब ले गया। चूहे ने सीखा: अति का भला न बोले रे कोई।" : "A mouse collected grain daily. One day he found a gold coin. He hid it happily. Next day a thief came, took everything. Mouse learned: Greed brings loss."; } // Poetry - Direct poem else if (lowerMessage.includes('कविता') || lowerMessage.includes('poem') || lowerMessage.includes('कविता सुनाओ')) { response = useHindi ? "चाँद सितारे आसमान में,\nचिड़ियाँ चहचहाती हैं,\nमन करता है उड़ जाऊँ मैं,\nइस अनंत नभ में।" : "Moon and stars in the sky,\nBirds are chirping,\nI wish to fly,\nIn this endless sky."; } // Code - ONLY if explicitly asked "code likho" or "कोड लिखो" else if (lowerMessage.includes('code likho') || lowerMessage.includes('कोड लिखो') || lowerMessage.includes('code बनाओ')) { response = useHindi ? "हाँ, कौन सा code चाहिए? Python, JavaScript, HTML?" : "Yes, what code do you need?"; } // Weather - Direct answer else if (lowerMessage.includes('मौसम') || lowerMessage.includes('weather')) { response = useHindi ? "माफ़ी, मौसम check नहीं कर पा रहा अभी।" : "Sorry, can't check weather right now."; } // Time - Direct answer else if (lowerMessage.includes('time') || lowerMessage.includes('समय') || lowerMessage.includes('टाइम') || lowerMessage.includes('कितना बजा')) { const now = new Date(); const timeStr = `${now.getHours()}:${now.getMinutes().toString().padStart(2, '0')}`; response = timeStr; } // Help - Direct answer else if (lowerMessage.includes('help') || lowerMessage.includes('मदद') || lowerMessage.includes('help करो')) { response = useHindi ? "बोलिए, क्या चाहिए?" : "Tell me, what do you need?"; } // Math - Direct calculation else if (/[\d+\-*/]/.test(userMessage)) { try { const result = eval(userMessage.replace(/[^0-9+\-*/().\s]/g, '')); response = String(result); } catch { response = useHindi ? "गलत calculation" : "Invalid calculation"; } } // Name - Direct answer else if (lowerMessage.includes('नाम') || lowerMessage.includes('kaun') || lowerMessage.includes('who are')) { response = useHindi ? "मैं Desi AI Assistant हूँ। आपका AI दोस्त।" : "I'm Desi AI Assistant, your AI friend."; } // Age - Direct answer else if (lowerMessage.includes('उम्र') || lowerMessage.includes('age') || lowerMessage.includes('बहुत पुराना')) { response = useHindi ? "बस बनकर हुआ हूँ, उम्र मत पूछो।" : "Just created, don't ask age!"; } // Where - Direct answer else if (lowerMessage.includes('कहाँ') || lowerMessage.includes('where') || lowerMessage.includes('रहता') || lowerMessage.includes('rehta')) { response = useHindi ? "यहीं हूँ, आपके फोन में।" : "Right here, in your phone."; } // Failsafe for unclear inputs else { response = "थोड़ा साफ बताओ"; } addMessage(response, 'ai'); isTyping = false; } // Toggle theme function toggleTheme() { isDarkMode = !isDarkMode; document.body.classList.toggle('bg-gray-900'); document.body.classList.toggle('text-white'); document.body.classList.toggle('bg-white'); document.body.classList.toggle('text-gray-900'); const icon = themeToggle.querySelector('i'); icon.setAttribute('data-feather', isDarkMode ? 'sun' : 'moon'); feather.replace(); }