refactor: read the app description from app_description.md

aip_trainer/lambdas/app_description.md

@@ -0,0 +1,8 @@
+# AI Pronunciation Trainer
+
+See [my fork](https://github.com/trincadev/ai-pronunciation-trainer) of [AI Pronunciation Trainer](https://github.com/Thiagohgl/ai-pronunciation-trainer) repositroy
+for more details.
+
+Selecting a new example invalidates all previous inputs (Text-to-Speech audio and Speech-to-Text recordings): in that case you should recorder again your audio speeceh.
+
+Right now this tool uses {} as sample rate value. From empirical tests the best sample rate value is 48000...

aip_trainer/lambdas/js.py

@@ -0,0 +1,23 @@
+js_update_ipa_output = """
+function updateCssText(text, letters) {
+    let wordsArr = text.split(" ")
+    let lettersWordsArr = letters.split(" ")
+    let speechOutputContainer = document.querySelector('#speech-output');
+    speechOutputContainer.textContent = ""
+
+    for (let idx in wordsArr) {
+        let word = wordsArr[idx]
+        let letterIsCorrect = lettersWordsArr[idx]
+        for (let idx1 in word) {
+        let letterCorrect = letterIsCorrect[idx1] == "1"
+        let containerLetter = document.createElement("span")
+        containerLetter.style.color = letterCorrect ? 'green' : "red"
+        containerLetter.innerText = word[idx1];
+        speechOutputContainer.appendChild(containerLetter)
+        }
+        let containerSpace = document.createElement("span")
+        containerSpace.textContent = " "
+        speechOutputContainer.appendChild(containerSpace)
+    }
+}
+"""

app.py

@@ -1,32 +1,8 @@
+from pathlib import Path
 import gradio as gr
 
-from aip_trainer import app_logger
-from aip_trainer.lambdas import lambdaGetSample, lambdaSpeechToScore, lambdaTTS
-
-
-js = """
-function updateCssText(text, letters) {
-    let wordsArr = text.split(" ")
-    let lettersWordsArr = letters.split(" ")
-    let speechOutputContainer = document.querySelector('#speech-output');
-    speechOutputContainer.textContent = ""
-
-    for (let idx in wordsArr) {
-        let word = wordsArr[idx]
-        let letterIsCorrect = lettersWordsArr[idx]
-        for (let idx1 in word) {
-        let letterCorrect = letterIsCorrect[idx1] == "1"
-        let containerLetter = document.createElement("span")
-        containerLetter.style.color = letterCorrect ? 'green' : "red"
-        containerLetter.innerText = word[idx1];
-        speechOutputContainer.appendChild(containerLetter)
-        }
-        let containerSpace = document.createElement("span")
-        containerSpace.textContent = " "
-        speechOutputContainer.appendChild(containerSpace)
-    }
-}
-"""
+from aip_trainer import PROJECT_ROOT_FOLDER, app_logger
+from aip_trainer.lambdas import js, lambdaGetSample, lambdaSpeechToScore, lambdaTTS
 
 
 def clear():
@@ -40,14 +16,10 @@ def clear2():
 with gr.Blocks() as gradio_app:
     app_logger.info("start gradio app building...")
 
-    gr.Markdown(
-        """
-        # AI Pronunciation Trainer
-
-        See [my fork](https://github.com/trincadev/ai-pronunciation-trainer) of [AI Pronunciation Trainer](https://github.com/Thiagohgl/ai-pronunciation-trainer) repositroy
-        for more details.
-        """
-    )
+    project_root_folder = Path(PROJECT_ROOT_FOLDER)
+    with open(project_root_folder / "aip_trainer" / "lambdas" / "app_description.md", "r", encoding="utf-8") as app_description_src:
+        app_description = app_description_src.read()
+        gr.Markdown(app_description)
     with gr.Row():
         with gr.Column(scale=4, min_width=300):
             with gr.Row():
@@ -90,12 +62,12 @@ with gr.Blocks() as gradio_app:
         with gr.Column(scale=4, min_width=320):
             examples_text = gr.Examples(
                 examples=[
-                    ["Hi there, how are you?", "en", 1],
                     ["Hallo, wie geht es dir?", "de", 1],
+                    ["Hi there, how are you?", "en", 1],
                     ["Die König-Ludwig-Eiche ist ein Naturdenkmal im Staatsbad Brückenau.", "de", 2,],
                     ["Rome is home to some of the most beautiful monuments in the world.", "en", 2],
-                    ["Some machine learning models are designed to understand and generate human-like text based on the input they receive.", "en", 3],
                     ["Die König-Ludwig-Eiche ist ein Naturdenkmal im Staatsbad Brückenau, einem Ortsteil des drei Kilometer nordöstlich gelegenen Bad Brückenau im Landkreis Bad Kissingen in Bayern.", "de", 3],
+                    ["Some machine learning models are designed to understand and generate human-like text based on the input they receive.", "en", 3],
                 ],
                 inputs=[learner_transcription, language, difficulty],
             )
@@ -161,7 +133,7 @@ with gr.Blocks() as gradio_app:
         None,
         inputs=[transcripted_text, letter_correctness],
         outputs=[html_output],
-        js=js,
+        js=js.js_update_ipa_output,
     )