Update app.py

app.py

@@ -27,26 +27,28 @@ if st.button("Generate Audio"):
                     audio_data = f.read()
                 audio_base64 = base64.b64encode(audio_data).decode()
 
-                # JavaScript-based audio player with speed adjustment
+                # Use JavaScript-based audio player with playback speed adjustment
                 st.markdown(
                     f"""
-                    <audio id="audio" controls>
-                        <source src="data:audio/wav;base64,{audio_base64}" type="audio/wav">
-                        Your browser does not support the audio element.
-                    </audio>
-                    <br>
-                    <label for="speed">Playback Speed: </label>
-                    <input type="range" id="speed" min="0.5" max="2.0" value="1.0" step="0.1">
-                    <span id="speed-value">1.0x</span>
+                    <div>
+                        <audio id="audio" controls>
+                            <source src="data:audio/wav;base64,{audio_base64}" type="audio/wav">
+                            Your browser does not support the audio element.
+                        </audio>
+                        <br>
+                        <label for="speed">Playback Speed:</label>
+                        <input type="range" id="speed" min="0.5" max="2.0" value="1.0" step="0.1">
+                        <span id="speed-value">1.0x</span>
+                    </div>
                     <script>
-                        const audioElement = document.getElementById("audio");
+                        const audio = document.getElementById("audio");
                         const speedSlider = document.getElementById("speed");
                         const speedValue = document.getElementById("speed-value");
 
-                        // Update playback rate and display speed
+                        // Update playback speed dynamically
                         speedSlider.addEventListener("input", () => {{
                             const speed = parseFloat(speedSlider.value);
-                            audioElement.playbackRate = speed;
+                            audio.playbackRate = speed;
                             speedValue.textContent = speed.toFixed(1) + "x";
                         }});
                     </script>