✨ update series details after watching

Author: LoupesDEV

js/display.js

@@ -178,6 +178,16 @@ export function closeDetails() {
     document.body.style.overflow = '';
 }
 
+/**
+ * Refreshes the details overlay for the active series.
+ * This is useful after watching an episode to update the watched status.
+ */
+export function refreshActiveSeriesDetails() {
+    if (activeDetailItem && (activeDetailItem.type === 'serie' || activeDetailItem.seasons !== undefined)) {
+        openDetails(activeDetailItem);
+    }
+}
+
 /**
  * Plays the currently selected media in the details overlay.
  */

js/main.js

@@ -8,7 +8,7 @@
 import { fetchAllData } from './dataLoader.js';
 
 // Import display and rendering functions
-import { setupHero, renderHorizontalRow, renderGrid, renderNotifs, openDetails, closeDetails, playCurrentMedia, renderCollections, renderActorsList, closeActorDetails, renderActorsListSearch } from './display.js';
+import { setupHero, renderHorizontalRow, renderGrid, renderNotifs, openDetails, closeDetails, playCurrentMedia, renderCollections, renderActorsList, closeActorDetails, renderActorsListSearch, refreshActiveSeriesDetails } from './display.js';
 
 // Import utility functions for video player and UI interactions
 import { closeVideo, toggleNotifs, toggleSettings, toggleMobileMenu, toggleMobileSearch, showLoader, hideLoader, hardenPlayerControls, initPlayerPersistence, downloadProgressBackup, openProgressImport, importProgressFromFile } from './utils.js';
@@ -30,6 +30,7 @@ window.toggleMobileMenu = toggleMobileMenu;
 window.downloadProgressBackup = downloadProgressBackup;
 window.openProgressImport = openProgressImport;
 window.closeActorDetails = closeActorDetails;
+window.refreshActiveSeriesDetails = refreshActiveSeriesDetails;
 
 // Initialize application when DOM is fully loaded
 document.addEventListener('DOMContentLoaded', async () => {

js/utils.js

@@ -248,11 +248,8 @@ function saveWatchProgress(player, isEnded = false) {
         markEpisodeWatched(title, season, epIndex, watched, timeToSave);
     }
 
-    // Clear current video state if marked as watched
-    if (watched) {
-        currentVideoSrc = '';
-        currentVideoContext = null;
-    }
+    // Note: We keep currentVideoContext alive until closeVideo() is called
+    // This allows us to refresh the series details page when closing
 }
 
 /**
@@ -301,13 +298,27 @@ export function closeVideo() {
     saveWatchProgress(player);
     player.pause();
     player.src = "";
+    
+    // Check if we were watching a series to refresh the details
+    const wasWatchingSeries = currentVideoContext && currentVideoContext.type === 'series';
+    
     // Reset global state
     currentVideoSrc = '';
     currentVideoContext = null;
     overlay.classList.add('hidden');
 
     // Clean up custom controls
     cleanupCustomVideoControls();
+    
+    // Refresh series details if we were watching a series
+    if (wasWatchingSeries) {
+        // Use setTimeout to ensure the video overlay is fully closed before refreshing
+        setTimeout(() => {
+            if (window.refreshActiveSeriesDetails) {
+                window.refreshActiveSeriesDetails();
+            }
+        }, 100);
+    }
 }
 
 /**
@@ -472,8 +483,7 @@ export function initPlayerPersistence() {
     // Mark as watched when video ends
     player.addEventListener('ended', () => {
         saveWatchProgress(player, true);
-        currentVideoSrc = '';
-        currentVideoContext = null;
+        // Note: We keep context alive until closeVideo() to allow series details refresh
     });
 }