// 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();
}