File size: 4,288 Bytes
9b2050e
 
64745dd
 
35c66c7
9b2050e
 
690a40d
9b2050e
 
 
 
 
 
 
690a40d
9b2050e
 
690a40d
35c66c7
64745dd
9b2050e
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
690a40d
 
 
9b2050e
64745dd
9b2050e
 
 
 
64745dd
9b2050e
 
 
 
 
 
 
 
64745dd
9b2050e
 
 
64745dd
9b2050e
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
6f89e0d
64745dd
 
9b2050e
 
 
64745dd
9b2050e
 
 
 
 
 
 
 
 
 
 
 
64745dd
9b2050e
690a40d
9b2050e
 
 
 
 
146b13d
9b2050e
 
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
let transcriber, generator;
let isRecording = false;
let mediaRecorder;
let audioChunks = [];

// Initialize models
async function initializeModels() {
    try {
        console.log("Loading transcriber model...");
        transcriber = await pipeline('automatic-speech-recognition', 'Xenova/whisper-tiny.en');
        console.log("Transcriber model loaded successfully:", transcriber);

        console.log("Loading generator model...");
        generator = await pipeline('text2text-generation', 'Xenova/LaMini-Flan-T5-783M');
        console.log("Generator model loaded successfully:", generator);
    } catch (error) {
        console.error("Error loading models:", error);
        displayMessage("Error loading models.", 'bot-message');
    }
}

// Display message in the chat container
function displayMessage(message, className) {
    const messageElement = document.createElement('div');
    messageElement.className = className;
    messageElement.innerText = message;
    document.getElementById('chat-container').appendChild(messageElement);
    document.getElementById('chat-container').scrollTop = document.getElementById('chat-container').scrollHeight;
}

// Handle user text input
async function handleUserInput() {
    const userInput = document.getElementById('user-input').value.trim();
    if (!userInput) return;
    
    displayMessage("You: " + userInput, 'user-message');
    document.getElementById('user-input').value = "";

    await generateResponse(userInput);
}

// Toggle recording
async function toggleRecording() {
    isRecording = !isRecording;

    if (isRecording) {
        document.getElementById('record-button').innerText = "⏹️"; // Change to Stop icon
        startRecording();
    } else {
        document.getElementById('record-button').innerText = "🎙️"; // Change to Mic icon
        stopRecording();
    }
}

// Start audio recording
async function startRecording() {
    try {
        const stream = await navigator.mediaDevices.getUserMedia({ audio: true });
        mediaRecorder = new MediaRecorder(stream);
        audioChunks = [];

        mediaRecorder.ondataavailable = event => audioChunks.push(event.data);
        mediaRecorder.start();
        console.log("Recording started.");
    } catch (error) {
        console.error("Error starting recording:", error);
        displayMessage("Error starting recording.", 'bot-message');
    }
}

// Stop recording and transcribe
async function stopRecording() {
    mediaRecorder.stop();
    mediaRecorder.onstop = async () => {
        const audioBlob = new Blob(audioChunks);
        const url = URL.createObjectURL(audioBlob);

        try {
            console.log("Transcribing audio...");
            const result = await transcriber(url);
            const transcribedText = result?.text || "Error in transcription.";
            console.log("Transcription result:", transcribedText);

            // Display transcribed text
            displayMessage("You (voice): " + transcribedText, 'user-message');

            // Generate response based on transcribed text
            await generateResponse(transcribedText);
        } catch (error) {
            console.error("Error in transcription:", error);
            displayMessage("Error in transcription.", 'bot-message');
        }
    };
}

// Generate a response using text generation model
async function generateResponse(inputText) {
    console.log("Generating response for input:", inputText);

    try {
        console.log("Input text before sending to generator:", inputText);
        
        const result = await generator(inputText, { max_new_tokens: 100 });
        const generatedText = result;
        console.log("Generated response text:", generatedText);

        displayMessage("Bot: " + generatedText, 'bot-message');
        speakText(generatedText);
    } catch (error) {
        console.error("Error in response generation:", error);
        displayMessage("Error in response generation: " + error.message, 'bot-message');
    }
}

// Speak the generated text
function speakText(text) {
    const utterance = new SpeechSynthesisUtterance(text);
    window.speechSynthesis.speak(utterance);
}

// Initialize models when the page loads
window.addEventListener("DOMContentLoaded", initializeModels);