Update Script_Speech_recognition/speech_recognition.js

This commit is contained in:
Mário Panenko 2024-10-21 10:04:20 +00:00
parent cf4d2f60ce
commit 956abd7348

View File

@ -1,100 +1,120 @@
document.addEventListener('DOMContentLoaded', function() { document.addEventListener('DOMContentLoaded', function() {
const themeToggleBtn = document.getElementById('themeToggleBtn');
const body = document.body;
const h1 = document.querySelector('h1');
const textareas = document.querySelectorAll('textarea');
const startBtn = document.getElementById('startBtn');
const timerDisplay = document.getElementById('timerDisplay');
const statusText = document.getElementById('statusText');
themeToggleBtn.addEventListener('click', function() {
// Toggle dark mode classes on different elements
body.classList.toggle('dark-mode');
h1.classList.toggle('dark-mode');
textareas.forEach(textarea => textarea.classList.toggle('dark-mode'));
startBtn.classList.toggle('dark-mode');
timerDisplay.classList.toggle('dark-mode');
statusText.classList.toggle('dark-mode');
// Update the icon based on the mode
if (body.classList.contains('dark-mode')) {
themeToggleBtn.textContent = '🌜'; // Moon icon for dark mode
} else {
themeToggleBtn.textContent = '🌞'; // Sun icon for light mode
}
});
// Speech recognition functionality
if ('SpeechRecognition' in window || 'webkitSpeechRecognition' in window) { if ('SpeechRecognition' in window || 'webkitSpeechRecognition' in window) {
const recognition = new (window.SpeechRecognition || window.webkitSpeechRecognition)(); const recognition = new (window.SpeechRecognition || window.webkitSpeechRecognition)();
recognition.lang = 'sk-SK'; // Nastavenie jazyka recognition.lang = 'sk-SK'; // Set language to Slovak
recognition.interimResults = true; recognition.interimResults = true;
recognition.maxAlternatives = 1; recognition.maxAlternatives = 1;
recognition.continuous = true; recognition.continuous = true;
let recognizing = false; // Stavová premenná, či beží rozpoznávanie let recognizing = false; // Recognition state
let startTime; // Na ukladanie času začiatku nahrávania let startTime; // To store start time of recording
let timerInterval; // Interval na časovač let timerInterval; // For the timer
let transcriptHistory = []; // Na dočasné uloženie textových nahrávok let transcriptHistory = []; // Store transcripts
const startBtn = document.getElementById('startBtn'); // Start/stop speech recognition with button
const statusText = document.getElementById('statusText');
const timerDisplay = document.getElementById('timerDisplay'); // Element pre zobrazovanie času
const inputText = document.getElementById('inputText'); // Textové pole na výsledky
// Funkcia pre spustenie časovača
function startTimer() {
startTime = Date.now();
timerInterval = setInterval(() => {
const elapsedTime = Math.floor((Date.now() - startTime) / 1000);
timerDisplay.textContent = `${elapsedTime}s`; // Zobrazenie počtu sekúnd
}, 1000); // Aktualizácia každú sekundu
}
// Funkcia pre zastavenie časovača
function stopTimer() {
clearInterval(timerInterval);
timerDisplay.textContent = ''; // Vymaže sa čas po zastavení nahrávania
}
// Po stlačení tlačidla začne alebo zastaví rozpoznávanie reči
startBtn.onclick = () => { startBtn.onclick = () => {
if (!recognizing) { if (!recognizing) {
recognition.start(); recognition.start();
recognizing = true; recognizing = true;
console.log('Čaká sa na povolenie mikrofónu...'); console.log('Waiting for microphone permission...');
startBtn.textContent = "🛑 Nahrávanie..."; // Zmena textu na "Nahrávanie..." startBtn.textContent = "🛑 Nahrávanie..."; // Button shows "Recording..."
statusText.textContent = "Nahrávanie prebieha..."; statusText.textContent = "Nahrávanie prebieha...";
} else { } else {
recognition.stop(); recognition.stop();
recognizing = false; recognizing = false;
console.log('Rozpoznávanie reči zastavené'); console.log('Speech recognition stopped');
startBtn.textContent = "🎤"; // Obnova textu na "Pripravený na nahrávanie" startBtn.textContent = "🎤"; // Button returns to original state
statusText.textContent = "Nahrávanie ukončené."; statusText.textContent = "Nahrávanie ukončené.";
stopTimer(); // Zastavenie časovača stopTimer(); // Stop timer
} }
}; };
// Spustenie po povolení a začatí rozpoznávania // Timer function
function startTimer() {
startTime = Date.now();
timerInterval = setInterval(() => {
const elapsedTime = Math.floor((Date.now() - startTime) / 1000);
timerDisplay.textContent = `${elapsedTime}s`; // Display elapsed time
}, 1000); // Update every second
}
function stopTimer() {
clearInterval(timerInterval);
timerDisplay.textContent = ''; // Clear the timer display
}
// When recognition starts
recognition.onstart = function() { recognition.onstart = function() {
console.log('Rozpoznávanie reči začalo'); console.log('Speech recognition started');
startTimer(); // Spustenie časovača po začatí nahrávania startTimer(); // Start the timer
statusText.textContent = "Nahrávanie prebieha..."; // Stav počas nahrávania statusText.textContent = "Nahrávanie prebieha..."; // Recording status
}; };
// Výsledok rozpoznávania // Handling the results of speech recognition
recognition.onresult = function(event) { recognition.onresult = function(event) {
let interimTranscript = ''; // Zmeníme na zobrazenie medzivýsledkov let interimTranscript = ''; // To display interim results
for (let i = event.resultIndex; i < event.results.length; i++) { for (let i = event.resultIndex; i < event.results.length; i++) {
const transcript = event.results[i][0].transcript; const transcript = event.results[i][0].transcript;
// Ak je to medzivýsledok, zobraz ho, ale neulož
if (event.results[i].isFinal) { if (event.results[i].isFinal) {
transcriptHistory.push(transcript); transcriptHistory.push(transcript);
inputText.value += transcript + ' '; // Pridanie rozpoznaného textu inputText.value += transcript + ' '; // Append final transcript to text area
} else { } else {
interimTranscript += transcript; interimTranscript += transcript; // Update interim transcript
} }
} }
// Zobrazenie medzivýsledkov, kým nie sú konečné // Show interim results combined with final results
inputText.value = transcriptHistory.join(' ') + ' ' + interimTranscript; inputText.value = transcriptHistory.join(' ') + ' ' + interimTranscript;
}; };
// When recognition ends
recognition.onend = function() { recognition.onend = function() {
// Ak bol mikrofón manuálne zastavený
if (!recognizing) { if (!recognizing) {
recognizing = false; recognizing = false;
console.log('Rozpoznávanie reči ukončené'); console.log('Speech recognition ended');
stopTimer(); stopTimer();
startBtn.textContent = "🎤"; // Obnova textu startBtn.textContent = "🎤"; // Restore button to original state
statusText.textContent = "Nahrávanie ukončené."; // Zmena stavu po ukončení statusText.textContent = "Nahrávanie ukončené."; // Update status text
} else { } else {
// Automaticky znovu spustí rozpoznávanie, ak nebolo zastavené manuálne recognition.start(); // Auto-restart recognition if not manually stopped
recognition.start();
}
} }
};
// Handle recognition errors
recognition.onerror = function(event) { recognition.onerror = function(event) {
console.error('Chyba pri rozpoznávaní reči:', event.error); console.error('Speech recognition error:', event.error);
recognizing = false; // V prípade chyby, zastav rozpoznávanie recognizing = false; // Stop recognition on error
stopTimer(); // Zastav časovač aj pri chybe stopTimer(); // Stop timer
startBtn.textContent = "🎤"; // Obnova textu startBtn.textContent = "🎤"; // Restore button to original state
statusText.textContent = "Chyba pri nahrávaní. Skúste znova."; // Zobrazenie chyby statusText.textContent = "Chyba pri nahrávaní. Skúste znova."; // Display error status
}; };
} else { } else {
alert('Tento prehliadač nepodporuje rozpoznávanie reči.'); alert('Tento prehliadač nepodporuje rozpoznávanie reči.');