hls.js 1.6.0-rc.1.0.canary.11078 → 1.6.0-rc.1.0.canary.11080

package/src/controller/base-stream-controller.ts

@@ -255,6 +255,17 @@ export default class BaseStreamController
     }
   }
 
+  protected get timelineOffset(): number {
+    const configuredTimelineOffset = this.config.timelineOffset;
+    if (configuredTimelineOffset) {
+      return (
+        this.getLevelDetails()?.appliedTimelineOffset ||
+        configuredTimelineOffset
+      );
+    }
+    return 0;
+  }
+
   protected onMediaAttached(
     event: Events.MEDIA_ATTACHED,
     data: MediaAttachedData,
@@ -1299,9 +1310,8 @@ export default class BaseStreamController
         : levelDetails.fragmentEnd;
       frag = this.getFragmentAtPosition(pos, end, levelDetails);
     }
-
-    frag = this.filterReplacedPrimary(frag, levelDetails);
-    return this.mapToInitFragWhenRequired(frag);
+    const programFrag = this.filterReplacedPrimary(frag, levelDetails);
+    return this.mapToInitFragWhenRequired(programFrag);
   }
 
   protected isLoopLoading(frag: Fragment, targetBufferTime: number): boolean {
@@ -1351,18 +1361,26 @@ export default class BaseStreamController
     return nextFragment;
   }
 
-  filterReplacedPrimary(
+  protected get primaryPrefetch(): boolean {
+    if (interstitialsEnabled(this.hls.config)) {
+      const playingInterstitial =
+        this.hls.interstitialsManager?.playingItem?.event;
+      if (playingInterstitial) {
+        return true;
+      }
+    }
+    return false;
+  }
+
+  protected filterReplacedPrimary(
     frag: MediaFragment | null,
     details: LevelDetails | undefined,
   ): MediaFragment | null {
     if (!frag) {
       return frag;
     }
-    const config = this.hls.config;
     if (
-      __USE_INTERSTITIALS__ &&
-      config.interstitialsController &&
-      config.enableInterstitialPlayback !== false &&
+      interstitialsEnabled(this.hls.config) &&
       frag.type !== PlaylistLevelType.SUBTITLE
     ) {
       // Do not load fragments outside the buffering schedule segment
@@ -1388,7 +1406,13 @@ export default class BaseStreamController
           }
           if (frag.start > bufferingItem.end && bufferingItem.nextEvent) {
             // fragment is past schedule item end
-            return null;
+            // allow some overflow when not appending in place to prevent stalls
+            if (
+              bufferingItem.nextEvent.appendInPlace ||
+              frag.start - bufferingItem.end > 1
+            ) {
+              return null;
+            }
           }
         }
       }
@@ -1659,6 +1683,7 @@ export default class BaseStreamController
     if (startPosition < sliding) {
       startPosition = -1;
     }
+    const timelineOffset = this.timelineOffset;
     if (startPosition === -1) {
       // Use Playlist EXT-X-START:TIME-OFFSET when set
       // Prioritize Multivariant Playlist offset so that main, audio, and subtitle stream-controller start times match
@@ -1693,9 +1718,9 @@ export default class BaseStreamController
         this.log(`setting startPosition to 0 by default`);
         this.startPosition = startPosition = 0;
       }
-      this.lastCurrentTime = startPosition;
+      this.lastCurrentTime = startPosition + timelineOffset;
     }
-    this.nextLoadPosition = startPosition;
+    this.nextLoadPosition = startPosition + timelineOffset;
   }
 
   protected getLoadPosition(): number {
@@ -2066,3 +2091,11 @@ export default class BaseStreamController
     return this._state;
   }
 }
+
+function interstitialsEnabled(config: HlsConfig): boolean {
+  return (
+    __USE_INTERSTITIALS__ &&
+    !!config.interstitialsController &&
+    config.enableInterstitialPlayback !== false
+  );
+}

package/src/controller/buffer-controller.ts

@@ -1051,17 +1051,10 @@ transfer tracks: ${stringify(transferredTracks, (key, value) => (key === 'initSe
       !this.sourceBuffers.some(([type]) => type && !this.tracks[type]?.ended);
 
     if (allTracksEnding) {
-      this.log(`Queueing EOS`);
-      this.blockUntilOpen(() => {
-        this.sourceBuffers.forEach(([type]) => {
-          if (type !== null) {
-            const track = this.tracks[type];
-            if (track) {
-              track.ending = false;
-            }
-          }
-        });
-        if (allowEndOfStream) {
+      if (allowEndOfStream) {
+        this.log(`Queueing EOS`);
+        this.blockUntilOpen(() => {
+          this.tracksEnded();
           const { mediaSource } = this;
           if (!mediaSource || mediaSource.readyState !== 'open') {
             if (mediaSource) {
@@ -1074,12 +1067,27 @@ transfer tracks: ${stringify(transferredTracks, (key, value) => (key === 'initSe
           this.log(`Calling mediaSource.endOfStream()`);
           // Allow this to throw and be caught by the enqueueing function
           mediaSource.endOfStream();
-        }
+
+          this.hls.trigger(Events.BUFFERED_TO_END, undefined);
+        });
+      } else {
+        this.tracksEnded();
         this.hls.trigger(Events.BUFFERED_TO_END, undefined);
-      });
+      }
     }
   }
 
+  private tracksEnded() {
+    this.sourceBuffers.forEach(([type]) => {
+      if (type !== null) {
+        const track = this.tracks[type];
+        if (track) {
+          track.ending = false;
+        }
+      }
+    });
+  }
+
   private onLevelUpdated(
     event: Events.LEVEL_UPDATED,
     { details }: LevelUpdatedData,

package/src/controller/interstitial-player.ts

@@ -28,6 +28,7 @@ export class HlsAssetPlayer {
   private hasDetails: boolean = false;
   private mediaAttached: HTMLMediaElement | null = null;
   private _currentTime?: number;
+  private _bufferedEosTime?: number;
 
   constructor(
     HlsPlayerClass: typeof Hls,
@@ -62,6 +63,22 @@ export class HlsAssetPlayer {
     });
   }
 
+  bufferedInPlaceToEnd(media?: HTMLMediaElement | null) {
+    if (!this.interstitial.appendInPlace) {
+      return false;
+    }
+    if (this.hls?.bufferedToEnd) {
+      return true;
+    }
+    if (!media || !this._bufferedEosTime) {
+      return false;
+    }
+    const start = this.timelineOffset;
+    const bufferInfo = BufferHelper.bufferInfo(media, start, 0);
+    const bufferedEnd = this.getAssetTime(bufferInfo.end);
+    return bufferedEnd >= this._bufferedEosTime - 0.02;
+  }
+
   private checkPlayout = () => {
     const interstitial = this.interstitial;
     const playoutLimit = interstitial.playoutLimit;
@@ -90,6 +107,9 @@ export class HlsAssetPlayer {
   get bufferedEnd(): number {
     const media = this.media || this.mediaAttached;
     if (!media) {
+      if (this._bufferedEosTime) {
+        return this._bufferedEosTime;
+      }
       return this.currentTime;
     }
     const bufferInfo = BufferHelper.bufferInfo(media, media.currentTime, 0.001);
@@ -153,10 +173,19 @@ export class HlsAssetPlayer {
     const media = this.mediaAttached;
     if (media) {
       this._currentTime = media.currentTime;
+      this.bufferSnapShot();
       media.removeEventListener('timeupdate', this.checkPlayout);
     }
   }
 
+  private bufferSnapShot() {
+    if (this.mediaAttached) {
+      if (this.hls?.bufferedToEnd) {
+        this._bufferedEosTime = this.bufferedEnd;
+      }
+    }
+  }
+
   destroy() {
     this.removeMediaListeners();
     this.hls.destroy();
@@ -185,6 +214,7 @@ export class HlsAssetPlayer {
   }
 
   transferMedia() {
+    this.bufferSnapShot();
     return this.hls.transferMedia();
   }
 

package/src/controller/interstitials-controller.ts

@@ -417,7 +417,8 @@ export default class InterstitialsController
                   );
 
             const diff = time - currentTime;
-            const seekToTime = media.currentTime + diff;
+            const seekToTime =
+              (appendInPlace ? currentTime : media.currentTime) + diff;
             if (
               seekToTime >= 0 &&
               (!assetPlayer ||
@@ -592,10 +593,6 @@ export default class InterstitialsController
           },
           get currentTime() {
             const timelinePos = c.timelinePos;
-            const playingItem = c.effectivePlayingItem;
-            if (playingItem?.event?.appendInPlace) {
-              return playingItem.start;
-            }
             return timelinePos > 0 ? timelinePos : 0;
           },
           set currentTime(time: number) {
@@ -806,6 +803,11 @@ export default class InterstitialsController
               const interstitial = queuedPlayer.interstitial;
               this.clearInterstitial(queuedPlayer.interstitial, null);
               interstitial.appendInPlace = false;
+              if (interstitial.appendInPlace) {
+                this.warn(
+                  `Could not change append strategy for queued assets ${interstitial}`,
+                );
+              }
             }
           });
         }
@@ -1165,7 +1167,9 @@ export default class InterstitialsController
       }
       // Ensure Interstitial is enqueued
       const waitingItem = this.waitingItem;
-      this.setBufferingItem(scheduledItem);
+      if (!this.assetsBuffered(scheduledItem, media)) {
+        this.setBufferingItem(scheduledItem);
+      }
       let player = this.preloadAssets(interstitial, assetListIndex);
       if (!this.eventItemsMatch(scheduledItem, waitingItem || currentItem)) {
         this.waitingItem = scheduledItem;
@@ -1791,6 +1795,20 @@ Schedule: ${scheduleItems.map((seg) => segmentToString(seg))}`,
     }
   }
 
+  private assetsBuffered(
+    item: InterstitialScheduleEventItem,
+    media: HTMLMediaElement | null,
+  ): boolean {
+    const assetList = item.event.assetList;
+    if (assetList.length === 0) {
+      return false;
+    }
+    return !item.event.assetList.some((asset) => {
+      const player = this.getAssetPlayer(asset.identifier);
+      return !player?.bufferedInPlaceToEnd(media);
+    });
+  }
+
   private setBufferingItem(
     item: InterstitialScheduleItem,
   ): InterstitialScheduleItem | null {
@@ -1910,13 +1928,34 @@ Schedule: ${scheduleItems.map((seg) => segmentToString(seg))}`,
     const neverLoaded = assetListLength === 0 && !interstitial.assetListLoader;
     const playOnce = interstitial.cue.once;
     if (neverLoaded) {
-      this.log(
-        `Load interstitial asset ${assetListIndex + 1}/${uri ? 1 : assetListLength} ${interstitial}`,
-      );
       const timelineStart = interstitial.timelineStart;
       if (interstitial.appendInPlace) {
         this.flushFrontBuffer(timelineStart + 0.25);
       }
+      let hlsStartOffset;
+      let liveStartPosition = 0;
+      if (!this.playingItem && this.primaryLive) {
+        liveStartPosition = this.hls.startPosition;
+        if (liveStartPosition === -1) {
+          liveStartPosition = this.hls.liveSyncPosition || 0;
+        }
+      }
+      if (
+        liveStartPosition &&
+        !(interstitial.cue.pre || interstitial.cue.post)
+      ) {
+        const startOffset = liveStartPosition - timelineStart;
+        if (startOffset > 0) {
+          hlsStartOffset = Math.round(startOffset * 1000) / 1000;
+        }
+      }
+      this.log(
+        `Load interstitial asset ${assetListIndex + 1}/${uri ? 1 : assetListLength} ${interstitial}${
+          hlsStartOffset
+            ? ` live-start: ${liveStartPosition} start-offset: ${hlsStartOffset}`
+            : ''
+        }`,
+      );
       if (uri) {
         return this.createAsset(
           interstitial,
@@ -1927,16 +1966,9 @@ Schedule: ${scheduleItems.map((seg) => segmentToString(seg))}`,
           uri,
         );
       }
-      let liveStartPosition = 0;
-      if (!this.playingItem && this.primaryLive) {
-        liveStartPosition = this.hls.startPosition;
-        if (liveStartPosition === -1) {
-          liveStartPosition = this.hls.liveSyncPosition || 0;
-        }
-      }
       const assetListLoader = this.assetListLoader.loadAssetList(
         interstitial as InterstitialEventWithAssetList,
-        liveStartPosition,
+        hlsStartOffset,
       );
       if (assetListLoader) {
         interstitial.assetListLoader = assetListLoader;
@@ -2046,7 +2078,7 @@ Schedule: ${scheduleItems.map((seg) => segmentToString(seg))}`,
     const selectedAudio = primary.audioTracks[primary.audioTrack];
     const selectedSubtitle = primary.subtitleTracks[primary.subtitleTrack];
     let startPosition = 0;
-    if (this.primaryLive) {
+    if (this.primaryLive || interstitial.appendInPlace) {
       const timePastStart = this.timelinePos - assetItem.timelineStart;
       if (timePastStart > 1) {
         const duration = assetItem.duration;
@@ -2304,8 +2336,10 @@ Schedule: ${scheduleItems.map((seg) => segmentToString(seg))}`,
       });
     }
 
-    // detach media and attach to interstitial player if it does not have another element attached
-    this.bufferAssetPlayer(player, media);
+    if (!player.bufferedInPlaceToEnd(media)) {
+      // detach media and attach to interstitial player if it does not have another element attached
+      this.bufferAssetPlayer(player, media);
+    }
   }
 
   private bufferAssetPlayer(player: HlsAssetPlayer, media: HTMLMediaElement) {
@@ -2466,6 +2500,7 @@ Schedule: ${scheduleItems.map((seg) => segmentToString(seg))}`,
       return;
     }
     const eventStart = interstitial.timelineStart;
+    const previousDuration = interstitial.duration;
     let sumDuration = 0;
     assets.forEach((asset, assetListIndex) => {
       const duration = parseFloat(asset.DURATION);
@@ -2480,7 +2515,9 @@ Schedule: ${scheduleItems.map((seg) => segmentToString(seg))}`,
       sumDuration += duration;
     });
     interstitial.duration = sumDuration;
-
+    this.log(
+      `Loaded asset-list with duration: ${sumDuration} (was: ${previousDuration}) ${interstitial}`,
+    );
     const waitingItem = this.waitingItem;
     const waitingForItem = waitingItem?.event.identifier === interstitialId;
 
@@ -2495,6 +2532,17 @@ Schedule: ${scheduleItems.map((seg) => segmentToString(seg))}`,
       const scheduleIndex = this.schedule.findEventIndex(interstitialId);
       const item = this.schedule.items?.[scheduleIndex];
       if (item) {
+        if (!this.playingItem && this.timelinePos > item.end) {
+          // Abandon if new duration is reduced enough to land playback in primary start
+          const index = this.schedule.findItemIndexAtTime(this.timelinePos);
+          if (index !== scheduleIndex) {
+            interstitial.error = new Error(
+              `Interstitial no longer within playback range ${this.timelinePos} ${interstitial}`,
+            );
+            this.primaryFallback(interstitial);
+            return;
+          }
+        }
         this.setBufferingItem(item);
       }
       this.setSchedulePosition(scheduleIndex);

package/src/controller/interstitials-schedule.ts

@@ -588,6 +588,11 @@ export class InterstitialsSchedule extends Logger {
           interstitialEvents[i].resumeTime;
         if (timeBetween < ABUTTING_THRESHOLD_SECONDS) {
           interstitialEvents[i + 1].appendInPlace = false;
+          if (interstitialEvents[i + 1].appendInPlace) {
+            this.warn(
+              `Could not change append strategy for abutting event ${interstitial}`,
+            );
+          }
         }
       }
       // Update cumulativeDuration for next abutting interstitial with the same start date
@@ -624,12 +629,11 @@ export class InterstitialsSchedule extends Logger {
       const details = mediaSelection[playlistType].details;
       const playlistEnd = details.edge;
       if (resumeTime > playlistEnd) {
-        if (playlists.length > 1) {
-          this.log(
-            `"${interstitial.identifier}" resumption ${resumeTime} past ${playlistType} playlist end ${playlistEnd}`,
-          );
-          return true;
-        }
+        // Live playback - resumption segments are not yet available
+        this.log(
+          `"${interstitial.identifier}" resumption ${resumeTime} past ${playlistType} playlist end ${playlistEnd}`,
+        );
+        // Assume alignment is possible (or reset can take place)
         return false;
       }
       const startFragment = findFragmentByPTS(
@@ -639,16 +643,16 @@ export class InterstitialsSchedule extends Logger {
       );
       if (!startFragment) {
         this.log(
-          `"${interstitial.identifier}" resumption ${resumeTime} does not align with any fragments in ${playlistType} playlist`,
+          `"${interstitial.identifier}" resumption ${resumeTime} does not align with any fragments in ${playlistType} playlist (${details.fragStart}-${details.fragmentEnd})`,
         );
         return true;
       }
-      const endAllowance = playlistType === 'audio' ? 0.175 : 0;
+      const allowance = playlistType === 'audio' ? 0.175 : 0;
       const alignedWithSegment =
         Math.abs(startFragment.start - resumeTime) <
-          ALIGNED_END_THRESHOLD_SECONDS ||
+          ALIGNED_END_THRESHOLD_SECONDS + allowance ||
         Math.abs(startFragment.end - resumeTime) <
-          ALIGNED_END_THRESHOLD_SECONDS + endAllowance;
+          ALIGNED_END_THRESHOLD_SECONDS + allowance;
       if (!alignedWithSegment) {
         this.log(
           `"${interstitial.identifier}" resumption ${resumeTime} not aligned with ${playlistType} fragment bounds (${startFragment.start}-${startFragment.end} sn: ${startFragment.sn} cc: ${startFragment.cc})`,

package/src/controller/latency-controller.ts

@@ -256,12 +256,26 @@ export default class LatencyController implements ComponentAPI {
           (2 / (1 + Math.exp(-0.75 * distanceFromTarget - this.edgeStalled))) *
             20,
         ) / 20;
-      media.playbackRate = Math.min(max, Math.max(1, rate));
+      const playbackRate = Math.min(max, Math.max(1, rate));
+      this.changeMediaPlaybackRate(media, playbackRate);
     } else if (media.playbackRate !== 1 && media.playbackRate !== 0) {
-      media.playbackRate = 1;
+      this.changeMediaPlaybackRate(media, 1);
     }
   };
 
+  private changeMediaPlaybackRate(
+    media: HTMLMediaElement,
+    playbackRate: number,
+  ) {
+    if (media.playbackRate === playbackRate) {
+      return;
+    }
+    this.hls?.logger.debug(
+      `[latency-controller]: latency=${this.latency.toFixed(3)}, targetLatency=${this.targetLatency?.toFixed(3)}, forwardBufferLength=${this.forwardBufferLength.toFixed(3)}: adjusting playback rate from ${media.playbackRate} to ${playbackRate}`,
+    );
+    media.playbackRate = playbackRate;
+  }
+
   private estimateLiveEdge(): number | null {
     const levelDetails = this.levelDetails;
     if (levelDetails === null) {

package/src/controller/stream-controller.ts

@@ -176,7 +176,8 @@ export default class StreamController
         startPosition = lastCurrentTime;
       }
       this.state = State.IDLE;
-      this.nextLoadPosition = this.lastCurrentTime = startPosition;
+      this.nextLoadPosition = this.lastCurrentTime =
+        startPosition + this.timelineOffset;
       this.startPosition = skipSeekToStartPosition ? -1 : startPosition;
       this.tick();
     } else {
@@ -251,7 +252,9 @@ export default class StreamController
     // exit loop, as we either need more info (level not parsed) or we need media to be attached to load new fragment
     if (
       levelLastLoaded === null ||
-      (!media && (this.startFragRequested || !hls.config.startFragPrefetch))
+      (!media &&
+        !this.primaryPrefetch &&
+        (this.startFragRequested || !hls.config.startFragPrefetch))
     ) {
       return;
     }
@@ -1103,13 +1106,11 @@ export default class StreamController
       }
 
       // Offset start position by timeline offset
-      const details = this.getLevelDetails();
-      const configuredTimelineOffset = this.config.timelineOffset;
-      if (configuredTimelineOffset && startPosition) {
-        startPosition +=
-          details?.appliedTimelineOffset || configuredTimelineOffset;
+      const timelineOffset = this.timelineOffset;
+      if (timelineOffset && startPosition) {
+        startPosition += timelineOffset;
       }
-
+      const details = this.getLevelDetails();
       const buffered = BufferHelper.getBuffered(media);
       const bufferStart = buffered.length ? buffered.start(0) : 0;
       const delta = bufferStart - startPosition;

package/src/controller/subtitle-stream-controller.ts

@@ -94,16 +94,15 @@ export class SubtitleStreamController
     hls.off(Events.BUFFER_FLUSHING, this.onBufferFlushing, this);
   }
 
-  startLoad(startPosition: number) {
+  startLoad(startPosition: number, skipSeekToStartPosition?: boolean) {
     this.stopLoad();
     this.state = State.IDLE;
 
     this.setInterval(TICK_INTERVAL);
 
-    this.nextLoadPosition =
-      this.startPosition =
-      this.lastCurrentTime =
-        startPosition;
+    this.nextLoadPosition = this.lastCurrentTime =
+      startPosition + this.timelineOffset;
+    this.startPosition = skipSeekToStartPosition ? -1 : startPosition;
 
     this.tick();
   }

package/src/loader/interstitial-asset-list.ts

@@ -31,7 +31,7 @@ export class AssetListLoader {
 
   loadAssetList(
     interstitial: InterstitialEventWithAssetList,
-    liveStartPosition: number,
+    hlsStartOffset: number | undefined,
   ): Loader<LoaderContext> | undefined {
     const assetListUrl = interstitial.assetListUrl;
     let url: URL;
@@ -51,18 +51,8 @@ export class AssetListLoader {
       this.hls.trigger(Events.ERROR, errorData);
       return;
     }
-    if (
-      liveStartPosition &&
-      !(interstitial.cue.pre || interstitial.cue.post) &&
-      url.protocol !== 'data:'
-    ) {
-      const startOffset = liveStartPosition - interstitial.startTime;
-      if (startOffset > 0) {
-        url.searchParams.set(
-          '_HLS_start_offset',
-          '' + Math.round(startOffset * 1000) / 1000,
-        );
-      }
+    if (hlsStartOffset && url.protocol !== 'data:') {
+      url.searchParams.set('_HLS_start_offset', '' + hlsStartOffset);
     }
     const config = this.hls.config;
     const Loader = config.loader;

package/src/loader/interstitial-event.ts

@@ -3,7 +3,7 @@ import type { DateRange, DateRangeCue } from './date-range';
 import type { MediaFragmentRef } from './fragment';
 import type { Loader, LoaderContext } from '../types/loader';
 
-export const ALIGNED_END_THRESHOLD_SECONDS = 0.02;
+export const ALIGNED_END_THRESHOLD_SECONDS = 0.025;
 
 export type PlaybackRestrictions = {
   skip: boolean;
@@ -76,6 +76,7 @@ export class InterstitialEvent {
   public assetListResponse: AssetListJSON | null = null;
   public resumeAnchor?: MediaFragmentRef;
   public error?: Error;
+  public resetOnResume?: boolean;
 
   constructor(dateRange: DateRange, base: BaseData) {
     this.base = base;
@@ -157,6 +158,19 @@ export class InterstitialEvent {
     return this.cue.pre ? 0 : this.startTime;
   }
 
+  get startIsAligned(): boolean {
+    if (this.startTime === 0 || this.snapOptions.out) {
+      return true;
+    }
+    const frag = this.dateRange.tagAnchor;
+    if (frag) {
+      const startTime = this.dateRange.startTime;
+      const snappedStart = getSnapToFragmentTime(startTime, frag);
+      return startTime - snappedStart < 0.1;
+    }
+    return false;
+  }
+
   get resumptionOffset(): number {
     const resumeOffset = this.resumeOffset;
     const offset = Number.isFinite(resumeOffset) ? resumeOffset : this.duration;
@@ -176,13 +190,16 @@ export class InterstitialEvent {
   }
 
   get appendInPlace(): boolean {
+    if (this.appendInPlaceStarted) {
+      return true;
+    }
     if (this.appendInPlaceDisabled) {
       return false;
     }
     if (
       !this.cue.once &&
       !this.cue.pre && // preroll starts at startPosition before startPosition is known (live)
-      (this.startTime === 0 || this.snapOptions.out) &&
+      this.startIsAligned &&
       ((isNaN(this.playoutLimit) && isNaN(this.resumeOffset)) ||
         (this.resumeOffset &&
           this.duration &&
@@ -196,6 +213,7 @@ export class InterstitialEvent {
 
   set appendInPlace(value: boolean) {
     if (this.appendInPlaceStarted) {
+      this.resetOnResume = !value;
       return;
     }
     this.appendInPlaceDisabled = !value;