Update app.py

app.py

@@ -19,16 +19,15 @@ async def classify_image(file: UploadFile = File(...)):
         result = pipe(image)
 
         # Overall result summary
-        overall_result = "All results: " + str(result)
-        
+        overall_result = str(result)
+
+        # Add overall result as comment to the top result
         result_with_comment = {
             "label": result[0]['label'],
             "score": result[0]['score'],
-            "comment": overall_result
         }
 
-
-        return {"classification_result": result_with_comment}  # Return the top prediction with comment and overall summary
+        return {"classification_result": result_with_comment, "overall_result": overall_result}  # Return the top prediction with comment and overall summary
 
     except Exception as e:
         # Handle exceptions, for example: file not found, image format issues, etc.
@@ -81,7 +80,7 @@ async def home():
             button:hover {
                 background-color: #45a049;
             }
-            #result {
+            #result, #overall-results {
                 margin-top: 20px;
                 padding: 20px;
                 background: #fff;
@@ -99,6 +98,7 @@ async def home():
             <button type="submit">Upload</button>
         </form>
         <div id="result"></div>
+        <div id="overall-results"></div>
         <script>
             const form = document.getElementById('upload-form');
             form.addEventListener('submit', async (e) => {
@@ -115,10 +115,14 @@ async def home():
                 const result = await response.json();
                 
                 const resultDiv = document.getElementById('result');
+                const overallResultsDiv = document.getElementById('overall-results');
+                
                 if (response.ok) {
-                    resultDiv.innerHTML = `<h2>Classification Result:</h2><p>${JSON.stringify(result.classification_result)}</p>`;
+                    resultDiv.innerHTML = `<h2>Top Classification Result:</h2><p>${JSON.stringify(result.classification_result)}</p>`;
+                    overallResultsDiv.innerHTML = `<h2>All Results:</h2><p>${result.overall_result}</p>`;
                 } else {
                     resultDiv.innerHTML = `<h2>Error:</h2><p>${result.detail}</p>`;
+                    overallResultsDiv.innerHTML = '';
                 }
             });
         </script>