Update app.py

app.py

@@ -262,6 +262,67 @@ PHONEME_TO_ENGLISH = {
     'ˌ': '',       # secondary stress (remove)
 }
 
+# Phoneme example words - showing the sound in context
+PHONEME_EXAMPLES = {
+    # Vowels (monophthongs)
+    'ɪ': 'bit',     # IH sound
+    'ɛ': 'bed',     # EH sound
+    'æ': 'cat',     # AE sound
+    'ʌ': 'but',     # UH sound (stressed)
+    'ɑ': 'father',  # AH sound
+    'ɔ': 'law',     # AW sound
+    'ʊ': 'book',    # UU sound
+    'u': 'boot',    # OO sound
+    'i': 'beat',    # EE sound
+    'ə': 'about',   # schwa (unstressed)
+    'ɝ': 'bird',    # ER sound (stressed)
+    'ɚ': 'letter',  # ER sound (unstressed)
+    
+    # Diphthongs
+    'eɪ': 'day',    # AY sound
+    'aɪ': 'my',     # EYE sound
+    'ɔɪ': 'boy',    # OY sound
+    'aʊ': 'now',    # OW sound
+    'oʊ': 'go',     # OH sound
+    
+    # R-colored vowels
+    'ɪr': 'near',   # EER sound
+    'ɛr': 'care',   # AIR sound
+    'ɑr': 'car',    # AR sound
+    'ɔr': 'for',    # OR sound
+    'ʊr': 'tour',   # OOR sound
+    'ər': 'letter', # ER sound
+    
+    # Consonants
+    'p': 'pat',     # P sound
+    'b': 'bat',     # B sound
+    't': 'tap',     # T sound
+    'd': 'dap',     # D sound
+    'k': 'cat',     # K sound
+    'g': 'gap',     # G sound (ASCII)
+    'ɡ': 'gap',     # G sound (IPA)
+    'f': 'fat',     # F sound
+    'v': 'vat',     # V sound
+    'θ': 'think',   # TH sound (voiceless)
+    'ð': 'this',    # TH sound (voiced)
+    's': 'sap',     # S sound
+    'z': 'zap',     # Z sound
+    'ʃ': 'ship',    # SH sound
+    'ʒ': 'measure', # ZH sound
+    'h': 'hat',     # H sound
+    'm': 'mat',     # M sound
+    'n': 'nat',     # N sound
+    'ŋ': 'sing',    # NG sound
+    'l': 'lap',     # L sound
+    'r': 'rap',     # R sound
+    'j': 'yes',     # Y sound
+    'w': 'wet',     # W sound
+    
+    # Affricates
+    'tʃ': 'chip',   # CH sound
+    'dʒ': 'jump',   # J sound
+}
+
 def clean_word_for_phonemes(word: str) -> str:
     """
     Clean word by removing punctuation and extra spaces for phoneme processing.
@@ -776,22 +837,33 @@ def create_character_level_feedback(word: str, expected_normalized: str,
                     word_letters = phoneme_mapping[i]  # Keep natural case
                     # CRITICAL: Skip empty mappings (used for extra phonemes in diphthongs)
                     if word_letters:  # Only add non-empty letters
-                        # Get the English equivalent for the expected phoneme
+                        # Get the English equivalent and example word for the expected phoneme
                         expected_english = ""
+                        expected_example = ""
                         if expected_char in PHONEME_TO_ENGLISH:
                             expected_english = PHONEME_TO_ENGLISH[expected_char]
+                            expected_example = PHONEME_EXAMPLES.get(expected_char, word_letters)
                         
-                        # Get the English equivalent for what was detected
+                        # Get the English equivalent and example for what was detected
                         detected_english = ""
+                        detected_example = ""
                         if detected_char in PHONEME_TO_ENGLISH:
                             detected_english = PHONEME_TO_ENGLISH[detected_char]
+                            detected_example = PHONEME_EXAMPLES.get(detected_char, "")
                         elif detected_char == ' ':
                             detected_english = "silence"
+                            detected_example = ""
                         else:
                             detected_english = "?"
+                            detected_example = ""
                         
-                        # Create tooltip text
-                        tooltip_text = f"Expected '{expected_english}' as in '{word_letters}', You said '{detected_english}'"
+                        # Create tooltip text with example words
+                        if expected_example and detected_example:
+                            tooltip_text = f"Expected '{expected_english}' as in '{expected_example}', You said '{detected_english}' as in '{detected_example}'"
+                        elif expected_example:
+                            tooltip_text = f"Expected '{expected_english}' as in '{expected_example}', You said '{detected_english}'"
+                        else:
+                            tooltip_text = f"Expected '{expected_english}', You said '{detected_english}'"
                         
                         # Create span with inline tooltip for each mispronounced letter/group
                         formatted_letters = f'<span class="phoneme-error" data-expected="{expected_english}" data-detected="{detected_english}" title="{tooltip_text}"><strong><u>{word_letters}</u></strong></span>'
@@ -802,8 +874,16 @@ def create_character_level_feedback(word: str, expected_normalized: str,
                 else:
                     # Fallback for cases without mapping
                     expected_english = PHONEME_TO_ENGLISH.get(expected_char, "?")
+                    expected_example = PHONEME_EXAMPLES.get(expected_char, "")
                     detected_english = PHONEME_TO_ENGLISH.get(detected_char, "?")
-                    tooltip_text = f"Expected '{expected_english}', You said '{detected_english}'"
+                    detected_example = PHONEME_EXAMPLES.get(detected_char, "")
+                    
+                    if expected_example and detected_example:
+                        tooltip_text = f"Expected '{expected_english}' as in '{expected_example}', You said '{detected_english}' as in '{detected_example}'"
+                    elif expected_example:
+                        tooltip_text = f"Expected '{expected_english}' as in '{expected_example}', You said '{detected_english}'"
+                    else:
+                        tooltip_text = f"Expected '{expected_english}', You said '{detected_english}'"
                     
                     formatted_char = f'<span class="phoneme-error" data-expected="{expected_english}" data-detected="{detected_english}" title="{tooltip_text}"><strong><u>{expected_char}</u></strong></span>'
                     test_result.append(formatted_char)