Update app.py

app.py

@@ -443,8 +443,9 @@ async def predict(image):
                 breed = topk_breeds[0]
                 description = get_dog_description(breed)
                 html_output += format_description_html(description, breed)
-                html_output += f'<div class="breed-buttons"><button class="breed-button" onclick="handle_button_click(\'Dog {i+1}: More about {breed}\')">More about {breed}</button></div>'
-                buttons.append(f"Dog {i+1}: More about {breed}")
+                button_id = f"Dog {i+1}: More about {breed}"
+                html_output += f'<div class="breed-buttons"><button class="breed-button" onclick="handle_button_click(\'{button_id}\')">{breed}</button></div>'
+                buttons.append(button_id)
             elif combined_confidence >= 0.15:
                 html_output += f"<p>Top 3 possible breeds:</p><ul>"
                 for j, (breed, prob) in enumerate(zip(topk_breeds[:3], topk_probs_percent[:3])):
@@ -465,7 +466,12 @@ async def predict(image):
             html_output += """
             <script>
             function handle_button_click(button_id) {
-                document.querySelector('input[type=radio][value="' + button_id + '"]').click();
+                const radio = document.querySelector('input[type=radio][value="' + button_id + '"]');
+                if (radio) {
+                    radio.click();
+                } else {
+                    console.error("Radio button not found:", button_id);
+                }
             }
             </script>
             """
@@ -554,7 +560,7 @@ with gr.Blocks() as iface:
         input_image = gr.Image(label="Upload a dog image", type="pil")
         output_image = gr.Image(label="Annotated Image")
     
-    output = gr.HTML(label="Prediction Results")  # 改為 HTML 輸出
+    output = gr.HTML(label="Prediction Results")  # 使用 HTML 而不是 Markdown
     
     breed_buttons = gr.Radio(choices=[], label="More Information", visible=False)
     
@@ -569,7 +575,7 @@ with gr.Blocks() as iface:
     )
 
     breed_buttons.change(
-        show_details_html,
+        show_details,
         inputs=[breed_buttons, output, initial_state],
         outputs=[output, back_button, initial_state]
     )
@@ -580,11 +586,6 @@ with gr.Blocks() as iface:
         outputs=[output, output_image, breed_buttons, back_button, initial_state]
     )
 
-    gr.Examples(
-        examples=['Border_Collie.jpg', 'Golden_Retriever.jpeg', 'Saint_Bernard.jpeg', 'French_Bulldog.jpeg', 'Samoyed.jpg'],
-        inputs=input_image
-    )
-
     gr.HTML('For more details on this project and other work, feel free to visit my GitHub <a href="https://github.com/Eric-Chung-0511/Learning-Record/tree/main/Data%20Science%20Projects/Dog_Breed_Classifier">Dog Breed Classifier</a>')