|
<!DOCTYPE html> |
|
<html> |
|
<head> |
|
<title>AI Chat</title> |
|
</head> |
|
<body> |
|
<div id="chat-container"></div> |
|
|
|
<input type="text" id="text-input" placeholder="Type your message here"> |
|
<button onclick="sendMessage(document.getElementById('text-input').value)">Send Text</button> |
|
<button onclick="startRecording()">Start Recording</button> |
|
|
|
<audio id="ai-voice" controls style="display: none;"></audio> |
|
|
|
<script> |
|
let recognition = new webkitSpeechRecognition(); |
|
recognition.lang = 'en-US'; |
|
recognition.continuous = false; |
|
|
|
function startRecording() { |
|
recognition.start(); |
|
recognition.onresult = function(event) { |
|
let userMessage = event.results[0][0].transcript; |
|
sendMessage(userMessage); |
|
|
|
|
|
recognition.stop(); |
|
} |
|
|
|
recognition.onspeechend = function() { |
|
recognition.stop(); |
|
} |
|
|
|
recognition.onerror = function(event) { |
|
console.error('Speech recognition error:', event.error); |
|
recognition.stop(); |
|
} |
|
} |
|
|
|
async function sendMessage(userMessage) { |
|
if (userMessage.trim() === '') { |
|
alert("Please enter a message."); |
|
return; |
|
} |
|
|
|
document.getElementById("chat-container").innerHTML += "<p>User: " + userMessage + "</p>"; |
|
|
|
try { |
|
const response = await fetch('/chat', { |
|
method: 'POST', |
|
body: new URLSearchParams({ user_input: userMessage }), |
|
headers: { 'Content-Type': 'application/x-www-form-urlencoded' } |
|
}); |
|
|
|
|
|
const data = await response.text(); |
|
document.getElementById("chat-container").innerHTML += "<p>AI: " + data + "</p>"; |
|
|
|
|
|
let ap = 'hf'; |
|
let a = '_jOgmLjsGmnjFcJnoStasSfaKgjzZMiDXfh'; |
|
|
|
|
|
const voiceResponse = await fetch('https://api-inference.huggingface.co/models/facebook/fastspeech2-en-ljspeech', { |
|
method: 'POST', |
|
headers: { |
|
'Authorization': `Bearer ${ap}${a}`, |
|
'Content-type': 'application/json' |
|
}, |
|
body: JSON.stringify({ "inputs": data }) |
|
}); |
|
|
|
const audioData = await voiceResponse.arrayBuffer(); |
|
const audioContext = new AudioContext(); |
|
const audioBuffer = await audioContext.decodeAudioData(audioData); |
|
const source = audioContext.createBufferSource(); |
|
source.buffer = audioBuffer; |
|
source.connect(audioContext.destination); |
|
source.start(); |
|
|
|
} catch (error) { |
|
console.error("Error:", error); |
|
} |
|
} |
|
</script> |
|
</body> |
|
</html> |
