document.addEventListener('DOMContentLoaded', () => {
// Check for saved theme preference
if (localStorage.getItem('darkMode') === 'true') {
document.documentElement.classList.add('dark');
}
// Initialize audio recording
const audioBtn = document.getElementById('audio-btn');
if (audioBtn) {
let mediaRecorder;
let audioChunks = [];
audioBtn.addEventListener('click', async () => {
try {
if (audioBtn.classList.contains('recording')) {
// Stop recording
mediaRecorder.stop();
audioBtn.classList.remove('recording');
audioBtn.innerHTML = '';
feather.replace();
} else {
// Start recording
const stream = await navigator.mediaDevices.getUserMedia({ audio: true });
mediaRecorder = new MediaRecorder(stream);
mediaRecorder.ondataavailable = (e) => {
audioChunks.push(e.data);
};
mediaRecorder.onstop = async () => {
const audioBlob = new Blob(audioChunks, { type: 'audio/wav' });
audioChunks = [];
// Here you would send the audio to your backend for processing
console.log('Audio recorded:', audioBlob);
// Simulate processing
setTimeout(() => {
const chatInput = document.getElementById('chat-input');
if (chatInput) {
chatInput.value = "This is a simulated transcription from the audio recording.";
}
}, 1500);
};
mediaRecorder.start();
audioBtn.classList.add('recording');
audioBtn.innerHTML = '';
feather.replace();
}
} catch (err) {
console.error('Error accessing microphone:', err);
alert('Could not access microphone. Please check permissions.');
}
});
}
// Chat submission
const chatForm = document.getElementById('chat-form');
if (chatForm) {
chatForm.addEventListener('submit', async (e) => {
e.preventDefault();
const input = document.getElementById('chat-input');
const message = input.value.trim();
if (message) {
// Add user message to chat
addMessageToChat('user', message);
input.value = '';
// Show typing indicator
const chatContainer = document.getElementById('chat-container');
if (chatContainer) {
const typingIndicator = document.createElement('div');
typingIndicator.className = 'typing-indicator mb-4';
typingIndicator.innerHTML = `
`;
chatContainer.appendChild(typingIndicator);
chatContainer.scrollTop = chatContainer.scrollHeight;
}
// Simulate AI response (in a real app, this would be an API call)
setTimeout(() => {
// Remove typing indicator
const typingIndicator = document.querySelector('.typing-indicator');
if (typingIndicator) typingIndicator.remove();
// Add AI response
const responses = [
"I'm analyzing your request...",
"That's an interesting question! Here's what I found...",
"Based on my knowledge, I would suggest...",
"I understand what you're asking. Here's my response..."
];
const randomResponse = responses[Math.floor(Math.random() * responses.length)];
addMessageToChat('ai', randomResponse);
}, 2000);
}
});
}
});
function addMessageToChat(role, content) {
const chatContainer = document.getElementById('chat-container');
if (chatContainer) {
const messageDiv = document.createElement('div');
messageDiv.className = `flex mb-4 ${role === 'user' ? 'justify-end' : 'justify-start'}`;
const bubble = document.createElement('div');
bubble.className = `px-4 py-2 max-w-xs md:max-w-md lg:max-w-lg xl:max-w-xl ${role === 'user' ? 'chat-bubble-user' : 'chat-bubble-ai'}`;
bubble.textContent = content;
messageDiv.appendChild(bubble);
chatContainer.appendChild(messageDiv);
chatContainer.scrollTop = chatContainer.scrollHeight;
}
}