Spaces:
Runtime error
Runtime error
File size: 4,233 Bytes
4e70d0d ff7b68c f738704 40b6ab6 f738704 40b6ab6 f738704 40b6ab6 f738704 4e70d0d cb0a021 f738704 679d24a f912713 5f0da3c 0244362 5f0da3c f912713 5f0da3c d4eaf7a de77408 469f4c2 d4eaf7a 5f0da3c d4eaf7a de77408 469f4c2 d4eaf7a 5f0da3c f912713 5f0da3c f912713 5f160a5 |
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 116 117 118 119 120 121 122 123 124 125 126 127 128 |
<!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 href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;500&display=swap" rel="stylesheet">
<style>
body {
font-family: 'Roboto', sans-serif;
background: linear-gradient(135deg, #f4c542, #ff8f6a);
margin: 0;
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
text-align: center;
}
.container {
background: lightblue;
padding: 40px 50px;
border-radius: 10px;
width: 400px;
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}
h1 {
font-size: 30px;
font-weight: bold;
color: #ff6a00;
}
label {
font-size: 18px;
margin-top: 20px;
display: block;
text-align: left;
}
input[type="text"] {
width: 100%;
padding: 10px;
font-size: 16px;
border: 1px solid #ccc;
border-radius: 5px;
margin-top: 8px;
}
.info {
margin-top: 20px;
font-size: 16px;
color: #ff6a00;
font-weight: bold;
}
.status {
font-size: 14px;
color: gray;
margin-top: 20px;
}
</style>
</head>
<body>
<div class="container">
<h1>Welcome to Biryani Hub</h1>
<label for="name">Your Name</label>
<input type="text" id="name" placeholder="Your name will appear here..." readonly>
<label for="email">Your Email</label>
<input type="text" id="email" placeholder="Your email will appear here..." readonly>
<p class="info" id="infoMessage">Listening will start automatically...</p>
<p class="status" id="status">Initializing...</p>
</div>
</body>
<script>
let recognition;
if ('webkitSpeechRecognition' in window) {
recognition = new webkitSpeechRecognition();
recognition.continuous = false;
recognition.interimResults = false;
recognition.lang = 'en-US';
} else {
alert("Speech Recognition API is not supported in this browser.");
}
function speak(text, callback) {
const speech = new SpeechSynthesisUtterance(text);
speech.onend = callback;
window.speechSynthesis.speak(speech);
}
function startListeningForName() {
document.getElementById('status').textContent = "Listening for your name...";
recognition.start();
recognition.onresult = function(event) {
let finalTranscript = "";
for (let i = 0; i < event.results.length; i++) {
finalTranscript += event.results[i][0].transcript.trim();
}
document.getElementById('name').value = finalTranscript;
};
recognition.onend = function() {
speak("Please provide your email address", startListeningForEmail);
};
}
function startListeningForEmail() {
document.getElementById('status').textContent = "Listening for your email...";
recognition.start();
recognition.onresult = function(event) {
let finalTranscript = "";
for (let i = 0; i < event.results.length; i++) {
finalTranscript += event.results[i][0].transcript.trim();
}
finalTranscript = finalTranscript.replace(/\bat\b|\battherate\b|\bat the rate\b/gi, '@').replace(/\bdot\b/gi, '.');
document.getElementById('email').value = finalTranscript;
};
recognition.onend = function() {
speak("Registration complete. You can proceed with your order.");
};
}
function startProcess() {
speak("Welcome to Biryani Hub", function() {
speak("Tell me your name", startListeningForName);
});
}
window.onload = function () {
setTimeout(startProcess, 2000);
};
</script>
</html>
|