Video icon indicating copy to clipboard operation
Video copied to clipboard

Can't seem to get second video to start

Open Ceorl64 opened this issue 3 years ago • 4 comments

I'm using the example code, except I've added a parameter for the video file name. My Navmenu contains a list of file names to select from. The first file starts up without issue, but if I select a second, it never starts. I can restart the code, and select any video file name from my list, and it always starts up, so I know it's able to find all the files, but anytime I select a subsequent video, it never starts. When I include a breakpoint, I can see the file name:

image

After selecting the second video, again, I can see the new video file name at the breakpoint, but it never get loaded and played. image

Keep in mind, I can always play the second video first without issue, but never another behind it.

Is there a way to force the next video to load?

Ceorl64 avatar Jun 02 '21 14:06 Ceorl64

I'm facing the same issue but I didn't add a parameter for video file name and I change the source according to my ViewModel changes such as this:

<BlazoredVideo>
	<source src="@ViewModel.VideoSource" type="video/mp4" />
</BlazoredVideo>

I can verify that the source gets updated successfully by Blazor, but the new video is not loaded.

AmirMahdiNassiri avatar Dec 13 '21 20:12 AmirMahdiNassiri

I think this is not an issue for Blazored.Video but a pitfall in HTML, have a look at this StackOverflow question. Basically, a call to HTML's video tag Load method is required after the source tag is updated. As a suggestion, it would be real handy if Blazored.Video could expose the Load method too! @chrissainty

AmirMahdiNassiri avatar Dec 13 '21 20:12 AmirMahdiNassiri

Hi - you can force a reload by using a @key like this:

<BlazoredVideo @key=videos[selectedVideo]>
	<source src=@videos[selectedVideo] type="video/mp4" />
</BlazoredVideo>
<button @onclick=NextVideo>Next Video</button>

In this code, I have an array of videos and the current index is held in selectedVideo (int) I make the @key the same as the video URL, so when the URL changes, Blazor will recreate the video element. The method NextVideo just increments selectedVideo and wraps back round to zero at the end of the video list.

SQL-MisterMagoo avatar Dec 15 '21 00:12 SQL-MisterMagoo

Hi - you can force a reload by using a @key like this:

I can make the first video on the page render and play. It works well. At first I too had the problem of subsequent videos failing to display. I discovered that they had not been encoded with H.264 Codec. Resampling the file solved the problem for those.

Budsy avatar Mar 06 '22 03:03 Budsy

This worked for me to load a video dynamically:

<BlazoredVideo @key="@ProfileVideoUrl" class="w-100"
               style="max-width:800px;"
               controls="controls">
    <source src="@ProfileVideoUrl" type="video/mp4" />
</BlazoredVideo>

gregoryagu avatar Nov 26 '23 21:11 gregoryagu