File size: 4,357 Bytes
97e7d36 6831f1f eda8eea 6831f1f eda8eea 6831f1f af326b7 6831f1f af326b7 6831f1f af326b7 6831f1f af326b7 6831f1f af326b7 6831f1f af326b7 6831f1f af326b7 6831f1f af326b7 6831f1f |
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 |
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Godot Export with Audio Recording</title>
<style>
html,
body {
margin: 0;
padding: 0;
width: 100%;
height: 100%;
overflow: hidden;
}
iframe {
width: 100%;
height: 100%;
border: none;
display: block;
}
</style>
</head>
<body>
<!-- Iframe for the Godot export -->
<iframe src="godot/index.html"></iframe>
<script>
// URL of the server to send audio chunks
const serverUrl = "./api/process"
// Check server availability first
fetch("./api/data", {
method: 'GET'
})
.then(response => {
if (!response.ok) {
throw new Error(`Server check failed: ${response.status}`)
}
console.log('Server check successful')
setupAudioRecording()
})
.catch(error => {
console.error('Server check failed:', error)
alert('Could not connect to the server. Please try again later.')
throw error
})
// Move existing audio setup into a function
function setupAudioRecording() {
// Check if browser supports audio recording
if (!navigator.mediaDevices?.getUserMedia) {
console.error('Your browser does not support audio recording.')
alert('Your browser does not support audio recording. Please try using a modern browser like Chrome, Firefox, or Edge.')
throw new Error('Audio recording not supported')
}
navigator.mediaDevices.getUserMedia({ audio: true })
.then(stream => {
const audioContext = new (window.AudioContext || window.webkitAudioContext)()
const mediaRecorder = new MediaRecorder(stream)
const audioChunks = []
mediaRecorder.ondataavailable = event => {
audioChunks.push(event.data)
}
mediaRecorder.onstop = () => {
const audioBlob = new Blob(audioChunks, { type: 'audio/webm' })
audioChunks.length = 0 // Clear chunks after creating the Blob
// Convert Blob to base64
const reader = new FileReader()
reader.readAsDataURL(audioBlob)
reader.onloadend = () => {
// Extract the base64 data (remove the data URL prefix)
const base64Audio = reader.result.split(',')[1]
// Send as JSON with base64-encoded audio
fetch(serverUrl, {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify({
audio_chunk: base64Audio
})
}).then(response => {
console.log('Audio chunk sent successfully')
}).catch(error => {
console.error('Error sending audio chunk:', error)
})
}
}
// Start recording in intervals
const chunkInterval = 300 // Chunk duration in milliseconds
setInterval(() => {
if (mediaRecorder.state === 'recording') {
mediaRecorder.stop()
mediaRecorder.start()
} else {
mediaRecorder.start()
}
}, chunkInterval)
})
.catch(error => {
console.error('Error accessing microphone:', error)
})
}
</script>
</body>
</html> |