Fix playback of series with large set of episodes (#5786)

* fix: playback of series with large set of episodes

-  fetch episode info for a single episode instead of all episodes in existence

* fix: limit episodes to selected season

* fix: when starting series from the series play button, limit amount of episodes loaded

* Update playbackmanager.js

* fix: start series playback from upNext episode

also change playback from a specific episode to pull 100 next episodes instead of only the season this episode is in

* chore: clean up query params a bit

* fix: add forgotten query limit

Co-authored-by: Dmitry Lyzo <56478732+dmitrylyzo@users.noreply.github.com>

* fix: get watched episodes as well for nextUp inside playing an entire show

* fix: get first unplayed episode without nextUp

* chore: remove unwanted whitepsace

Co-authored-by: Dmitry Lyzo <56478732+dmitrylyzo@users.noreply.github.com>

---------

Co-authored-by: Bill Thornton <thornbill@users.noreply.github.com>
Co-authored-by: Dmitry Lyzo <56478732+dmitrylyzo@users.noreply.github.com>

src/components/playback/playbackmanager.js

@@ -1942,13 +1942,38 @@ export class PlaybackManager {
             const apiClient = ServerConnections.getApiClient(firstItem.ServerId);
             const startSeasonId = firstItem.Type === 'Season' ? items[options.startIndex || 0].Id : undefined;
 
-            const episodesResult = await apiClient.getEpisodes(firstItem.SeriesId || firstItem.Id, {
+            const seasonId = (startSeasonId && items.length === 1) ? startSeasonId : undefined;
+            const seriesId = firstItem.SeriesId || firstItem.Id;
+            const UserId = apiClient.getCurrentUserId();
+
+            let startItemId;
+
+            // Start from a specific (the next unwatched) episode if we want to watch in order and have not chosen a specific season
+            if (!options.shuffle && !seasonId) {
+                const initialUnplayedEpisode = await getItems(apiClient, UserId, {
+                    SortBy: 'SeriesSortName,SortName',
+                    SortOrder: 'Ascending',
+                    IncludeItemTypes: 'Episode',
+                    Recursive: true,
+                    IsMissing: false,
+                    ParentId: seriesId,
+                    limit: 1,
+                    Filters: 'IsUnplayed'
+                });
+
+                startItemId = initialUnplayedEpisode?.Items?.at(0)?.Id;
+            }
+
+            const episodesResult = await apiClient.getEpisodes(seriesId, {
                 IsVirtualUnaired: false,
                 IsMissing: false,
-                SeasonId: (startSeasonId && items.length === 1) ? startSeasonId : undefined,
+                SeasonId: seasonId,
+                // default to first 100 episodes if no season was specified to avoid loading too large payloads
+                limit: seasonId ? undefined : 100,
                 SortBy: options.shuffle ? 'Random' : undefined,
-                UserId: apiClient.getCurrentUserId(),
+                UserId,
-                Fields: ['Chapters', 'Trickplay']
+                Fields: ['Chapters', 'Trickplay'],
+                startItemId
             });
 
             if (options.shuffle) {
@@ -1994,16 +2019,20 @@ export class PlaybackManager {
             return new Promise(function (resolve, reject) {
                 const apiClient = ServerConnections.getApiClient(firstItem.ServerId);
 
-                if (!firstItem.SeriesId) {
+                const { SeriesId, Id } = firstItem;
+                if (!SeriesId) {
                     resolve(null);
                     return;
                 }
 
-                apiClient.getEpisodes(firstItem.SeriesId, {
+                apiClient.getEpisodes(SeriesId, {
                     IsVirtualUnaired: false,
                     IsMissing: false,
                     UserId: apiClient.getCurrentUserId(),
-                    Fields: ['Chapters', 'Trickplay']
+                    Fields: ['Chapters', 'Trickplay'],
+                    // limit to loading 100 episodes to avoid loading too large payload
+                    limit: 100,
+                    startItemId: Id
                 }).then(function (episodesResult) {
                     resolve(filterEpisodes(episodesResult, firstItem, options));
                 }, reject);