local-deep-research 0.1.26__py3-none-any.whl → 0.2.0__py3-none-any.whl

local_deep_research/web/static/js/components/results.js

@@ -0,0 +1,766 @@
+/**
+ * Results Component
+ * Handles the display of research results
+ */
+(function() {
+    // DOM Elements
+    let resultsContainer = null;
+    let exportBtn = null;
+    let pdfBtn = null;
+    let researchId = null;
+    let researchData = null;
+    
+    /**
+     * Initialize the results component
+     */
+    function initializeResults() {
+        // Get DOM elements
+        resultsContainer = document.getElementById('results-content');
+        exportBtn = document.getElementById('export-markdown-btn');
+        pdfBtn = document.getElementById('download-pdf-btn');
+        
+        if (!resultsContainer) {
+            console.error('Results container not found');
+            return;
+        }
+        
+        console.log('Results component initialized');
+        
+        // Get research ID from URL
+        researchId = getResearchIdFromUrl();
+        
+        if (!researchId) {
+            showError('Research ID not found in URL');
+            return;
+        }
+        
+        // Set up event listeners
+        setupEventListeners();
+        
+        // Load research results
+        loadResearchResults();
+        
+        // Note: Log panel is now automatically initialized by logpanel.js
+        // No need to manually initialize it here
+    }
+    
+    /**
+     * Set up event listeners
+     */
+    function setupEventListeners() {
+        // Export button
+        if (exportBtn) {
+            exportBtn.addEventListener('click', handleExport);
+        }
+        
+        // PDF button
+        if (pdfBtn) {
+            pdfBtn.addEventListener('click', handlePdfExport);
+        }
+
+        // Back to history button
+        const backBtn = document.getElementById('back-to-history');
+        if (backBtn) {
+            backBtn.addEventListener('click', () => {
+                window.location.href = '/research/history';
+            });
+        }
+    }
+    
+    /**
+     * Get research ID from URL
+     * @returns {string|null} Research ID
+     */
+    function getResearchIdFromUrl() {
+        const path = window.location.pathname;
+        const match = path.match(/\/research\/results\/(\d+)/);
+        return match ? match[1] : null;
+    }
+    
+    /**
+     * Load research results from API
+     */
+    async function loadResearchResults() {
+        try {
+            // Show loading state
+            resultsContainer.innerHTML = '<div class="text-center my-5"><i class="fas fa-spinner fa-pulse"></i><p class="mt-3">Loading research results...</p></div>';
+            
+            // Fetch result from API
+            const response = await fetch(`/research/api/report/${researchId}`);
+            
+            if (!response.ok) {
+                throw new Error(`HTTP error ${response.status}`);
+            }
+            
+            const responseData = await response.json();
+            console.log('Original API response:', responseData);
+            
+            // Store data for export
+            researchData = responseData;
+            
+            // Check if we have data to display
+            if (!responseData) {
+                throw new Error('No data received from server');
+            }
+            
+            // Use the API metadata directly
+            if (responseData.metadata && typeof responseData.metadata === 'object') {
+                console.log('Using metadata directly from API response:', responseData.metadata);
+                populateMetadataFromApiResponse(responseData);
+            } else {
+                // Fallback to content extraction if no metadata in response
+                populateMetadata(responseData);
+            }
+            
+            // Render the content
+            if (responseData.content && typeof responseData.content === 'string') {
+                console.log('Rendering content from API response');
+                renderResults(responseData.content);
+            } else {
+                // Try to find content in other response formats
+                console.log('No direct content found, trying to find content in response');
+                findAndRenderContent(responseData);
+            }
+            
+            // Enable export buttons
+            if (exportBtn) exportBtn.disabled = false;
+            if (pdfBtn) pdfBtn.disabled = false;
+            
+        } catch (error) {
+            console.error('Error loading research results:', error);
+            showError(`Error loading research results: ${error.message}`);
+            
+            // Disable export buttons
+            if (exportBtn) exportBtn.disabled = true;
+            if (pdfBtn) pdfBtn.disabled = true;
+        }
+    }
+    
+    /**
+     * Populate metadata directly from API response metadata
+     * @param {Object} data - API response with metadata
+     */
+    function populateMetadataFromApiResponse(data) {
+        const metadata = data.metadata || {};
+        console.log('Using API response metadata:', metadata);
+        
+        // Query field
+        const queryElement = document.getElementById('result-query');
+        if (queryElement) {
+            // Use query from metadata or content title
+            const query = metadata.query || metadata.title || data.query || 'Untitled Research';
+            console.log('Setting query to:', query);
+            queryElement.textContent = query;
+        }
+        
+        // Generated date field
+        const dateElement = document.getElementById('result-date');
+        if (dateElement) {
+            let dateStr = 'Unknown date';
+            
+            // Try multiple sources for the timestamp - first from the API response directly, then from metadata
+            const timestamp = data.created_at || data.timestamp || data.date || 
+                            metadata.created_at || metadata.timestamp || metadata.date;
+            
+            console.log('Found timestamp:', timestamp);
+            
+            if (timestamp) {
+                if (window.formatting && typeof window.formatting.formatDate === 'function') {
+                    dateStr = window.formatting.formatDate(timestamp);
+                    console.log('Formatting timestamp with formatter:', timestamp, '→', dateStr);
+                } else {
+                    try {
+                        const date = new Date(timestamp);
+                        dateStr = date.toLocaleString();
+                        console.log('Formatting timestamp with toLocaleString:', timestamp, '→', dateStr);
+                    } catch (e) {
+                        console.error('Error parsing date:', e);
+                    }
+                }
+                
+                // Add duration if available - format as "Xm Ys" for values over 60 seconds
+                if (metadata.duration || metadata.duration_seconds || data.duration_seconds) {
+                    const durationSeconds = parseInt(metadata.duration || metadata.duration_seconds || data.duration_seconds, 10);
+                    
+                    if (!isNaN(durationSeconds)) {
+                        let durationStr;
+                        if (durationSeconds < 60) {
+                            durationStr = `${durationSeconds}s`;
+                        } else {
+                            const minutes = Math.floor(durationSeconds / 60);
+                            const seconds = durationSeconds % 60;
+                            durationStr = `${minutes}m ${seconds}s`;
+                        }
+                        dateStr += ` (${durationStr})`;
+                    }
+                }
+            }
+            
+            console.log('Setting date to:', dateStr);
+            dateElement.textContent = dateStr;
+        }
+        
+        // Mode field
+        const modeElement = document.getElementById('result-mode');
+        if (modeElement) {
+            // Get mode from metadata or main response
+            let mode = metadata.mode || metadata.research_mode || metadata.type || 
+                      data.mode || data.research_mode || data.type;
+            
+            // Detect if this is a detailed report based on content structure
+            if (!mode && data.content) {
+                if (data.content.toLowerCase().includes('table of contents') || 
+                    data.content.match(/^#.*\n+##.*\n+###/m)) {
+                    mode = 'detailed';
+                } else {
+                    mode = 'quick';
+                }
+            }
+            
+            // Format mode using available formatter
+            if (window.formatting && typeof window.formatting.formatMode === 'function') {
+                mode = window.formatting.formatMode(mode);
+                console.log('Formatted mode:', mode);
+            }
+            
+            console.log('Setting mode to:', mode || 'Quick');
+            modeElement.textContent = mode || 'Quick';
+        }
+    }
+    
+    /**
+     * Find and render content from various response formats
+     * @param {Object} data - Research data to extract content from
+     */
+    function findAndRenderContent(data) {
+        if (data.content && typeof data.content === 'string') {
+            // Direct content property (newer format)
+            console.log('Rendering from data.content');
+            renderResults(data.content);
+        } else if (data.research && data.research.content) {
+            // Nested content in research object (older format)
+            console.log('Rendering from data.research.content');
+            renderResults(data.research.content);
+        } else if (data.report && typeof data.report === 'string') {
+            // Report format
+            console.log('Rendering from data.report');
+            renderResults(data.report);
+        } else if (data.results && data.results.content) {
+            // Results with content field
+            console.log('Rendering from data.results.content');
+            renderResults(data.results.content);
+        } else if (data.results && typeof data.results === 'string') {
+            // Results as direct string
+            console.log('Rendering from data.results string');
+            renderResults(data.results);
+        } else if (typeof data === 'string') {
+            // Plain string format
+            console.log('Rendering from string data');
+            renderResults(data);
+        } else {
+            // Look for any property that might contain the content
+            const contentProps = ['markdown', 'text', 'summary', 'output', 'research_output'];
+            let foundContent = false;
+            
+            for (const prop of contentProps) {
+                if (data[prop] && typeof data[prop] === 'string') {
+                    console.log(`Rendering from data.${prop}`);
+                    renderResults(data[prop]);
+                    foundContent = true;
+                    break;
+                }
+            }
+            
+            if (!foundContent) {
+                // Last resort: try to render the entire data object
+                console.log('No clear content found, rendering entire data object');
+                renderResults(data);
+            }
+        }
+    }
+    
+    /**
+     * Populate metadata fields with information from the research data
+     * @param {Object} data - Research data with metadata
+     */
+    function populateMetadata(data) {
+        // Debug the data structure
+        console.log('API response data:', data);
+        console.log('Data type:', typeof data);
+        console.log('Available top-level keys:', Object.keys(data));
+        
+        // Direct extraction from content
+        if (data.content && typeof data.content === 'string') {
+            console.log('Attempting to extract metadata from content');
+            
+            // Extract the query from content first line or header
+            // Avoid matching "Table of Contents" as query
+            const queryMatch = data.content.match(/^#\s*([^\n]+)/m) || // First heading
+                             data.content.match(/Query:\s*([^\n]+)/i) || // Explicit query label
+                             data.content.match(/Question:\s*([^\n]+)/i) || // Question label
+                             data.content.match(/^([^\n#]+)(?=\n)/); // First line if not starting with #
+                             
+            if (queryMatch && queryMatch[1] && !queryMatch[1].toLowerCase().includes('table of contents')) {
+                const queryElement = document.getElementById('result-query');
+                if (queryElement) {
+                    const extractedQuery = queryMatch[1].trim();
+                    console.log('Extracted query from content:', extractedQuery);
+                    queryElement.textContent = extractedQuery;
+                }
+            } else {
+                // Try to find the second heading if first was "Table of Contents"
+                const secondHeadingMatch = data.content.match(/^#\s*([^\n]+)[\s\S]*?^##\s*([^\n]+)/m);
+                if (secondHeadingMatch && secondHeadingMatch[2]) {
+                    const queryElement = document.getElementById('result-query');
+                    if (queryElement) {
+                        const extractedQuery = secondHeadingMatch[2].trim();
+                        console.log('Extracted query from second heading:', extractedQuery);
+                        queryElement.textContent = extractedQuery;
+                    }
+                }
+            }
+            
+            // Extract generated date/time - Try multiple formats
+            const dateMatch = data.content.match(/Generated at:\s*([^\n]+)/i) || 
+                           data.content.match(/Date:\s*([^\n]+)/i) ||
+                           data.content.match(/Generated:\s*([^\n]+)/i) ||
+                           data.content.match(/Created:\s*([^\n]+)/i);
+                           
+            if (dateMatch && dateMatch[1]) {
+                const dateElement = document.getElementById('result-date');
+                if (dateElement) {
+                    const extractedDate = dateMatch[1].trim();
+                    console.log('Extracted date from content:', extractedDate);
+                    
+                    // Format the date using the available formatter
+                    let formattedDate = extractedDate;
+                    if (window.formatting && typeof window.formatting.formatDate === 'function') {
+                        formattedDate = window.formatting.formatDate(extractedDate);
+                        console.log('Date formatted using formatter:', formattedDate);
+                    }
+                    
+                    dateElement.textContent = formattedDate || new Date().toLocaleString();
+                }
+            }
+            
+            // Extract mode
+            const modeMatch = data.content.match(/Mode:\s*([^\n]+)/i) || 
+                            data.content.match(/Research type:\s*([^\n]+)/i);
+            
+            if (modeMatch && modeMatch[1]) {
+                const modeElement = document.getElementById('result-mode');
+                if (modeElement) {
+                    const extractedMode = modeMatch[1].trim();
+                    console.log('Extracted mode from content:', extractedMode);
+                    
+                    // Format mode using available formatter
+                    let formattedMode = extractedMode;
+                    if (window.formatting && typeof window.formatting.formatMode === 'function') {
+                        formattedMode = window.formatting.formatMode(extractedMode);
+                        console.log('Mode formatted using formatter:', formattedMode);
+                    }
+                    
+                    modeElement.textContent = formattedMode || 'Standard';
+                }
+            } else {
+                // Detect mode based on content structure and keywords
+                const modeElement = document.getElementById('result-mode');
+                if (modeElement) {
+                    if (data.content.toLowerCase().includes('table of contents') || 
+                        data.content.toLowerCase().includes('detailed report') ||
+                        data.content.match(/^#.*\n+##.*\n+###/m)) { // Has H1, H2, H3 structure
+                        modeElement.textContent = 'Detailed';
+                    } else if (data.content.toLowerCase().includes('quick research') || 
+                              data.content.toLowerCase().includes('summary')) {
+                        modeElement.textContent = 'Quick';
+                    } else {
+                        modeElement.textContent = 'Standard'; // Better default
+                    }
+                }
+            }
+            
+            return; // Exit early since we've handled extraction from content
+        }
+        
+        // Also check the metadata field which likely contains the actual metadata
+        const metadata = data.metadata || {};
+        console.log('Metadata object:', metadata);
+        if (metadata) {
+            console.log('Metadata keys:', Object.keys(metadata));
+        }
+        
+        // Extract research object if nested
+        const researchData = data.research || data;
+        
+        // Debug nested structure if exists
+        if (data.research) {
+            console.log('Nested research data:', data.research);
+            console.log('Research keys:', Object.keys(data.research));
+        }
+        
+        // Query field
+        const queryElement = document.getElementById('result-query');
+        if (queryElement) {
+            // Try different possible locations for query data
+            let query = 'Unknown query';
+            
+            if (metadata.query) {
+                query = metadata.query;
+            } else if (metadata.title) {
+                query = metadata.title;
+            } else if (researchData.query) {
+                query = researchData.query;
+            } else if (researchData.prompt) {
+                query = researchData.prompt;
+            } else if (researchData.title) {
+                query = researchData.title;
+            } else if (researchData.question) {
+                query = researchData.question;
+            } else if (researchData.input) {
+                query = researchData.input;
+            }
+            
+            console.log('Setting query to:', query);
+            queryElement.textContent = query;
+        }
+        
+        // Generated date field
+        const dateElement = document.getElementById('result-date');
+        if (dateElement) {
+            let dateStr = 'Unknown date';
+            let timestampField = null;
+            
+            // Try different possible date fields
+            if (metadata.created_at) {
+                timestampField = metadata.created_at;
+            } else if (metadata.timestamp) {
+                timestampField = metadata.timestamp;
+            } else if (metadata.date) {
+                timestampField = metadata.date;
+            } else if (researchData.timestamp) {
+                timestampField = researchData.timestamp;
+            } else if (researchData.created_at) {
+                timestampField = researchData.created_at;
+            } else if (researchData.date) {
+                timestampField = researchData.date;
+            } else if (researchData.time) {
+                timestampField = researchData.time;
+            }
+            
+            // Format the date using the available formatter
+            if (timestampField) {
+                if (window.formatting && typeof window.formatting.formatDate === 'function') {
+                    dateStr = window.formatting.formatDate(timestampField);
+                    console.log('Using formatter for timestamp:', timestampField, '→', dateStr);
+                } else {
+                    try {
+                        const date = new Date(timestampField);
+                        dateStr = date.toLocaleString();
+                        console.log('Using timestamp:', timestampField, '→', dateStr);
+                    } catch (e) {
+                        console.error('Error parsing date:', timestampField, e);
+                    }
+                }
+            }
+            
+            // Add duration if available
+            if (metadata.duration) {
+                dateStr += ` (${metadata.duration} seconds)`;
+            } else if (metadata.duration_seconds) {
+                dateStr += ` (${metadata.duration_seconds} seconds)`;
+            } else if (researchData.duration) {
+                dateStr += ` (${researchData.duration} seconds)`;
+            }
+            
+            console.log('Setting date to:', dateStr);
+            dateElement.textContent = dateStr;
+        }
+        
+        // Mode field
+        const modeElement = document.getElementById('result-mode');
+        if (modeElement) {
+            let mode = 'Quick'; // Default to Quick
+            
+            if (metadata.mode) {
+                mode = metadata.mode;
+            } else if (metadata.research_mode) {
+                mode = metadata.research_mode;
+            } else if (metadata.type) {
+                mode = metadata.type;
+            } else if (researchData.mode) {
+                mode = researchData.mode;
+            } else if (researchData.research_mode) {
+                mode = researchData.research_mode;
+            } else if (researchData.type) {
+                mode = researchData.type;
+            }
+            
+            // Format mode using available formatter
+            if (window.formatting && typeof window.formatting.formatMode === 'function') {
+                mode = window.formatting.formatMode(mode);
+            }
+            
+            console.log('Setting mode to:', mode);
+            modeElement.textContent = mode;
+        }
+    }
+    
+    /**
+     * Render research results in the container
+     * @param {Object|string} data - Research data to render
+     */
+    function renderResults(data) {
+        try {
+            // Clear container
+            resultsContainer.innerHTML = '';
+            
+            // Determine the content to render
+            let content = '';
+            
+            if (typeof data === 'string') {
+                // Direct string content
+                content = data;
+            } else if (data.markdown) {
+                // Markdown content
+                content = data.markdown;
+            } else if (data.html) {
+                // HTML content
+                resultsContainer.innerHTML = data.html;
+                return; // Return early since we've set HTML directly
+            } else if (data.text) {
+                // Text content
+                content = data.text;
+            } else if (data.summary) {
+                // Summary content
+                content = data.summary;
+            } else if (data.results) {
+                // Results array (old format)
+                if (Array.isArray(data.results)) {
+                    content = data.results.join('\n\n');
+                } else {
+                    content = JSON.stringify(data.results, null, 2);
+                }
+            } else {
+                // Last resort: stringify the entire object
+                content = JSON.stringify(data, null, 2);
+            }
+            
+            // Render the content as Markdown if possible
+            if (window.ui && window.ui.renderMarkdown) {
+                const renderedHtml = window.ui.renderMarkdown(content);
+                resultsContainer.innerHTML = renderedHtml;
+            } else {
+                // Fall back to basic formatting
+                content = content.replace(/\n/g, '<br>');
+                resultsContainer.innerHTML = `<div class="markdown-content">${content}</div>`;
+            }
+            
+            // Add syntax highlighting if Prism is available
+            if (window.Prism) {
+                window.Prism.highlightAllUnder(resultsContainer);
+            }
+            
+        } catch (error) {
+            console.error('Error rendering results:', error);
+            showError(`Error rendering results: ${error.message}`);
+        }
+    }
+    
+    /**
+     * Show error message in the results container
+     * @param {string} message - Error message
+     */
+    function showError(message) {
+        resultsContainer.innerHTML = `
+            <div class="alert alert-danger" role="alert">
+                <i class="fas fa-exclamation-triangle"></i> ${message}
+            </div>
+            <p class="text-center mt-3">
+                <a href="/research" class="btn btn-primary">
+                    <i class="fas fa-arrow-left"></i> Back to Research
+                </a>
+            </p>
+        `;
+    }
+    
+    /**
+     * Handle export button click
+     */
+    function handleExport() {
+        try {
+            if (!researchData) {
+                throw new Error('No research data available');
+            }
+            
+            // Get metadata from DOM (which should be populated by now)
+            const query = document.getElementById('result-query')?.textContent || 'Unknown query';
+            const generated = document.getElementById('result-date')?.textContent || 'Unknown date';
+            const mode = document.getElementById('result-mode')?.textContent || 'Quick';
+            
+            // Create markdown header with metadata
+            let markdownHeader = `# Research Results: ${query}\n\n`;
+            markdownHeader += `- **Generated:** ${generated}\n`;
+            markdownHeader += `- **Mode:** ${mode}\n\n`;
+            markdownHeader += `---\n\n`;
+            
+            // Extract the content to export
+            let markdownContent = '';
+            
+            // Try to extract the markdown content from various possible locations
+            if (typeof researchData === 'string') {
+                markdownContent = researchData;
+            } else {
+                // Check for content in standard locations
+                const contentProps = [
+                    'content',
+                    'report',
+                    'markdown',
+                    'text',
+                    'summary',
+                    'output',
+                    'research_output'
+                ];
+                
+                let found = false;
+                
+                // First check direct properties
+                for (const prop of contentProps) {
+                    if (researchData[prop] && typeof researchData[prop] === 'string') {
+                        markdownContent = researchData[prop];
+                        console.log(`Using ${prop} for markdown content`);
+                        found = true;
+                        break;
+                    }
+                }
+                
+                // Then check nested properties
+                if (!found && researchData.research) {
+                    for (const prop of contentProps) {
+                        if (researchData.research[prop] && typeof researchData.research[prop] === 'string') {
+                            markdownContent = researchData.research[prop];
+                            console.log(`Using research.${prop} for markdown content`);
+                            found = true;
+                            break;
+                        }
+                    }
+                }
+                
+                // Check results property
+                if (!found && researchData.results) {
+                    if (typeof researchData.results === 'string') {
+                        markdownContent = researchData.results;
+                        console.log('Using results string for markdown content');
+                    } else {
+                        for (const prop of contentProps) {
+                            if (researchData.results[prop] && typeof researchData.results[prop] === 'string') {
+                                markdownContent = researchData.results[prop];
+                                console.log(`Using results.${prop} for markdown content`);
+                                found = true;
+                                break;
+                            }
+                        }
+                    }
+                }
+                
+                // Last resort
+                if (!markdownContent) {
+                    console.warn('Could not extract markdown content, using JSON');
+                    markdownContent = "```json\n" + JSON.stringify(researchData, null, 2) + "\n```";
+                }
+            }
+            
+            // Combine header and content
+            const fullMarkdown = markdownHeader + markdownContent;
+            
+            // Create blob and trigger download
+            const blob = new Blob([fullMarkdown], { type: 'text/markdown' });
+            const link = document.createElement('a');
+            link.href = URL.createObjectURL(blob);
+            link.download = `research_${researchId}.md`;
+            
+            // Trigger download
+            document.body.appendChild(link);
+            link.click();
+            document.body.removeChild(link);
+            
+        } catch (error) {
+            console.error('Error exporting markdown:', error);
+            alert(`Error exporting markdown: ${error.message}`);
+        }
+    }
+    
+    /**
+     * Handle PDF export button click
+     */
+    function handlePdfExport() {
+        try {
+            if (!researchData) {
+                throw new Error('No research data available');
+            }
+            
+            console.log('PDF export initiated for research ID:', researchId);
+            
+            // Show loading indicator
+            pdfBtn.disabled = true;
+            pdfBtn.innerHTML = '<i class="fas fa-spinner fa-spin"></i> Generating PDF...';
+            
+            // Get metadata from DOM (which should be populated correctly by now)
+            const title = document.getElementById('result-query')?.textContent || `Research ${researchId}`;
+            console.log('Using title for PDF:', title);
+            
+            // Check if PDF service is available
+            if (window.pdfService && window.pdfService.downloadPdf) {
+                console.log('PDF service available, calling downloadPdf');
+                
+                // Add the metadata to the researchData for PDF generation
+                const pdfData = {
+                    ...researchData,
+                    title: title,
+                    query: title,
+                    metadata: {
+                        title: title,
+                        date: document.getElementById('result-date')?.textContent || 'Unknown date',
+                        mode: document.getElementById('result-mode')?.textContent || 'Standard'
+                    }
+                };
+                
+                // Use the PDF service to generate and download the PDF
+                window.pdfService.downloadPdf(pdfData, researchId)
+                    .then(() => {
+                        console.log('PDF generated successfully');
+                        // Reset button
+                        pdfBtn.disabled = false;
+                        pdfBtn.innerHTML = '<i class="fas fa-file-pdf"></i> Download PDF';
+                    })
+                    .catch(error => {
+                        console.error('Error generating PDF:', error);
+                        alert(`Error generating PDF: ${error.message || 'Unknown error'}`);
+                        
+                        // Reset button
+                        pdfBtn.disabled = false;
+                        pdfBtn.innerHTML = '<i class="fas fa-file-pdf"></i> Download PDF';
+                    });
+            } else {
+                console.error('PDF service not available');
+                throw new Error('PDF service not available');
+            }
+            
+        } catch (error) {
+            console.error('Error exporting PDF:', error);
+            alert(`Error exporting PDF: ${error.message || 'Unknown error'}`);
+            
+            // Reset button
+            if (pdfBtn) {
+                pdfBtn.disabled = false;
+                pdfBtn.innerHTML = '<i class="fas fa-file-pdf"></i> Download PDF';
+            }
+        }
+    }
+    
+    // Initialize on DOM content loaded
+    if (document.readyState === 'loading') {
+        document.addEventListener('DOMContentLoaded', initializeResults);
+    } else {
+        initializeResults();
+    }
+})();