From 28468a596fb390de8c5e915120ae6192e1f578f0 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?M=C3=A1rio=20Panenko?= <mario.panenko@student.tuke.sk>
Date: Sat, 23 Nov 2024 14:59:41 +0000
Subject: [PATCH] funguje

---
 scripts/videoplayer.js | 23 ++++++++++++++---------
 1 file changed, 14 insertions(+), 9 deletions(-)

diff --git a/scripts/videoplayer.js b/scripts/videoplayer.js
index 72b95c2..cfd7ffd 100644
--- a/scripts/videoplayer.js
+++ b/scripts/videoplayer.js
@@ -103,22 +103,27 @@ async function loadVideoSequenceByLetters() {
     currentIndex = 0;
 }
 
-// Function to highlight the current word or letter
+// Function to highlight the current word or letter in the textarea
 function highlightCurrentText(index) {
     let wordsOrLetters = currentTranslationMode === 'words' ? inputText.value.trim().split(' ') : inputText.value.trim().split('');
 
-    // Reset the text content and remove previous highlights
-    inputText.innerHTML = '';
+    // Reset the highlighted text in the textarea
+    inputText.value = '';
+    inputText.setSelectionRange(0, 0);
 
-    // Rebuild the text content with highlighting
+    let startIndex = 0;
     wordsOrLetters.forEach((item, i) => {
-        const span = document.createElement('span');
-        span.textContent = item + (currentTranslationMode === 'words' ? ' ' : '');
-        if (i === index) {
-            span.classList.add('highlight');
+        if (i < index) {
+            startIndex += item.length + (currentTranslationMode === 'words' ? 1 : 0);
         }
-        inputText.appendChild(span);
     });
+
+    let endIndex = startIndex + wordsOrLetters[index].length;
+    inputText.value = wordsOrLetters.join(currentTranslationMode === 'words' ? ' ' : '');
+
+    // Highlight the current word or letter
+    inputText.setSelectionRange(startIndex, endIndex);
+    inputText.focus();
 }
 
 // Function to play video at a specific index