Youtube Iframe API : How to listen skip events?, when user try to skip video how to get notified prevent it from happening

Question

I am trying to find if there is any way in youtube frame API that we get notified when users try to skip the video and prevent it.

My code

function onYouTubePlayerAPIReady() {
  player = new YT.Player("ytplayer", {
    height: "360",
    width: "640",
    videoId: getQueryStringParam("videoID"),

    events: {
      onReady: onPlayerReady,
      onStateChange: onPlayerStateChange,
      onPlaybackQualityChange: onPlaybackQualityChange,
      onPlaybackRateChange: onPlaybackRateChange,
      onError: onError,
      onApiChange: onApiChange,
    },
  });
}

its an example i want you to focus on events part of that code there is onStateChange which notified me when video is paused or started and code for onStateChange is

function onPlayerStateChange(event) {
  switch (event.data) {
    case YT.PlayerState.ENDED:
      console.log('ended')
      break;
    case YT.PlayerState.PLAYING:
      console.log("playing....");
      break;
    case YT.PlayerState.PAUSED:
      console.log("paused....");
      break;
  }
}

so i want something like this when user try to skip video and then prevent it from hapening.

score 2 · Accepted Answer · answered Sep 20 '21 at 09:53

2

Youtube API does not have a listener for skip or seek. You will need to write some custom code. One way to do it is to create an interval of 1sec or more and check the difference between play times.

What I instead chose to do for flexibility is use a different progress bar and attach events from progress bar to the player. This way you can control player much better.

Also, you can completely disable controls on Yt player by using:

 playerVars: { 'controls': 0 }

Check out this issue for more details on implementation: How to listen to seek event in youtube embed api

answered Sep 20 '21 at 09:53

Giorgi Andriadze

306
2
8

after disabling controls can I allow users to see the video in fullscreen? – Aditya Dev Sep 20 '21 at 09:58
Yes, but you will have to also do it from JS. Check out this issue: https://stackoverflow.com/questions/15114884/make-youtube-video-fullscreen-using-iframe-and-javascript-api – Giorgi Andriadze Sep 20 '21 at 10:02
I checked now, user can still skip the video by using player.seekTo(5) is there is any way to disable it – Aditya Dev Sep 20 '21 at 10:25
There's no official way of disabling that. If you want to go that far you can try overriding functions on player class, maybe that will help. – Giorgi Andriadze Sep 22 '21 at 07:00

Youtube Iframe API : How to listen skip events?, when user try to skip video how to get notified prevent it from happening

1 Answers1