Spaces:
Sleeping
Sleeping
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <title>Audio Conversion</title> | |
| <!-- Include jQuery for simplicity --> | |
| <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script> | |
| </head> | |
| <body> | |
| <h2>Upload Audio for Conversion</h2> | |
| <form id="uploadForm" enctype="multipart/form-data"> | |
| <label for="spk_id">Speaker:</label> | |
| <select name="spk_id" id="spk_id"> | |
| <option value="trips">Trips</option> | |
| <option value="modi">Modi</option> | |
| <option value="khujli">Khujli</option> | |
| <option value="kishorkumar">Kishor</option> | |
| </select> | |
| <br><br> | |
| <label for="file">Audio File:</label> | |
| <input type="file" id="file" name="file" required> | |
| <br><br> | |
| <input type="hidden" name="voice_transform" value="0"> | |
| <input type="submit" value="Convert Voice"> | |
| </form> | |
| <!-- Processed Audio Playback --> | |
| <h3>Processed Audio:</h3> | |
| <audio id="processedAudio" controls> | |
| <source src="" type="audio/wav"> | |
| Your browser does not support the audio element. | |
| </audio> | |
| <script> | |
| $(document).ready(function() { | |
| $('#uploadForm').submit(function(e) { | |
| e.preventDefault(); | |
| var formData = new FormData(this); | |
| $.ajax({ | |
| url: '/convert_voice', | |
| type: 'POST', | |
| data: formData, | |
| success: function(data) { | |
| if (data.audio_id) { | |
| // Assuming your Flask route returns a JSON with an 'audio_id' key | |
| // Update the source of the processed audio element | |
| $('#processedAudio source').attr('src', '/get_processed_audio/' + data.audio_id); | |
| $('#processedAudio')[0].load(); | |
| $('#processedAudio')[0].play(); | |
| } else { | |
| // Handle error or no audio_id in response | |
| alert("Error or no audio_id returned from server."); | |
| } | |
| }, | |
| cache: false, | |
| contentType: false, | |
| processData: false | |
| }); | |
| }); | |
| }); | |
| </script> | |
| </body> | |
| </html> | |