/** * Search V2 - Spotlight-style instant search * Supports both Quick Search (keyword matching) and AI Search (semantic + summary) */ let searchMode = 'quick'; // 'quick' or 'ai' let searchDebounceTimer = null; let selectedResultIndex = -1; let currentResults = []; // Initialize search functionality document.addEventListener('DOMContentLoaded', () => { const searchInput = document.getElementById('main-search-input'); if (!searchInput) return; // Input event for instant search searchInput.addEventListener('input', handleSearchInput); // Keyboard navigation searchInput.addEventListener('keydown', handleSearchKeydown); // Escape to close document.addEventListener('keydown', (e) => { if (e.key === 'Escape') { closeAllPanels(); } }); }); // Handle search input with debounce function handleSearchInput(e) { const query = e.target.value.trim(); // Clear previous timer clearTimeout(searchDebounceTimer); if (!query) { hideResults(); return; } // Debounce for quick search (instant feel) const debounceDelay = searchMode === 'quick' ? 150 : 300; searchDebounceTimer = setTimeout(() => { performInstantSearch(query); }, debounceDelay); } // Handle keyboard navigation in search results function handleSearchKeydown(e) { const resultsVisible = document.getElementById('instant-results').style.display !== 'none'; if (!resultsVisible || currentResults.length === 0) { // Enter key triggers AI search if no results visible if (e.key === 'Enter' && searchMode === 'quick') { setSearchMode('ai'); performInstantSearch(e.target.value.trim()); } return; } switch(e.key) { case 'ArrowDown': e.preventDefault(); selectedResultIndex = Math.min(selectedResultIndex + 1, currentResults.length - 1); updateResultSelection(); break; case 'ArrowUp': e.preventDefault(); selectedResultIndex = Math.max(selectedResultIndex - 1, -1); updateResultSelection(); break; case 'Enter': e.preventDefault(); if (selectedResultIndex >= 0) { openResultPreview(currentResults[selectedResultIndex]); } break; case ' ': if (selectedResultIndex >= 0) { e.preventDefault(); openQuickPreview(currentResults[selectedResultIndex]); } break; } } // Perform instant search async function performInstantSearch(query) { if (!query) return; showResults(); updateSearchModeIndicator(); try { const endpoint = searchMode === 'quick' ? `/api/search?q=${encodeURIComponent(query)}&mode=quick` : `/api/search?q=${encodeURIComponent(query)}&mode=ai`; const response = await apiRequest(endpoint); if (!response || !response.ok) { throw new Error('Search failed'); } const data = await response.json(); currentResults = data.results || []; selectedResultIndex = -1; displayResults(currentResults, query); } catch (error) { console.error('Search error:', error); showErrorResults(); } } // Display search results function displayResults(results, query) { const resultsListEl = document.getElementById('results-list'); const resultsCountEl = document.querySelector('.results-count'); if (!resultsListEl || !resultsCountEl) return; // Update count resultsCountEl.textContent = `${results.length} result${results.length !== 1 ? 's' : ''}`; // Clear previous results resultsListEl.innerHTML = ''; if (results.length === 0) { resultsListEl.innerHTML = `

No results found

`; return; } // Render results results.forEach((result, index) => { const resultEl = createResultElement(result, query, index); resultsListEl.appendChild(resultEl); }); } // Create result element function createResultElement(result, query, index) { const div = document.createElement('div'); div.className = 'result-item'; div.dataset.index = index; const icon = getFileIcon(result.file_type); const location = formatResultLocation(result); const preview = highlightText(result.content || '', query); div.innerHTML = `

${icon}

${escapeHtml(result.file_name)}

${location ? `

${location}

` : ''}

${preview}

`; // Click handler div.addEventListener('click', () => { selectedResultIndex = index; openResultPreview(result); }); // Hover handler div.addEventListener('mouseenter', () => { selectedResultIndex = index; updateResultSelection(); }); return div; } // Update visual selection of results function updateResultSelection() { const resultItems = document.querySelectorAll('.result-item'); resultItems.forEach((item, index) => { if (index === selectedResultIndex) { item.classList.add('selected'); item.scrollIntoView({ block: 'nearest', behavior: 'smooth' }); } else { item.classList.remove('selected'); } }); } // Format result location function formatResultLocation(result) { if (!result.locator) return ''; const { file_type, locator } = result; switch(file_type) { case 'text': return locator.line ? `Line ${locator.line}` : ''; case 'pdf': return locator.page ? `Page ${locator.page}` : ''; case 'audio': case 'video': return locator.start !== undefined ? formatTime(locator.start) : ''; default: return ''; } } // Get file icon function getFileIcon(fileType) { const icons = { 'text': '📄', 'pdf': '📕', 'image': '🖼️', 'audio': '🎵', 'video': '🎬' }; return icons[fileType] || '📄'; } // Highlight query in text function highlightText(text, query) { if (!text || !query) return escapeHtml(text); const escaped = escapeHtml(text); const safeQuery = escapeRegExp(query); const regex = new RegExp(`(${safeQuery})`, 'gi'); return escaped.replace(regex, '$1'); } // Escape regex special characters function escapeRegExp(string) { return string.replace(/[.*+?^${}()|[\]\\]/g, '\\$&'); } // Format time (seconds to MM:SS) function formatTime(seconds) { const mins = Math.floor(seconds / 60); const secs = Math.floor(seconds % 60); return `${mins}:${secs.toString().padStart(2, '0')}`; } // Show/hide results function showResults() { const resultsEl = document.getElementById('instant-results'); if (resultsEl) resultsEl.style.display = 'block'; } function hideResults() { const resultsEl = document.getElementById('instant-results'); if (resultsEl) resultsEl.style.display = 'none'; currentResults = []; selectedResultIndex = -1; } // Update search mode indicator function updateSearchModeIndicator() { const indicator = document.querySelector('.search-mode-indicator'); if (indicator) { indicator.textContent = searchMode === 'quick' ? 'Quick Search' : 'AI Search'; } } // Show error results function showErrorResults() { const resultsListEl = document.getElementById('results-list'); if (resultsListEl) { resultsListEl.innerHTML = `

Search failed. Please try again.

`; } } // Set search mode function setSearchMode(mode) { searchMode = mode; // Update button states document.querySelectorAll('.mode-btn').forEach(btn => { if (btn.dataset.mode === mode) { btn.classList.add('active'); } else { btn.classList.remove('active'); } }); // Re-search if there's a query const searchInput = document.getElementById('main-search-input'); const query = searchInput?.value.trim(); if (query) { performInstantSearch(query); } } // Open result in quick preview sidebar function openQuickPreview(result) { const sidebar = document.getElementById('preview-sidebar'); const titleEl = document.getElementById('preview-title'); const contentEl = document.getElementById('preview-content'); if (!sidebar || !titleEl || !contentEl) return; // Set title titleEl.textContent = result.file_name; // Load preview content loadPreviewContent(result, contentEl); // Show sidebar sidebar.classList.add('open'); sidebar.style.display = 'block'; } // Open result in full preview function openResultPreview(result) { openQuickPreview(result); } // Load preview content based on file type async function loadPreviewContent(result, containerEl) { containerEl.innerHTML = '

Loading preview...

'; try { const response = await apiRequest(`/api/files/${result.file_id}/content`); if (!response || !response.ok) throw new Error('Failed to load content'); const data = await response.json(); switch(result.file_type) { case 'text': renderTextPreview(data, result, containerEl); break; case 'pdf': renderPDFPreview(data, result, containerEl); break; case 'image': renderImagePreview(data, result, containerEl); break; case 'audio': renderAudioPreview(data, result, containerEl); break; case 'video': renderVideoPreview(data, result, containerEl); break; default: containerEl.innerHTML = '

Preview not available

'; } } catch (error) { console.error('Preview error:', error); containerEl.innerHTML = '

Failed to load preview

'; } } // Render text preview function renderTextPreview(data, result, containerEl) { const content = data.content || ''; const highlightedContent = result.query ? highlightText(content, result.query) : escapeHtml(content); containerEl.innerHTML = `

${highlightedContent}

`; // Scroll to highlighted text if present if (result.locator && result.locator.line) { // Implement line scrolling if needed } } // Render PDF preview function renderPDFPreview(data, result, containerEl) { // For now, show text content. Later can add PDF.js integration const content = data.text || data.content || ''; containerEl.innerHTML = `

${result.query ? highlightText(content, result.query) : escapeHtml(content)}

`; } // Render image preview function renderImagePreview(data, result, containerEl) { const imageUrl = data.url || `/api/files/${result.file_id}/download`; containerEl.innerHTML = `

$${escapeHtml(result.file_name)}$

`; } // Render audio preview function renderAudioPreview(data, result, containerEl) { const audioUrl = data.url || `/api/files/${result.file_id}/download`; const startTime = result.locator?.start || 0; containerEl.innerHTML = `

`; // Set start time if available if (startTime > 0) { const audioEl = document.getElementById('preview-audio'); if (audioEl) { audioEl.currentTime = startTime; } } } // Render video preview function renderVideoPreview(data, result, containerEl) { const videoUrl = data.url || `/api/files/${result.file_id}/download`; const startTime = result.locator?.start || 0; containerEl.innerHTML = `

`; // Set start time if available if (startTime > 0) { const videoEl = document.getElementById('preview-video'); if (videoEl) { videoEl.currentTime = startTime; } } } // Close preview function closePreview() { const sidebar = document.getElementById('preview-sidebar'); if (sidebar) { sidebar.classList.remove('open'); setTimeout(() => { sidebar.style.display = 'none'; }, 300); } } // Open full preview modal function openFullPreview() { // Copy content from sidebar to modal const sidebarContent = document.getElementById('preview-content').innerHTML; const modalBody = document.getElementById('modal-preview-body'); const modalTitle = document.getElementById('modal-preview-title'); const sidebarTitle = document.getElementById('preview-title').textContent; if (modalBody && modalTitle) { modalTitle.textContent = sidebarTitle; modalBody.innerHTML = sidebarContent; } // Show modal const modal = document.getElementById('preview-modal'); if (modal) { modal.style.display = 'flex'; } } // Close full preview modal function closeFullPreview() { const modal = document.getElementById('preview-modal'); if (modal) { modal.style.display = 'none'; } } // Export functions window.setSearchMode = setSearchMode; window.closePreview = closePreview; window.openFullPreview = openFullPreview; window.closeFullPreview = closeFullPreview;

Get Started

Core Concepts

API Reference

API Endpoints

Response