Skip to content

Gradio UI ​

The Gradio entry point is src/quran_muaalem/gradio_app.py and is exposed as a CLI script quran-muaalem-ui in pyproject.toml.

What the UI does ​

Key functions in src/quran_muaalem/gradio_app.py:

  • process_audio(...)
    • Loads audio via librosa.load.
    • Builds a reference phonetic script using quran_phonetizer.
    • Runs Muaalem inference and returns HTML output.
  • update_uthmani_ref(...)
    • Retrieves the Uthmani reference text via quran_transcript.Aya.
  • create_gradio_input_for_field(...)
    • Builds UI inputs from MoshafAttributes.model_fields.

Typical workflow (UI) ​

  1. Choose Sura and Ayah.
  2. Select the start word index and number of words.
  3. Upload or record audio (16 kHz preferred).
  4. Click “Analyze” to get phoneme + sifat comparison.

If the word span cuts a Uthmani word, the UI warns with PartOfUthmaniWord and asks you to adjust the span.

How the UI is launched ​

python
app.launch(server_name="0.0.0.0", share=True)
  • To disable public share links, set share=False in main().
  • To bind a different port or interface, edit the app.launch(...) call.

Run the UI locally ​

bash
pip install "quran-muaalem[ui]"
quran-muaalem-ui

The CLI points to quran_muaalem.gradio_app:main (see pyproject.toml).

Known limitations ​

  • The UI performs non‑streaming inference (full audio at once).
  • Performance depends on GPU availability and audio length.
  • If you need batch processing, use the Python API instead.