app

app.py

@@ -67,7 +67,7 @@ with gr.Blocks() as app:
 
             with gr.Group():
                 with gr.Row():
-                    match_box = gr.html(
+                    match_box = gr.Markdown(
                         label="Phonetic Match",
                     )
                 with gr.Row():

requirements.txt

@@ -1,4 +1,4 @@
-gradio==5.8.0
+gradio==2.9.1
 torch
 torchaudio
 transformers

util.py

@@ -86,22 +86,20 @@ def calculate_pronunciation_accuracy(reference_text, output_text, language_code=
     # Convert to percentage
     pronunciation_accuracy = match_ratio * 100
 
-    # Generate HTML for comparison
-    comparison_html = ""
+    # Generate Markdown-compatible styled text
+    comparison_md = ""
     for opcode, i1, i2, j1, j2 in matcher.get_opcodes():
         ref_segment = reference_ipa[i1:i2]
         out_segment = output_ipa[j1:j2]
 
         if opcode == 'equal':  # Matching characters
-            comparison_html += f'<span style="color: green">{ref_segment}</span>'
-        elif opcode == 'replace':  # Mismatched characters
-            comparison_html += f'<span style="color: red">{ref_segment}</span>'
-        elif opcode == 'delete':  # Characters in reference but not in output
-            comparison_html += f'<span style="color: red">{ref_segment}</span>'
-        elif opcode == 'insert':  # Characters in output but not in reference
-            comparison_html += f'<span style="color: red">{out_segment}</span>'
-
-    return reference_ipa, output_ipa, comparison_html, pronunciation_accuracy
+            comparison_md += f'<span style="color: green;">{ref_segment}</span>'
+        elif opcode in ['replace', 'delete', 'insert']:  # Mismatched or missing
+            comparison_md += f'<span style="color: red;">{ref_segment}</span>'
+
+    comparison_md = f"<div>{comparison_md}</div>"
+
+    return reference_ipa, output_ipa, comparison_md, pronunciation_accuracy
 
 def remove_punctuation(text):
   """Helper function to remove punctuation from text."""