Spaces:
Running
Running
Update templates/interface.html
Browse files- templates/interface.html +22 -29
templates/interface.html
CHANGED
@@ -48,45 +48,38 @@
|
|
48 |
<label for="play">Auto-play:</label>
|
49 |
<input type="checkbox" id="play" checked>
|
50 |
</div>
|
51 |
-
|
52 |
-
|
53 |
-
<!-- Add other input fields and elements here -->
|
54 |
<div>
|
55 |
-
|
56 |
-
|
57 |
</div>
|
58 |
|
59 |
-
|
60 |
-
|
61 |
-
|
62 |
-
|
63 |
-
|
64 |
-
|
65 |
-
|
66 |
-
|
67 |
-
|
68 |
-
|
69 |
-
|
70 |
-
|
|
|
71 |
|
72 |
-
|
73 |
-
|
74 |
-
// If the checkbox is checked, add the autoplay attribute
|
75 |
if (playCheckbox.checked) {
|
|
|
76 |
audioPlayer.setAttribute("autoplay", "");
|
77 |
} else {
|
78 |
-
|
79 |
audioPlayer.removeAttribute("autoplay");
|
80 |
}
|
81 |
-
|
82 |
-
|
83 |
-
|
84 |
-
|
85 |
-
|
86 |
-
</form>
|
87 |
-
|
88 |
|
89 |
-
|
90 |
</body>
|
91 |
</html>
|
92 |
|
|
|
|
48 |
<label for="play">Auto-play:</label>
|
49 |
<input type="checkbox" id="play" checked>
|
50 |
</div>
|
|
|
|
|
|
|
51 |
<div>
|
52 |
+
<button type="submit" id="synthesize_button">Synthesize</button>
|
|
|
53 |
</div>
|
54 |
|
55 |
+
{% if file_url %}
|
56 |
+
<h2>Generated Audio</h2>
|
57 |
+
<audio controls id="audio-player">
|
58 |
+
<source src="{{ file_url }}" type="audio/mpeg">
|
59 |
+
Your browser does not support the audio element.
|
60 |
+
</audio>
|
61 |
+
<a href="{{ file_url }}" download>Download Audio</a>
|
62 |
+
{% endif %}
|
63 |
+
|
64 |
+
<!-- Move the JavaScript code outside the conditional block -->
|
65 |
+
<script>
|
66 |
+
const playCheckbox = document.getElementById("play");
|
67 |
+
const audioPlayer = document.getElementById("audio-player");
|
68 |
|
69 |
+
playCheckbox.addEventListener("change", function () {
|
70 |
+
console.log("Checkbox state changed"); // Add this line for debugging
|
|
|
71 |
if (playCheckbox.checked) {
|
72 |
+
console.log("Checkbox is checked"); // Add this line for debugging
|
73 |
audioPlayer.setAttribute("autoplay", "");
|
74 |
} else {
|
75 |
+
console.log("Checkbox is unchecked"); // Add this line for debugging
|
76 |
audioPlayer.removeAttribute("autoplay");
|
77 |
}
|
78 |
+
});
|
79 |
+
</script>
|
|
|
|
|
|
|
|
|
|
|
80 |
|
81 |
+
</form>
|
82 |
</body>
|
83 |
</html>
|
84 |
|
85 |
+
|