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, | |
| timeout: 180000 | |
| success: function(data) { | |
| if (data.audio_id) { | |
| // 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 if (data.error) { | |
| // Display error message from the server | |
| alert(data.error); | |
| } | |
| }, | |
| error: function(xhr, status, error) { | |
| // Handle different types of error status codes | |
| if(xhr.status === 429) { | |
| alert("Too many requests, please try again later."); | |
| } else if(xhr.status === 400) { | |
| alert("Bad request. Please check the input and try again."); | |
| } else { | |
| // Generic error message for other statuses | |
| alert("An error occurred: " + xhr.status + " " + error); | |
| } | |
| }, | |
| cache: false, | |
| contentType: false, | |
| processData: false | |
| }); | |
| }); | |
| }); | |
| </script> | |
| </body> | |
| </html> | |