2
votes

I've set up an HTML5 player (using video.js) which plays and advertisement video before the video itself.

Problem comes on iPhone devices, when Safari is calling the native iOS player to play through the video with seeking controls wihich permits the user to easily skip ads.

check this out

I've applied the attribute "playisinline" and "webkit-playisinline" into the tag and this is working ONLY on iOS 10 (by the way, you can apply this natively on next update), but on iOS 9 it still shows native playaer with seeking possibilities.

I've tryied to use this as suggested here elsewhere but it is very buggy and giving conflicts in my player implementation.

I just need to control the fullscreen native player and avoid seeking by resetting the current playback time into that, but I can't find how to do this.

Any help appreciated.

1
@Macro Bortone- Did u find a solution for this? if yes, can u help me to resolve this, I wanna prevent user from seek to end of the ads.Stella

1 Answers

0
votes

Have you tried the below snippet ? It will prevent seeking forward.

The idea is quite simple, using an interval to grab the current position every second. If the seeking position is greater than the current position, then set it back. It is only a workaround :)

if (document.getElementById("vid1")) {
  videojs("vid1").ready(function() {
    
    var myPlayer = this;

    //Set initial time to 0
    var currentTime = 0;
    
    //This example allows users to seek backwards but not forwards.
    //To disable all seeking replace the if statements from the next
    //two functions with myPlayer.currentTime(currentTime);

    myPlayer.on("seeking", function(event) {
      if (currentTime < myPlayer.currentTime()) {
        myPlayer.currentTime(currentTime);
      }
    });

    myPlayer.on("seeked", function(event) {
      if (currentTime < myPlayer.currentTime()) {
        myPlayer.currentTime(currentTime);
      }
    });

    setInterval(function() {
      if (!myPlayer.paused()) {
        currentTime = myPlayer.currentTime();
      }
    }, 1000);

  });
}
<link href="http://vjs.zencdn.net/4.12/video-js.css" rel="stylesheet"/>
<script src="http://vjs.zencdn.net/4.12/video.js"></script>
<video id="vid1" src="http://clips.vorwaerts-gmbh.de/big_buck_bunny.mp4" controls class="video-js vjs-default-skin vjs-big-play-centered" width="640" height="360" preload="auto"></video>