Highligh filename when clicked

templates/recounting.html

@@ -502,9 +502,6 @@ function applyState(data) {
     loadBatchResult(data.file);
   }
 
-  loadFiles();
-}
-
 // --- File list ---
 
 async function loadFiles() {
@@ -535,7 +532,7 @@ async function loadFiles() {
             if (str) cls += ' streaming';
             else if (sel) cls += ' selected';
             return `
-              <div class="${cls}" onclick="event.stopPropagation(); selectFile('${f.path.replace(/'/g, "\\'")}', '${f.name.replace(/'/g, "\\'")}')">
+              <div class="${cls}" onclick="event.stopPropagation(); selectFile('${f.path.replace(/'/g, "\\'")}', '${f.name.replace(/'/g, "\\'")}')" data-path="${f.path.replace(/"/g, '&quot;')}">
                 <span class="fi-icon">${str ? '&#9673;' : '&#9654;'}</span>
                 <span class="fi-name">${f.name}</span>
                 <span class="fi-size">${formatSize(f.size)}</span>
@@ -568,16 +565,27 @@ function selectFile(path, name) {
     document.getElementById('live-time').textContent = '--';
     document.getElementById('live-status').textContent = 'no file selected';
     document.getElementById('live-status').className = 'counter-status disconnected';
-    loadFiles();
+    updateFileSelection();
     return;
   }
   selectedFile = path;
   document.getElementById('btn-download').disabled = false;
   if (!streaming) document.getElementById('btn-start').disabled = false;
-  loadFiles();
+  updateFileSelection();
   loadBatchResult(path);
 }
 
+function updateFileSelection() {
+  document.querySelectorAll('.file-item').forEach(el => {
+    const path = el.getAttribute('data-path');
+    if (path === selectedFile) {
+      el.classList.add('selected');
+    } else {
+      el.classList.remove('selected');
+    }
+  });
+}
+
 let batchResultLoaded = false;
 
 async function loadBatchResult(filePath) {