const startRecordingButton = document.getElementById('startRecording'); const imageUploadingButton = document.getElementById('imageUpload') const isAgreed = localStorage.getItem('privacyPolicy') !== null; const privacyPolicyPopup = document.getElementById('privacyPolicyPopup') if (!isAgreed){ setTimeout(showPrivacyPolicy, 1500); } function agreePrivacyPolicy() { localStorage.setItem('privacyPolicy', 'True') privacyPolicyPopup.style.visibility = 'hidden' } function showPrivacyPolicy() { privacyPolicyPopup.style.visibility = 'visible' } // let stream; // let ws // let silenceDetectorNode; // let silenceCount = 0 // let recording = false; // let mediaRecorder; // let continuousRecorder // let audioContext; // let source; // let currentAudioChunks = []; // let allAudioChunks = []; // const uuid = generateUUID() // // startRecordingButton.addEventListener('click', async () => { // if (!recording) { // if (mediaRecorder && mediaRecorder.state !== 'inactive') { // mediaRecorder.stop(); // } // transcriptionReportBlock.innerText = '' // ws = new WebSocket(`ws://localhost:8000/ws/${uuid}`); // ws.onclose = (event) => { // if (mediaRecorder && mediaRecorder.state !== 'inactive') { // mediaRecorder.stop(); // } // } // ws.onerror = (error) => { // alert('Something was wrong. Try again later.') // console.log(error) // window.location.reload() // }; // ws.onmessage = (event) => { // const response = event.data // console.log(response) // if (response === 'ZmluaXNoZWQ=') { // ws.close() // ws = undefined // } else if (response.startsWith('aW1wcm92ZQ')) { // transcriptionReportBlock.innerText = response.replace('aW1wcm92ZQ', '') // } else if (response === 'aW1ycG92aW5nIHRoZSBxdWFsaXR5') { // transcriptionReportBlock.innerText = 'I am improving the quality of transcription. Please wait a bit.' // } else { // transcriptionReportBlock.innerText += ` ${response}` // } // } // // startRecordingButton.innerHTML = 'Stop recording'; // try { // stream = await navigator.mediaDevices.getUserMedia({audio: true, video: false}); // audioContext = new AudioContext(); // await audioContext.audioWorklet.addModule('../../../static/js/audio-processor.js'); // путь к файлу процессора // silenceDetectorNode = new AudioWorkletNode(audioContext, 'silence-detector-processor'); // silenceDetectorNode.port.onmessage = (event) => { // if (event.data.type === 'silence') { // if (currentAudioChunks.length > 0) { // if (silenceCount === 0) { // silenceCount += 1; // restartMediaRecorder(); // } // } // } else if (event.data.type === 'sound') { // silenceCount = 0; // } // }; // source = audioContext.createMediaStreamSource(stream); // mediaRecorder = new MediaRecorder(stream); // mediaRecorder.start(1000); // mediaRecorder.ondataavailable = event => { // currentAudioChunks.push(event.data); // }; // source.connect(silenceDetectorNode).connect(audioContext.destination); // continuousRecorder = new MediaRecorder(stream); // continuousRecorder.start(); // continuousRecorder.ondataavailable = event => { // allAudioChunks.push(event.data); // }; // recording = true; // } catch (error) { // console.error('Access to microphone denied:', error); // } // } else { // stopRecording(); // } // }); // // function stopRecording() { // startRecordingButton.innerHTML = 'Start recording'; // recording = false; // mediaRecorder.stop(); // continuousRecorder.stop(); // silenceDetectorNode.disconnect(); // source.disconnect(); // audioContext.close(); // // if (currentAudioChunks.length > 0) { // sendAudioToServer(new Blob(currentAudioChunks, {type: 'audio/wav'}), true); // // } // currentAudioChunks = []; // } // // function sendAudioToServer(audioBlob, finished = false) { // return new Promise((resolve, reject) => { // let fullAudio = '' // console.log("Sending audio to server...", audioBlob); // const reader = new FileReader(); // reader.readAsDataURL(audioBlob); // reader.onloadend = () => { // let base64String = reader.result; // base64String = base64String.split(',')[1]; // if (!finished && base64String) { // const dataWS = {'audio': base64String, 'finished': finished, 'full_audio': fullAudio}; // ws.send(JSON.stringify(dataWS)); // resolve(); // } else { // const fullAudioBlob = new Blob(allAudioChunks, {type: 'audio/wav'}) // const fullReader = new FileReader() // fullReader.readAsDataURL(fullAudioBlob) // fullReader.onloadend = () => { // let fullBase64String = fullReader.result // fullBase64String = fullBase64String.split(',')[1] // const dataWS = {'audio': base64String, 'finished': finished, 'full_audio': fullBase64String}; // console.log(dataWS) // ws.send(JSON.stringify(dataWS)); // allAudioChunks = [] // resolve() // } // fullReader.onerror = reject // } // }; // reader.onerror = reject; // }); // } // // // async function restartMediaRecorder() { // if (mediaRecorder && mediaRecorder.state !== 'inactive') { // mediaRecorder.stop(); // } // await sendAudioToServer(new Blob(currentAudioChunks, {type: 'audio/wav'})); // currentAudioChunks = []; // mediaRecorder = new MediaRecorder(stream); // mediaRecorder.start(1000); // mediaRecorder.ondataavailable = event => { // currentAudioChunks.push(event.data); // }; // } let mediaRecorder; let audioChunks = []; if (!navigator.mediaDevices || !navigator.mediaDevices.getUserMedia) { alert('Your browser does not support the required media devices.'); } startRecordingButton.addEventListener('click', () => { if (mediaRecorder) { if (mediaRecorder.state === 'recording') { mediaRecorder.stop(); startRecordingButton.innerHTML = ``; } else { transcriptionReportBlock.innerText = '' startRecording(); } } else { transcriptionReportBlock.innerText = '' startRecording(); } }); function startRecording() { navigator.mediaDevices.getUserMedia({audio: true}) .then(stream => { mediaRecorder = new MediaRecorder(stream); mediaRecorder.ondataavailable = event => { audioChunks.push(event.data); }; mediaRecorder.onstop = sendAudioToServer; mediaRecorder.start(); startRecordingButton.textContent = 'Stop Recording'; }) .catch(error => { console.error('Error accessing the microphone', error); }); } function sendAudioToServer() { makeLoading() const audioBlob = new Blob(audioChunks, {type: 'audio/wav'}); const reader = new FileReader(); reader.readAsDataURL(audioBlob); reader.onloadend = () => { let base64String = reader.result; base64String = base64String.split(',')[1]; fetch('/transcript-record', { method: 'POST', credentials: 'include', headers: {'Content-Type': 'application/json'}, body: JSON.stringify({'audio': base64String}), }).then(response => { if (response.ok) { return response.json(); } throw new Error('Network response was not ok.'); }).then(data => { transcriptionReportBlock.textContent = data; reloadVoices() }).catch(error => { alert('There are problems. Contact customer support'); stopLoading() }); audioChunks = []; }; } imageUploadingButton.addEventListener('click', function () { const imageRecordIDs = []; const records = document.getElementsByClassName('record'); for (let i = 0; i < records.length; i++) { const recordID = records[i].getAttribute('record-id'); const objectType = records[i].getAttribute('object-type'); if (objectType === 'image') { imageRecordIDs.push(recordID); } } if (imageRecordIDs.length >= 12) { alert('You cannot upload more than 12 images'); return } const fileInput = document.createElement('input'); fileInput.type = 'file'; fileInput.accept = 'image/*'; fileInput.onchange = e => { const file = e.target.files[0]; const formData = new FormData(); formData.append('image', file); makeLoading() fetch('/upload-image', { method: 'POST', body: formData, }) .then(response => response.json()) .then(data => { stopLoading() transcriptionReportBlock.innerHTML = marked.parse(data) reloadVoices() }) .catch((error) => { alert('Something was wrong') console.log(error) stopLoading() }); }; fileInput.click(); });