From e7c66d938123e416811eca37ab82a9c3b9888306 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=C3=9Cmit=20Tun=C3=A7?= <umitreva@gmail.com>
Date: Thu, 28 May 2026 07:46:01 +0300
Subject: [PATCH] feat: implement renderer logic for format selection,
 dependency management, and i18n support

---
 src/index.html  |  13 +++---
 src/renderer.js | 106 +++++++++++++++++++++++++++++++++++-------------
 2 files changed, 85 insertions(+), 34 deletions(-)

diff --git a/src/index.html b/src/index.html
index 70c8289..510d0ae 100644
--- a/src/index.html
+++ b/src/index.html
@@ -163,11 +163,11 @@
           <span class="summary-stat-label" data-i18n="summary_total_tracks">Toplam Dosya:</span>
           <span id="summary-total-count" class="summary-stat-value">0</span>
         </div>
-        <div class="summary-stat-item">
+        <div class="summary-stat-item" id="summary-item-duration">
           <span class="summary-stat-label" data-i18n="summary_total_duration">Toplam Süre:</span>
           <span id="summary-total-duration" class="summary-stat-value">0 sn</span>
         </div>
-        <div class="summary-stat-item summary-stat-speed-item">
+        <div class="summary-stat-item summary-stat-speed-item" id="summary-item-speed">
           <span class="summary-stat-label" data-i18n="summary_speed_label">Hız:</span>
           <select id="summary-speed-select" class="summary-speed-select">
             <option value="100">100 Mbps (Fiber)</option>
@@ -177,11 +177,11 @@
             <option value="8">8 Mbps (Temel)</option>
           </select>
         </div>
-        <div class="summary-stat-item">
+        <div class="summary-stat-item" id="summary-item-size">
           <span class="summary-stat-label" data-i18n="summary_est_size">Tahmini Boyut:</span>
           <span id="summary-est-size" class="summary-stat-value">0 MB</span>
         </div>
-        <div class="summary-stat-item">
+        <div class="summary-stat-item" id="summary-item-time">
           <span class="summary-stat-label" data-i18n="summary_est_time">Tahmini Süre:</span>
           <span id="summary-est-time" class="summary-stat-value">~0 sn</span>
         </div>
@@ -225,7 +225,10 @@
               <div class="progress-bar-container">
                 <div id="download-progress-bar" class="progress-bar-fill" style="width: 0%"></div>
               </div>
-              <p id="download-subtext" class="subtext">Lütfen bekleyin...</p>
+              <div class="progress-footer" style="display: flex; justify-content: space-between; align-items: center; margin-top: 4px;">
+                <p id="download-subtext" class="subtext" style="margin-top: 0;">Lütfen bekleyin...</p>
+                <p id="download-overall-status" class="subtext" style="margin-top: 0; font-weight: 600; color: #00dfd8;"></p>
+              </div>
             </div>
 
             <button id="download-btn" class="glow-button full-width">
diff --git a/src/renderer.js b/src/renderer.js
index 575d6a6..f71eb4b 100644
--- a/src/renderer.js
+++ b/src/renderer.js
@@ -30,6 +30,7 @@ const downloadStatus = document.getElementById('download-status');
 const downloadPercent = document.getElementById('download-percent');
 const downloadProgressBar = document.getElementById('download-progress-bar');
 const downloadSubtext = document.getElementById('download-subtext');
+const downloadOverallStatus = document.getElementById('download-overall-status');
 
 const languageSelect = document.getElementById('language-select');
 
@@ -369,46 +370,72 @@ function updateSummaryStats() {
     document.getElementById('summary-total-duration').textContent = formatSecondsToReadable(0);
     document.getElementById('summary-est-size').textContent = '0 MB';
     document.getElementById('summary-est-time').textContent = '~0 ' + (t('sec_suffix_short') || 'sn');
+    
+    // Hide duration items when empty
+    document.getElementById('summary-item-duration').style.display = 'none';
+    document.getElementById('summary-item-speed').style.display = 'none';
+    document.getElementById('summary-item-size').style.display = 'none';
+    document.getElementById('summary-item-time').style.display = 'none';
     return;
   }
 
   // Calculate total count
   document.getElementById('summary-total-count').textContent = checkedTracks.length;
 
-  // Calculate total duration
-  let totalSeconds = 0;
-  checkedTracks.forEach(track => {
-    totalSeconds += parseDurationToSeconds(track.duration);
+  // Check if any of the checked tracks has unknown duration
+  const hasUnknownDuration = checkedTracks.some(track => {
+    const secs = parseDurationToSeconds(track.duration);
+    return secs <= 0 || !track.duration || track.duration.includes('Bilinmiyor') || track.duration === 'Unknown';
   });
-  document.getElementById('summary-total-duration').textContent = formatSecondsToReadable(totalSeconds);
 
-  // Calculate estimated size in MB
-  let totalSizeMB = 0;
-  checkedTracks.forEach(track => {
-    const duration = parseDurationToSeconds(track.duration);
-    if (track.format === 'mp3') {
-      const kbps = parseInt(track.quality) || 320;
-      totalSizeMB += (duration * kbps) / 8388.608;
-    } else {
-      let bitrate = 1500;
-      if (track.quality === '1080') bitrate = 3000;
-      else if (track.quality === '480') bitrate = 750;
-      totalSizeMB += (duration * bitrate) / 8388.608;
-    }
-  });
-  document.getElementById('summary-est-size').textContent = `${totalSizeMB.toFixed(1)} MB`;
+  if (hasUnknownDuration) {
+    // Hide duration-related items completely
+    document.getElementById('summary-item-duration').style.display = 'none';
+    document.getElementById('summary-item-speed').style.display = 'none';
+    document.getElementById('summary-item-size').style.display = 'none';
+    document.getElementById('summary-item-time').style.display = 'none';
+  } else {
+    // Show duration-related items
+    document.getElementById('summary-item-duration').style.display = 'flex';
+    document.getElementById('summary-item-speed').style.display = 'flex';
+    document.getElementById('summary-item-size').style.display = 'flex';
+    document.getElementById('summary-item-time').style.display = 'flex';
 
-  // Calculate estimated download time based on selected internet speed
-  const speedSelect = document.getElementById('summary-speed-select');
-  const speedMbps = parseFloat(speedSelect.value) || 24;
+    // Calculate total duration
+    let totalSeconds = 0;
+    checkedTracks.forEach(track => {
+      totalSeconds += parseDurationToSeconds(track.duration);
+    });
+    document.getElementById('summary-total-duration').textContent = formatSecondsToReadable(totalSeconds);
 
-  const sizeMegabits = totalSizeMB * 8;
-  let estSeconds = sizeMegabits / speedMbps;
-  
-  // Realism factor: connection handshake / conversion overhead
-  estSeconds += checkedTracks.length * 1.5;
+    // Calculate estimated size in MB
+    let totalSizeMB = 0;
+    checkedTracks.forEach(track => {
+      const duration = parseDurationToSeconds(track.duration);
+      if (track.format === 'mp3') {
+        const kbps = parseInt(track.quality) || 320;
+        totalSizeMB += (duration * kbps) / 8388.608;
+      } else {
+        let bitrate = 1500;
+        if (track.quality === '1080') bitrate = 3000;
+        else if (track.quality === '480') bitrate = 750;
+        totalSizeMB += (duration * bitrate) / 8388.608;
+      }
+    });
+    document.getElementById('summary-est-size').textContent = `${totalSizeMB.toFixed(1)} MB`;
 
-  document.getElementById('summary-est-time').textContent = `~${formatSecondsToReadable(Math.round(estSeconds))}`;
+    // Calculate estimated download time based on selected internet speed
+    const speedSelect = document.getElementById('summary-speed-select');
+    const speedMbps = parseFloat(speedSelect.value) || 24;
+
+    const sizeMegabits = totalSizeMB * 8;
+    let estSeconds = sizeMegabits / speedMbps;
+    
+    // Realism factor: connection handshake / conversion overhead
+    estSeconds += checkedTracks.length * 1.5;
+
+    document.getElementById('summary-est-time').textContent = `~${formatSecondsToReadable(Math.round(estSeconds))}`;
+  }
 }
 
 // 5. Back Button (Step 2 to Step 1 Transition)
@@ -725,6 +752,27 @@ downloadBtn.addEventListener('click', async () => {
     downloadPercent.textContent = `${percent}%`;
     downloadProgressBar.style.width = `${percent}%`;
     downloadSubtext.textContent = `${t('swal_file_size')}: ${stat}`;
+
+    // Overall progress, completed vs remaining items live calculator
+    const totalSelected = playlistTracks.filter(t => t.checked).length;
+    const completedCount = playlistTracks.filter(t => t.checked && t.status === 'completed').length;
+    const failedCount = playlistTracks.filter(t => t.checked && t.status === 'error').length;
+    const remainingCount = totalSelected - completedCount - failedCount;
+    
+    let overallText = '';
+    if (currentLang === 'tr') {
+      overallText = `Tamamlanan: ${completedCount}/${totalSelected} · Kalan: ${remainingCount}${failedCount > 0 ? ` · Hata: ${failedCount}` : ''}`;
+    } else if (currentLang === 'de') {
+      overallText = `Abgeschlossen: ${completedCount}/${totalSelected} · Verbleibend: ${remainingCount}${failedCount > 0 ? ` · Fehler: ${failedCount}` : ''}`;
+    } else if (currentLang === 'ru') {
+      overallText = `Завершено: ${completedCount}/${totalSelected} · Осталось: ${remainingCount}${failedCount > 0 ? ` · Ошибки: ${failedCount}` : ''}`;
+    } else if (currentLang === 'ar') {
+      overallText = `اكتمل: ${completedCount}/${totalSelected} · المتبقي: ${remainingCount}${failedCount > 0 ? ` · خطأ: ${failedCount}` : ''}`;
+    } else {
+      overallText = `Completed: ${completedCount}/${totalSelected} · Remaining: ${remainingCount}${failedCount > 0 ? ` · Error: ${failedCount}` : ''}`;
+    }
+    
+    downloadOverallStatus.textContent = overallText;
   });
 
   try {