const recordButton = document.getElementById('recordButton');
const audioPlayback = document.getElementById('audioPlayback');
const transcribeButton = document.getElementById('transcribeButton');
const transcriptionResult = document.getElementById('transcriptionResult');

let mediaRecorder;
let audioChunks = [];
let audioBlob;
let audioUrl;

const startRecording = async () => {
    const stream = await navigator.mediaDevices.getUserMedia({ audio: true });
    mediaRecorder = new MediaRecorder(stream);
    mediaRecorder.ondataavailable = event => audioChunks.push(event.data);
    mediaRecorder.onstop = () => {
        audioBlob = new Blob(audioChunks, { type: 'audio/wav' });
        audioUrl = URL.createObjectURL(audioBlob);
        audioPlayback.src = audioUrl;
        audioPlayback.style.display = 'block';
        transcribeButton.style.display = 'inline-block';
    };
    mediaRecorder.start();
    recordButton.classList.add('pulsing');
    recordButton.textContent = 'Stop Recording';
};

const stopRecording = () => {
    mediaRecorder.stop();
    recordButton.classList.remove('pulsing');
    recordButton.textContent = 'Start Recording';
};

const transcribeAudio = async () => {
    if (!audioBlob) return;

    const formData = new FormData();
    formData.append('audio', audioBlob, 'recording.wav');

    try {
        const response = await fetch('https://jikoni-semabox.hf.space/transcribe', {
            method: 'POST',
            body: formData
        });

        if (response.ok) {
            const result = await response.json();
            transcriptionResult.textContent = result.transcription || 'No transcription available.';
        } else {
            transcriptionResult.textContent = `Error: ${response.status}`;
        }
    } catch (error) {
        transcriptionResult.textContent = `Request failed: ${error.message}`;
    }
};

recordButton.addEventListener('click', () => {
    if (mediaRecorder && mediaRecorder.state === 'recording') {
        stopRecording();
    } else {
        startRecording();
    }
});

transcribeButton.addEventListener('click', transcribeAudio);