Upload folder using huggingface_hub

templates/index.html

@@ -15,19 +15,34 @@
         <input type="number" id="year" placeholder="Enter Year (e.g. 2026)" value="2026">
         <br>
         <button onclick="runTechModal()">START PREDICTION</button>
-        <div id="results" style="margin-top: 20px;"></div>
+        <div id="results" style="margin-top: 20px; text-align: left; max-width: 300px;"></div>
     </div>
 
     <script>
         async function runTechModal() {
             const year = document.getElementById('year').value;
-            const res = await fetch('/predict', {
-                method: 'POST',
-                headers: {'Content-Type': 'application/json'},
-                body: JSON.stringify({year: year})
-            });
-            const data = await res.json();
-            document.getElementById('results').innerText = `Tech Score: ${data.tech_maturity_score.toFixed(4)} | Status: ${data.status}`;
+            try {
+                const res = await fetch('/predict', {
+                    method: 'POST',
+                    headers: {'Content-Type': 'application/json'},
+                    body: JSON.stringify({year: year})
+                });
+                const data = await res.json();
+                
+                if (data.tech_scores) {
+                    // Display all tech scores
+                    let resultsHtml = '<h3>Tech Scores:</h3>';
+                    Object.entries(data.tech_scores).forEach(([category, score]) => {
+                        resultsHtml += `<div>${category}: ${(score || 0).toFixed(4)}</div>`;
+                    });
+                    resultsHtml += `<div style="margin-top: 10px;">Status: ${data.status}</div>`;
+                    document.getElementById('results').innerHTML = resultsHtml;
+                } else {
+                    document.getElementById('results').innerText = `Error: Unexpected response format`;
+                }
+            } catch (error) {
+                document.getElementById('results').innerText = `Error: ${error.message}`;
+            }
         }
     </script>
 </body>