react-player
react-player copied to clipboard
cookpete
Updating video subtitles dynamically
This is a continuation of a previous ticket (which is currently marked closed) but I wanted to bring attention to it
https://github.com/CookPete/react-player/issues/329
When switching videos or toggling options with Config, the player does not appear to respond or update properly. i.e. subtitles from a previous video play instead of using the new subtitles.
This is because we are using memoize-one here, which (incorrectly) assumes that the config will only ever change when the URL changes:
https://github.com/cookpete/react-player/blob/53e4aede5d116c7047e5371c530e55d291ef2ad8/src/ReactPlayer.js#L121-L129
I'm open to ideas. Maybe a config.key to indicate that the config has changed? I don't really want to remove memoize and run the merge.all logic on every update.
not related to this issue , but can we add time stamp in audio timeline?
@mohitp22 ReactPlayer uses the native browser controls, so adding things like timestamps is not possible. Please create a new issue in the future rather than posting your question on a completely unrelated issue.
@cookpete I do change the URL when switching subtitles, so I'm not sure why it doesn't pick up on it. I'd be open to use a config.key, that seems like a simple fix. Right now my player only updates the subtitles if ReactPlayer is removed and then re-added. If i switch from a video directly to a different video URL (and a different subtitle file) the config doesn't appear to pick up on the change.
Other use-cases to consider is when you want to switch subtitle files from English to Spanish, the URL would remain the same. Now that I think about it, I ran into this also when I wanted to toggle subtitles on and off. I ended up using a useEffect that would run when the subtitle flag changed. It would then target the actual video element (bypassing ReactPlayer) in order to change the track mode directly.
A possible alternative to config.key would be to break off the subtitle tracks into a separate prop much like URL is. So you could handle the subtitle tracks separately from the rest of the config. Maybe that would be light weight enough for you to update the subtitle tracks on every update.
Yes, implement a config.key just like the player itself has a key... I guess that will be enough the user will decide when to update with that key.
After updating config.key the player shouldn't reload, the video will play just fine just the config (subtitle files content, files etc) should reload
As @gmariani mentioned above you can also handle subtitles url separately maybe that'll reduce your complexity but we really need a way to update the config whenever we want without updating the whole video player. Can you suggest me where should I change into the react player's source code if I want to do it myself? @cookpete
