Fix: tools addition

templates/index.html

@@ -364,13 +364,15 @@
                         <em>आपका अध्ययन साथी (Your Study Companion)</em> ✨
                     </div>
                 </div>
-            </div>               
+            </div>
+            <div class="input-area">               
                 <div class="quick-actions">
                     <button class="quick-btn" onclick="populateInput('Explain ')">📊 Explain Topic</button>
                     <button class="quick-btn" onclick="populateInput('What are the side effects of ')">⚗️ Drug Info</button>
                     <button class="quick-btn" onclick="populateInput('Make a quiz on ')">❓ Create Quiz</button>
                     <button class="quick-btn" onclick="populateInput('Mnemonic for ')">🧠 Mnemonics</button>
                 </div>
+            </div>
 
                 
                 <div class="input-container">
@@ -387,279 +389,82 @@
             </div>
         </div>
     </div>
+  <script>
+        let isProcessing = false;
 
-    <script>
-    
-    let isProcessing = false;
-
-    async function sendMessage() {
-        const input = document.getElementById('messageInput');
-        const message = input.value.trim();
-        if (!message || isProcessing) return;
-
-        addMessage(message, 'user');
-        input.value = '';
-        showLoading(true);
-
-        try {
-            const response = await fetch('/chat', {
-                method: 'POST',
-                headers: { 'Content-Type': 'application/json' },
-                body: JSON.stringify({ query: message })
-            });
-            const data = await response.json();
-            showLoading(false);
-            if (data.success) {
-                addMessage(data.message, 'bot', data.agent_used);
-            } else {
-                addMessage(`❌ Error: ${data.error || 'Something went wrong'}`, 'bot', 'error');
-            }
-        } catch (error) {
-            showLoading(false);
-            addMessage(`❌ Connection error: ${error.message}`, 'bot', 'error');
-        }
-    }
-
-    function addMessage(text, sender, agentType = '') {
-        const messagesContainer = document.getElementById('chatMessages');
-        const messageDiv = document.createElement('div');
-        messageDiv.className = `message ${sender}`;
-        const agentIcons = { 'academic': '📚 Academic Agent', 'drug_info': '💊 Drug Info Agent', 'quiz_generation': '❓ Quiz Master' };
-        const agentBadge = sender === 'bot' ? `<div class="agent-badge">${agentIcons[agentType] || '🤖 AI Assistant'}</div>` : '';
-        const formattedText = marked.parse(text || 'Sorry, I received an empty response.');
-        messageDiv.innerHTML = `<div class="message-bubble">${agentBadge}${formattedText}</div>`;
-        messagesContainer.appendChild(messageDiv);
-        messagesContainer.scrollTop = messagesContainer.scrollHeight;
-    }
-
-    function showLoading(show) {
-        document.getElementById('sendBtn').disabled = show;
-        const existingLoading = document.getElementById('loading-indicator');
-        if (existingLoading) existingLoading.remove();
-        
-        if (show) {
-            const messagesContainer = document.getElementById('chatMessages');
-            const loadingDiv = document.createElement('div');
-            loadingDiv.className = 'message bot';
-            loadingDiv.id = 'loading-indicator';
-            loadingDiv.innerHTML = `<div class="message-bubble"><div class="typing-indicator"><span></span><span></span><span></span></div></div>`;
-            messagesContainer.appendChild(loadingDiv);
-            messagesContainer.scrollTop = messagesContainer.scrollHeight;
-        }
-    }
-
-    function handleKeyPress(event) {
-        if (event.key === 'Enter' && !event.shiftKey) {
-            event.preventDefault();
-            sendMessage();
-        }
-    }
-    
-    function populateInput(templateText) {
-        const input = document.getElementById('messageInput');
-        input.value = templateText;
-        input.focus();
-    }
-    
-    document.addEventListener('DOMContentLoaded', () => {
-         document.getElementById('messageInput').focus();
-    });
-</script>
-        // Global variables
-        {% comment %} let isProcessing = false;
-
-        // In templates/index.html, inside the <script> tag
-
-        // --- File Management Functions ---
-
-        async function uploadFile() {
-            const fileInput = document.getElementById('fileInput');
-            const file = fileInput.files[0];
-            if (!file) {
-                addMessage('Please select a file to upload first.', 'bot', 'error');
-                return;
-            }
-
-            const formData = new FormData();
-            formData.append('file', file);
-
-            showLoading(true);
-            isProcessing = true;
-
-            try {
-                const response = await fetch('/upload', {
-                    method: 'POST',
-                    body: formData,
-                });
-                const data = await response.json();
-                if (data.success) {
-                    addMessage(`✅ ${data.message}`, 'bot', 'academic');
-                    updateFileList(data.files);
-                } else {
-                    addMessage(`❌ Upload Error: ${data.error}`, 'bot', 'error');
-                }
-            } catch (error) {
-                addMessage(`❌ Connection Error: ${error.message}`, 'bot', 'error');
-            } finally {
-                showLoading(false);
-                isProcessing = false;
-                fileInput.value = ''; // Clear the file input
-            }
-        }
-
-        function updateFileList(files = []) {
-            const fileListDiv = document.getElementById('fileList');
-            if (files.length > 0) {
-                let fileLinks = files.map(f => `<span>${f.original_name}</span>`).join(', ');
-                fileListDiv.innerHTML = `<div style="font-size: 0.9em; margin-top: 10px;"><strong>Active Files:</strong> ${fileLinks} <button onclick="clearFiles()" style="margin-left: 10px; background: #800000; color: white; border: none; border-radius: 5px; cursor: pointer; padding: 2px 8px;">Clear All</button></div>`;
-            } else {
-                fileListDiv.innerHTML = '';
-            }
-        }
-
-        async function clearFiles() {
-            showLoading(true);
-            isProcessing = true;
-            try {
-                const response = await fetch('/clear_files', { method: 'POST' });
-                const data = await response.json();
-                if (data.success) {
-                    addMessage('🧹 All uploaded files and sessions have been cleared.', 'bot', 'academic');
-                    updateFileList([]);
-                } else {
-                    addMessage(`❌ Error: ${data.error}`, 'bot', 'error');
-                }
-            } catch (error) {
-                addMessage(`❌ Connection Error: ${error.message}`, 'bot', 'error');
-            } finally {
-                showLoading(false);
-                isProcessing = false;
-            }
-        }
-
-        // Update the file list on page load
-        document.addEventListener('DOMContentLoaded', function() {
-            fetch('/files').then(res => res.json()).then(data => {
-                updateFileList(data.files);
-            });
-        });
-        // Send message function
         async function sendMessage() {
             const input = document.getElementById('messageInput');
             const message = input.value.trim();
-            
             if (!message || isProcessing) return;
-            
-            // Add user message to chat
+
             addMessage(message, 'user');
             input.value = '';
-            
-            // Show loading
             showLoading(true);
-            isProcessing = true;
-            
+
             try {
                 const response = await fetch('/chat', {
                     method: 'POST',
-                    headers: {
-                        'Content-Type': 'application/json',
-                    },
+                    headers: { 'Content-Type': 'application/json' },
                     body: JSON.stringify({ query: message })
                 });
-                
                 const data = await response.json();
-                
+                showLoading(false);
                 if (data.success) {
                     addMessage(data.message, 'bot', data.agent_used);
                 } else {
                     addMessage(`❌ Error: ${data.error || 'Something went wrong'}`, 'bot', 'error');
                 }
-                
             } catch (error) {
-                addMessage(`❌ Connection error: ${error.message}`, 'bot', 'error');
-            } finally {
                 showLoading(false);
-                isProcessing = false;
+                addMessage(`❌ Connection error: ${error.message}`, 'bot', 'error');
             }
         }
 
-        // Add message to chat
         function addMessage(text, sender, agentType = '') {
-        const messagesContainer = document.getElementById('chatMessages');
-        const messageDiv = document.createElement('div');
-        messageDiv.className = `message ${sender}`;
-        
-        let agentBadge = '';
-        if (sender === 'bot' && agentType) {
-            const agentIcons = {
-                'academic': '📚 Academic Agent',
-                'drug_info': '💊 Drug Info Agent',
-                'quiz_generation': '❓ Quiz Master',
-                'mnemonic_creation': '🧠 Memory Master',
-                'viva_practice': '🗣️ Viva Coach',
-                'error': '⚠️ System'
-            };
-            agentBadge = `<div class="agent-badge">${agentIcons[agentType] || '🤖 AI Assistant'}</div>`;
-        }
-        
-        // THE FIX: Use marked.parse() to convert markdown to HTML
-        // instead of a simple replace.
-        const formattedText = marked.parse(text || 'Sorry, I received an empty response.');
-
-        messageDiv.innerHTML = `
-            <div class="message-bubble">
-                ${agentBadge}
-                ${formattedText}
-            </div>
-        `;
-        
-        messagesContainer.appendChild(messageDiv);
-        messagesContainer.scrollTop = messagesContainer.scrollHeight;
+            const messagesContainer = document.getElementById('chatMessages');
+            const messageDiv = document.createElement('div');
+            messageDiv.className = `message ${sender}`;
+            const agentIcons = { 'academic': '📚 Academic Agent', 'drug_info': '💊 Drug Info Agent', 'quiz_generation': '❓ Quiz Master' };
+            const agentBadge = sender === 'bot' ? `<div class="agent-badge">${agentIcons[agentType] || '🤖 AI Assistant'}</div>` : '';
+            const formattedText = marked.parse(text || 'Sorry, I received an empty response.');
+            messageDiv.innerHTML = `<div class="message-bubble">${agentBadge}${formattedText}</div>`;
+            messagesContainer.appendChild(messageDiv);
+            messagesContainer.scrollTop = messagesContainer.scrollHeight;
         }
 
-        // Show/hide loading
         function showLoading(show) {
-            const loading = document.getElementById('loading');
-            const sendBtn = document.getElementById('sendBtn');
+            document.getElementById('sendBtn').disabled = show;
+            const existingLoading = document.getElementById('loading-indicator');
+            if (existingLoading) existingLoading.remove();
             
-            loading.classList.toggle('show', show);
-            sendBtn.disabled = show;
+            if (show) {
+                const messagesContainer = document.getElementById('chatMessages');
+                const loadingDiv = document.createElement('div');
+                loadingDiv.className = 'message bot';
+                loadingDiv.id = 'loading-indicator';
+                loadingDiv.innerHTML = `<div class="message-bubble"><div class="typing-indicator"><span></span><span></span><span></span></div></div>`;
+                messagesContainer.appendChild(loadingDiv);
+                messagesContainer.scrollTop = messagesContainer.scrollHeight;
+            }
         }
 
-        // Handle Enter key press
         function handleKeyPress(event) {
             if (event.key === 'Enter' && !event.shiftKey) {
                 event.preventDefault();
                 sendMessage();
             }
         }
-
-        // Quick message function
+        
         function populateInput(templateText) {
             const input = document.getElementById('messageInput');
             input.value = templateText;
-            input.focus(); // This handily puts the cursor in the text box for you!
-        }
-
-        // Get new quote function
-        async function getNewQuote() {
-            try {
-                const response = await fetch('/quote');
-                const data = await response.json();
-                document.getElementById('quoteContainer').innerHTML = `📿 ${data.quote}`;
-            } catch (error) {
-                console.error('Failed to fetch new quote:', error);
-            }
+            input.focus();
         }
-
-        // Initialize app
-        document.addEventListener('DOMContentLoaded', function() {
-            // Focus on input
-            document.getElementById('messageInput').focus();
-            
-            // Get new quote every 5 minutes
-            setInterval(getNewQuote, 5 * 60 * 1000);
-        }); {% endcomment %}
+        
+        document.addEventListener('DOMContentLoaded', () => {
+             document.getElementById('messageInput').focus();
+        });
+    </script>
     
 </body>
 </html>
@@ -871,5 +676,203 @@
              setInterval(getNewQuote, 5 * 60 * 1000); // Update quote every 5 mins
         });
     </script>
+    old
+    <script>
+        // Global variables
+        let isProcessing = false;
+
+        // In templates/index.html, inside the <script> tag
+
+        // --- File Management Functions ---
+
+        async function uploadFile() {
+            const fileInput = document.getElementById('fileInput');
+            const file = fileInput.files[0];
+            if (!file) {
+                addMessage('Please select a file to upload first.', 'bot', 'error');
+                return;
+            }
+
+            const formData = new FormData();
+            formData.append('file', file);
+
+            showLoading(true);
+            isProcessing = true;
+
+            try {
+                const response = await fetch('/upload', {
+                    method: 'POST',
+                    body: formData,
+                });
+                const data = await response.json();
+                if (data.success) {
+                    addMessage(`✅ ${data.message}`, 'bot', 'academic');
+                    updateFileList(data.files);
+                } else {
+                    addMessage(`❌ Upload Error: ${data.error}`, 'bot', 'error');
+                }
+            } catch (error) {
+                addMessage(`❌ Connection Error: ${error.message}`, 'bot', 'error');
+            } finally {
+                showLoading(false);
+                isProcessing = false;
+                fileInput.value = ''; // Clear the file input
+            }
+        }
+
+        function updateFileList(files = []) {
+            const fileListDiv = document.getElementById('fileList');
+            if (files.length > 0) {
+                let fileLinks = files.map(f => `<span>${f.original_name}</span>`).join(', ');
+                fileListDiv.innerHTML = `<div style="font-size: 0.9em; margin-top: 10px;"><strong>Active Files:</strong> ${fileLinks} <button onclick="clearFiles()" style="margin-left: 10px; background: #800000; color: white; border: none; border-radius: 5px; cursor: pointer; padding: 2px 8px;">Clear All</button></div>`;
+            } else {
+                fileListDiv.innerHTML = '';
+            }
+        }
+
+        async function clearFiles() {
+            showLoading(true);
+            isProcessing = true;
+            try {
+                const response = await fetch('/clear_files', { method: 'POST' });
+                const data = await response.json();
+                if (data.success) {
+                    addMessage('🧹 All uploaded files and sessions have been cleared.', 'bot', 'academic');
+                    updateFileList([]);
+                } else {
+                    addMessage(`❌ Error: ${data.error}`, 'bot', 'error');
+                }
+            } catch (error) {
+                addMessage(`❌ Connection Error: ${error.message}`, 'bot', 'error');
+            } finally {
+                showLoading(false);
+                isProcessing = false;
+            }
+        }
+
+        // Update the file list on page load
+        document.addEventListener('DOMContentLoaded', function() {
+            fetch('/files').then(res => res.json()).then(data => {
+                updateFileList(data.files);
+            });
+        });
+        // Send message function
+        async function sendMessage() {
+            const input = document.getElementById('messageInput');
+            const message = input.value.trim();
+            
+            if (!message || isProcessing) return;
+            
+            // Add user message to chat
+            addMessage(message, 'user');
+            input.value = '';
+            
+            // Show loading
+            showLoading(true);
+            isProcessing = true;
+            
+            try {
+                const response = await fetch('/chat', {
+                    method: 'POST',
+                    headers: {
+                        'Content-Type': 'application/json',
+                    },
+                    body: JSON.stringify({ query: message })
+                });
+                
+                const data = await response.json();
+                
+                if (data.success) {
+                    addMessage(data.message, 'bot', data.agent_used);
+                } else {
+                    addMessage(`❌ Error: ${data.error || 'Something went wrong'}`, 'bot', 'error');
+                }
+                
+            } catch (error) {
+                addMessage(`❌ Connection error: ${error.message}`, 'bot', 'error');
+            } finally {
+                showLoading(false);
+                isProcessing = false;
+            }
+        }
+
+        // Add message to chat
+        function addMessage(text, sender, agentType = '') {
+        const messagesContainer = document.getElementById('chatMessages');
+        const messageDiv = document.createElement('div');
+        messageDiv.className = `message ${sender}`;
+        
+        let agentBadge = '';
+        if (sender === 'bot' && agentType) {
+            const agentIcons = {
+                'academic': '📚 Academic Agent',
+                'drug_info': '💊 Drug Info Agent',
+                'quiz_generation': '❓ Quiz Master',
+                'mnemonic_creation': '🧠 Memory Master',
+                'viva_practice': '🗣️ Viva Coach',
+                'error': '⚠️ System'
+            };
+            agentBadge = `<div class="agent-badge">${agentIcons[agentType] || '🤖 AI Assistant'}</div>`;
+        }
+        
+        // THE FIX: Use marked.parse() to convert markdown to HTML
+        // instead of a simple replace.
+        const formattedText = marked.parse(text || 'Sorry, I received an empty response.');
+
+        messageDiv.innerHTML = `
+            <div class="message-bubble">
+                ${agentBadge}
+                ${formattedText}
+            </div>
+        `;
+        
+        messagesContainer.appendChild(messageDiv);
+        messagesContainer.scrollTop = messagesContainer.scrollHeight;
+        }
+
+        // Show/hide loading
+        function showLoading(show) {
+            const loading = document.getElementById('loading');
+            const sendBtn = document.getElementById('sendBtn');
+            
+            loading.classList.toggle('show', show);
+            sendBtn.disabled = show;
+        }
+
+        // Handle Enter key press
+        function handleKeyPress(event) {
+            if (event.key === 'Enter' && !event.shiftKey) {
+                event.preventDefault();
+                sendMessage();
+            }
+        }
+
+        // Quick message function
+        function populateInput(templateText) {
+            const input = document.getElementById('messageInput');
+            input.value = templateText;
+            input.focus(); // This handily puts the cursor in the text box for you!
+        }
+
+        // Get new quote function
+        async function getNewQuote() {
+            try {
+                const response = await fetch('/quote');
+                const data = await response.json();
+                document.getElementById('quoteContainer').innerHTML = `📿 ${data.quote}`;
+            } catch (error) {
+                console.error('Failed to fetch new quote:', error);
+            }
+        }
+
+        // Initialize app
+        document.addEventListener('DOMContentLoaded', function() {
+            // Focus on input
+            document.getElementById('messageInput').focus();
+            
+            // Get new quote every 5 minutes
+            setInterval(getNewQuote, 5 * 60 * 1000);
+        });
+    </script> 
 </body>
 </html>-->