v1.12.12 live:dvr progress bar scrubbing not working.
Current Behavior:
Version v1.12.12 using web components(in html or sveltekit) does not allow scrubbing/rewinding when stream-type is set to live:dvr, even though the hls stream allows for dvr capabilities.
Expected Behavior:
I should be able to move and scrub the progress bar/time. Only reverting back to 1.11.30 does the capability to scrub the timeline with DVR return.
Steps To Reproduce:
Steps to reproduce the behavior:
- Create an HTML page in vscode with the following settings -
- Use FFMPEG to create an HLS Stream with DVR
- Use a node or python server to serve the hls stream (http://localhost:8000/output.m3u8)
//HTML Code
<script
src="https://cdn.vidstack.io/[email protected]"
type="module"
></script>
// FFMPEG CODE
ffmpeg -re -i your_video.mp4
-c:v libx264 -preset ultrafast -tune zerolatency -b:v 1000k -maxrate 1000k -bufsize 2000k
-c:a aac -b:a 128k -ar 48000 -ac 2
-f hls
-hls_time 4
-hls_playlist_type event
-hls_list_size 0
-hls_segment_filename segment_%03d.ts
output.m3u8
Environment:
I might have pinpointed the issue here.
Even though I'm setting the streamType="live:dvr" on the media-player web component, this script is returning false for the canSeek state resulting in the above issue.
Also this script is checking for the EXT-X-DVR-ENABLED tag. Since this is not a standard HLS tag, it would be nice if we have the option to override/ignore it.
Setting streamType="live:dvr" is only to show the LIVE controls, the functionality of rewind is decided by the canSeek state.
same here
We're having the same problem. Shouldn't the live:dvr detection use the EXT-X-PLAYlST-TYPE?
- EXT-X-PLAYLIST-TYPE:EVENT = live
- EXT-X-PLAYLIST-TYPE:VOD = vod
- Attribute missing (chunks cannot be removed from the beginning of the playlist) = live:dvr
Video.JS on the other hand is just checking if the playlist has a minimum duration of 5 minutes to consider it live:dvr.
We also are experiencing this issue.
A workaround we found for HLS: load the livestream URL as normal, and set the player streamType to 'on-demand'.
This will look like it's playing an 'on-demand' stream and even dynamically adjust the progress bar as the livestream comes in, while allowing pausing and seeking. Then we can change the style of the progress bar if we want to appear red.
We'll miss out on the "jump to live edge" button though.
I also have the issue, but with a regular .mp3 file and "normal" settings. My component looks like this:
<media-player
:src="src"
:autoplay
:title
:fullscreen-orientation="fullscreenOrientation"
:loop
:muted
view-type="audio"
/>
And with this basic settings, scrubbing is not possible. It always shows 0:00 when I scrub and also starts from the beginning.