Disable seek bar

[obuw]

I am trying to control the behavior of the player controls, by disabling the seek bar. This is possible in some other players, but unfortunately doesn't seem to be the case on react-player.

Ideally, if the onSeek function were to return an event, I could call event.preventDefault(); But sadly that's not the case.

I don't want to disable the controls completely, since I still want the volume and fullscreen buttons.

Is there any way I can control the functionality of the seek bar, perhaps by editing the source? I'm only interested in the regular video player, not youtube/facebook/etc. Should I be looking at FilePlayer.js ?

Worst case, I'll have to disable controls and then make my own overlay buttons, but I'd like the use the existing controls if at all possible.

Any help would be appreciated.

[cookpete]

If you look at FilePlayer.js you'll notice that it literally just renders a <video> and attaches a bunch of event listeners to it. You can access the video element with the getInternalPlayer() instance method, so the world is your oyster.

See this post for a possible (but hacky) solution. It would be nice if this could be controlled with controlsList but it might be a while until controlling the seek bar is supported.

[goshua13]

Is this supported on in the controlsList yet?

[obuw]

No official support afaik.

What I ended up doing was to listen for the onSeek event, then move back the video to its original time, like so:

onSeek = e =>
{
	var delta = this.state.player.getCurrentTime() - this.state.currentTime;

	if (delta > 0.01)
	{
		this.state.player.seekTo(this.state.currentTime);
	}
}

I'm updating the currentTime variable in the onProgress event. You can probably figure it out, but if you can't, I'll post the full code somewhere.

[cj-wwc]

I implemented nearly the same solution but sometimes instead of seeking to the currentTime, it will jump ahead further in the video. Have you experienced any behavior like this?

[asvinp]

I used the 2nd solution mentioned in that post. Works as expected, ty!

If you look at FilePlayer.js you'll notice that it literally just renders a <video> and attaches a bunch of event listeners to it. You can access the video element with the getInternalPlayer() instance method, so the world is your oyster.

See this post for a possible (but hacky) solution. It would be nice if this could be controlled with controlsList but it might be a while until controlling the seek bar is supported.