File size: 3,518 Bytes
4e70d0d
 
 
 
 
ff7b68c
4e70d0d
 
 
cb0a021
 
ff7b68c
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
cb0a021
ff7b68c
 
 
 
cb0a021
ff7b68c
 
 
cb0a021
ff7b68c
cb0a021
ff7b68c
 
4e70d0d
ff7b68c
 
 
 
 
 
 
a945a59
ff7b68c
 
 
a945a59
ff7b68c
 
 
 
a945a59
ff7b68c
 
 
a945a59
ff7b68c
 
 
 
a945a59
ff7b68c
 
a945a59
ff7b68c
 
4e70d0d
ff7b68c
 
 
 
4e70d0d
ff7b68c
 
4e70d0d
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
<!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 recordAudio() {
            const stream = await navigator.mediaDevices.getUserMedia({ audio: true });
            const mediaRecorder = new MediaRecorder(stream);
            const audioChunks = [];

            mediaRecorder.ondataavailable = event => {
                audioChunks.push(event.data);
            };

            mediaRecorder.start();

            await new Promise(resolve => setTimeout(resolve, 4000)); // Record for 4 seconds
            mediaRecorder.stop();

            return new Promise(resolve => {
                mediaRecorder.onstop = () => {
                    const audioBlob = new Blob(audioChunks, { type: 'audio/wav' });
                    resolve(audioBlob);
                };
            });
        }

        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 || 'Unable to transcribe audio.';
        }

        async function startInteraction() {
            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 = 'Recording 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 = 'Recording 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>