File size: 5,143 Bytes
97e7d36 6831f1f 6f6d855 eda8eea 6831f1f eda8eea 6831f1f a00c4d5 6831f1f 6f6d855 6831f1f 6f6d855 93161aa 6f6d855 6831f1f 6f6d855 a00c4d5 6f6d855 6831f1f 6f6d855 f5202db 6f6d855 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 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 |
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Parental Control</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"
const FETCH_TIMEOUT = 5000 // 5 seconds timeout
// Check server availability first
const controller = new AbortController()
const timeout = setTimeout(() => controller.abort(), FETCH_TIMEOUT)
fetch("./api/data", {
method: 'GET',
signal: controller.signal
})
.then(response => {
clearTimeout(timeout)
if (!response.ok) {
throw new Error(`Server check failed: ${response.status}`)
}
console.log('Server check successful')
setupAudioRecording()
})
.catch(error => {
clearTimeout(timeout)
const errorMessage = error.name === 'AbortError'
? 'Server request timed out. Please try again later.'
: 'Could not connect to the server. Please try again later.'
console.error('Server check failed:', error)
console.error(errorMessage)
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.')
console.error('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
const audioController = new AbortController()
const audioTimeout = setTimeout(() => audioController.abort(), FETCH_TIMEOUT)
fetch(serverUrl, {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify({
audio_chunk: base64Audio
}),
signal: audioController.signal
}).then(response => {
clearTimeout(audioTimeout)
console.log('Audio chunk sent successfully')
}).catch(error => {
clearTimeout(audioTimeout)
console.error('Error sending audio chunk:', error)
})
}
}
// Start recording in intervals
const chunkInterval = 700 // 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> |