Refactor VideoPlayer component to improve rewind and forward function

[himanshu8443]

Issue: Tapping on the forward or rewind button sets the currentTime to 0 until buffering So quickly tapping on the buttons more than once starts the video from start.

I throttled forward and rewind function to use accumulated time. if this is not the correct way please fix this issue.

[LunatiqueCoder]

Not sure what's the issue here. Can you give an example or a reproduction repository? That would be helpful

[himanshu8443]

Not sure what's the issue here. Can you give an example or a reproduction repository? That would be helpful

quickly press the fast-forward or the rewind button 3 or 4 times and the video will start playing from the beginning.

[LunatiqueCoder]

@himanshu8443 if it reaches the end, it's meant to start from beginning. What's your wanted behaviour?

[himanshu8443]

check this attached video, I just pressed the forward button and the video started playing from the beginning.

https://github.com/LunatiqueCoder/react-native-media-console/assets/99420590/345261b7-3455-43c9-891a-8c8678b5036e

[LunatiqueCoder]

@himanshu8443 Ok, I will have to look into it, but I can't promise it will happen very soon :(

[jonahgervasi]

I am noticing this same thing on Android only, when i click the back button twice fast it starts the video from the start.

[himanshu8443]

@LunatiqueCoder hey I found that its because in VideoPlayer.tsx there is _onSeek function

const _onSeek = (obj: OnSeekData) => {
    if (!seeking) {
      setControlTimeout();
    }
    setCurrentTime(obj.seekTime);  // <--here
    console.log('seek time',obj.seekTime);

    if (typeof onSeek === 'function') {
      onSeek(obj);
    }
  };

logging obj.seekTime prints 0 means it sets currentTime to 0 which causes video playing from start and the actual seek time is returned in obj.currentTime after setting setting setCurrentTime(obj.currentTime); it fix the issue

 const _onSeek = (obj: OnSeekData) => {
    if (!seeking) {
      setControlTimeout();
    }
    setCurrentTime(obj.currentTime); // <--here

    if (typeof onSeek === 'function') {
      onSeek(obj);
    }
  };