Comment to 'UNA 14.0.0 Timeline Autoplay Sound Conflict: Multiple Videos Playing Together'
  • Updates for 2025-05-09

    • Added a robust autoplay system for video players in the Timeline module.
    • Uses IntersectionObserver to detect when a video becomes visible in the viewport and triggers autoplay.
    • Implemented a fallback mechanism for browsers without IntersectionObserver support, using scroll-based detection.
    • Refactored player registration to enforce single-session playback only one video plays at a time.
    • Improved the autoplayVideos logic:
    • Prioritizes playing the most visible video in the viewport.
    • Automatically pauses all other videos.
    • Added the autoplayVideosFallback function:
    • In the absence of IntersectionObserver, it plays the video closest to the center of the viewport.
    • Standardized and updated code comments for:
    • initVideosAutoplay
    • autoplayVideos
    • autoplayVideosFallback
    • Improving code readability and maintainability.
    • Consolidated all video pause functionalities into a single pauseVideos method:
    • Supports pausing all videos globally or only those within a specific view.
    • Refactored the playVideos function to playCentralVideo for better clarity:
    • The new name accurately reflects its role in managing playback for the central (most visible) video.
    • Added debug log messages for function calls (to be cleaned up later).
    • Fully tested all functionality across:
    • Browsers with IntersectionObserver support.
    • Browsers without IntersectionObserver support.
    • Confirmed single-session playback enforcement in all cases.
    • No regressions found in other related modules:
    • Outline
    • Infinite Scroll
    • See More

    📌 Full list of commits:

    https://github.com/kabballa/timeline/commits/14.0.10/

    📄 For full update details and README:

    https://github.com/kabballa/timeline/tree/14.0.10

    These updates ensure a consistent, reliable, and seamless autoplay experience for videos in the Timeline, regardless of browser capabilities.

    Happy coding!