Spaces:
Sleeping
Sleeping
File size: 4,126 Bytes
4e70d0d ff7b68c 4e70d0d cb0a021 f2c67f9 ff7b68c f2c67f9 ff7b68c f2c67f9 ff7b68c f2c67f9 ff7b68c cb0a021 1e95876 ff7b68c 1e95876 4e70d0d 1e95876 f2c67f9 1e95876 f2c67f9 1e95876 ff7b68c a945a59 ff7b68c a945a59 ff7b68c a945a59 ff7b68c 1e95876 ff7b68c a945a59 ff7b68c 1e95876 ff7b68c a945a59 ff7b68c a945a59 ff7b68c 4e70d0d f2c67f9 ff7b68c 4e70d0d ff7b68c 4e70d0d f2c67f9 ff7b68c 4e70d0d ff7b68c 4e70d0d ff7b68c 4e70d0d |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 |
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Biryani Hub Registration</title>
<link rel="stylesheet" href="{{ url_for('static', filename='styles.css') }}">
</head>
<body>
<div class="container">
<h1>Biryani Hub</h1>
<label for="name">Name:</label>
<input type="text" id="name" readonly>
<label for="email">Email:</label>
<input type="text" id="email" readonly>
<p id="status">Initializing...</p>
<audio id="audio-player" autoplay></audio>
</div>
<script>
async function playAudio(src) {
const audioPlayer = document.getElementById('audio-player');
audioPlayer.src = src;
await audioPlayer.play();
return new Promise(resolve => {
audioPlayer.onended = resolve;
});
}
async function requestMicrophonePermission() {
try {
await navigator.mediaDevices.getUserMedia({ audio: true });
console.log("Microphone access granted.");
} catch (err) {
alert("Microphone access denied. Please enable microphone permissions in your browser.");
}
}
async function recordAudio() {
try {
const stream = await navigator.mediaDevices.getUserMedia({ audio: true });
const mediaRecorder = new MediaRecorder(stream);
let audioChunks = [];
return new Promise(resolve => {
mediaRecorder.ondataavailable = event => {
audioChunks.push(event.data);
};
mediaRecorder.onstop = () => {
const audioBlob = new Blob(audioChunks, { type: 'audio/wav' });
resolve(audioBlob);
};
mediaRecorder.start();
setTimeout(() => mediaRecorder.stop(), 7000); // Record for 7 seconds
});
} catch (err) {
alert("Error accessing the microphone. Please check your browser settings.");
}
}
async function transcribeAudio(audioBlob) {
const formData = new FormData();
formData.append('audio', audioBlob, 'input.wav');
const response = await fetch('/transcribe', {
method: 'POST',
body: formData
});
const result = await response.json();
return result.text || "Error capturing speech.";
}
async function startInteraction() {
await requestMicrophonePermission();
const status = document.getElementById('status');
const nameInput = document.getElementById('name');
const emailInput = document.getElementById('email');
status.textContent = 'Playing welcome message...';
await playAudio('{{ url_for("static", filename="welcome.mp3") }}');
status.textContent = 'Asking for your name...';
await playAudio('{{ url_for("static", filename="ask_name.mp3") }}');
status.textContent = 'Listening for your name...';
const nameAudio = await recordAudio();
const nameText = await transcribeAudio(nameAudio);
nameInput.value = nameText;
status.textContent = 'Asking for your email...';
await playAudio('{{ url_for("static", filename="ask_email.mp3") }}');
status.textContent = 'Listening for your email...';
const emailAudio = await recordAudio();
const emailText = await transcribeAudio(emailAudio);
emailInput.value = emailText;
status.textContent = 'Playing thank you message...';
await playAudio('{{ url_for("static", filename="thank_you.mp3") }}');
status.textContent = 'Registration complete.';
}
window.onload = startInteraction;
</script>
</body>
</html>
|