Javascript 30 - Gün 20

<div class="words" contenteditable>
</div>

<script>
window.SpeechRecognition = window.SpeechRecognition || window.webkitSpeechRecognition;
 
const recognition = new SpeechRecognition();
recognition.interimResults = true;
// tanıma dilini Türkçe ayarlayalım
recognition.lang = 'tr-TR';
 
let p = document.createElement('p');
const words = document.querySelector('.words');
words.appendChild(p);
 
 
//herhangi bir kelime tanındığında tetiklenecek olay
recognition.addEventListener('result', e => {
  //tanınan konuşma parçalarını birleştirerek tek bir stringe dönüştürür
  const transcript =[...e.results] 
    .map(result => result[0])
    .map(result => result.transcript)
    .join('');
 
  //oluşturulan metindeki 'kalp' kelimelerini kalp emojisiyle değiştirir
    const filteredTranscript = transcript.replaceAll('kalp','❤️');
  // oluşturulan metin paragraf elementine eklenir
    p.textContent = filteredTranscript;
 
  //eğer konuşma tamamnlandıysa paragrafı oluşturup sayfaya ekleyelim
  // konuşmanın tamamlandığını isFinal değeriyle kontrol ediyoruz
    if (e.results[0].isFinal) {
      p = document.createElement('p');
      words.appendChild(p);
    }
});
 
// tanıma işlemi bittiğinde tekrardan dinlemeyi başlatıyoruz
recognition.addEventListener('end', recognition.start);
 
// konuşma işlemini sayfa açıldığında başlatıyoruz
recognition.start();
 
</script>