Upload index.html

static/index.html

@@ -370,7 +370,10 @@
     <div class="container">
         <header>
             <h1>WHEC - Chatbot</h1>
-            <p class="subtitle">Exertion-related Injuries Analysis System</p>
+            <p class="subtitle">Based on documents at WHEC (Warrior Heat- and Exertion-Related Events Collaborative)
+                page: <a
+                    href="https://www.hprc-online.org/resources-partners/whec">https://www.hprc-online.org/resources-partners/whec</a>
+            </p>
         </header>
 
         <div class="search-container">
@@ -490,25 +493,36 @@
 
                 // 2. Display Images
                 if (data.images && data.images.length > 0) {
-                    imagesSection.style.display = 'block';
-                    data.images.forEach(img => {
-                        if (img.score < 0.3) return;
-                        const div = document.createElement('div');
-                        div.className = 'image-card';
-                        div.innerHTML = `
-                            <a href="${img.path}" target="_blank">
-                                <img src="${img.path}" alt="${img.filename}" loading="lazy">
-                            </a>
-                            <div class="image-meta">
-                                <div class="image-filename" title="${img.filename}">${img.filename}</div>
-                                <div class="image-stats">
-                                    <span>Page ${img.page || '?'}</span>
-                                    <span>${(img.score * 100).toFixed(0)}% Match</span>
+                    // Sort by score descending just to be safe
+                    data.images.sort((a, b) => b.score - a.score);
+
+                    let imagesToShow = data.images.filter(img => img.score >= 0.3);
+
+                    // Fallback: if no images match threshold, show the top 1 most relevant
+                    if (imagesToShow.length === 0) {
+                        imagesToShow = [data.images[0]];
+                    }
+
+                    if (imagesToShow.length > 0) {
+                        imagesSection.style.display = 'block';
+                        imagesToShow.forEach(img => {
+                            const div = document.createElement('div');
+                            div.className = 'image-card';
+                            div.innerHTML = `
+                                <a href="${img.path}" target="_blank">
+                                    <img src="${img.path}" alt="${img.filename}" loading="lazy">
+                                </a>
+                                <div class="image-meta">
+                                    <div class="image-filename" title="${img.filename}">${img.filename}</div>
+                                    <div class="image-stats">
+                                        <span>Page ${img.page || '?'}</span>
+                                        <span>${(img.score * 100).toFixed(0)}% Match</span>
+                                    </div>
                                 </div>
-                            </div>
-                        `;
-                        imagesGrid.appendChild(div);
-                    });
+                            `;
+                            imagesGrid.appendChild(div);
+                        });
+                    }
                 }
 
                 // 3. Display Texts