play multiple videos for different time duration?

Question

I am creating a page with multiple videos slide show(video playinf one by one correctly). But now I want to add time duration to each video.

I have a four videos(array in javascript) and I want to play first video(2mins video)for 15mins and second(10mins) video for 30mins and so on. Please tell me guys, how to do it?

//my code

//multiple video playing code
var videoSource = new Array();
videoSource[0] = 'Colgate.mp4';
videoSource[1] = 'Soap.mp4';
var i = 0;
var videoCount = videoSource.length;
//document.getElementById("myVideo").setAttribute("src",videoSource[0]);
function videoPlay(videoNum) {
  document.getElementById("myVideo").setAttribute("src", videoSource[videoNum]);
  document.getElementById("myVideo").load();
  document.getElementById("myVideo").play();
}
document.getElementById('myVideo').addEventListener('ended', myHandler, false);
videoPlay(1);

function myHandler() {
  i++;
  if (i == (videoCount - 1)) {
    i = 0;
    videoPlay(i);
  } else {
    videoPlay(i);
  }
}

<embed type="application/x-vlc-plugin" pluginspage="http://www.videolan.org" version="VideoLAN.VLCPlugin.2" width="100%" height="auto" id="vlc" loop="yes" autoplay="yes"></embed>
<center><video controls autoplay id="myVideo" width="100%" height="auto"></video></center>
</div>

My javascript code for one video timing is working.

var video = document.getElementById('myVideo');

var videoStartTime = 0;
var durationTime = 0;

video.addEventListener('loadedmetadata', function() {
  videoStartTime = 20;
  durationTime = 22;
  this.currentTime = videoStartTime;
}, false);
video.addEventListener('timeupdate', function() {
  if(this.currentTime > videoStartTime + durationTime){
    this.pause();
  }
});

Answer 1

Thanks Everyone for helping me    
This code is working my side

    <embed type="application/x-vlc-plugin" pluginspage="http://www.videolan.org" version="VideoLAN.VLCPlugin.2"  width="100%"  height="auto" id="vlc" loop="yes" autoplay="yes" ></embed>
    <center><video controls autoplay loop id="myVideo"  width="100%" height="auto"></video></center></div>
    <script type="text/javascript">
    var videoSource = new Array();
    videoSource[0] = 'Colgate.mp4';
    videoSource[1] = 'Soap.mp4';
    videoSource[2] = 'HeroPassion.mp4';
    videoSource[3] = 'Vodafone.mp4';
    var currentVideo = 0;
    var videoCount = videoSource.length;
    function getPlayTime(videoNum) {
      if(videoNum === 0){
      console.log("videoplay",videoNum);
        return 1*60*1000
    }
      if(videoNum === 1){
      console.log("videoplay",videoNum);
        return 2*60*1000
    }
    if(videoNum === 2){
      console.log("videoplay",videoNum);
        return 1*60*1000
    }
      if(videoNum === 3){
      console.log("videoplay",videoNum);
        return 1*60*1000
    }
    }
    function videoPlay(videoNum) {
        document.getElementById("myVideo").setAttribute("src", videoSource[videoNum]);
        document.getElementById("myVideo").load();
        document.getElementById("myVideo").play();

        setTimeout(changeVideo, getPlayTime(videoNum));
    }
    console.log("play start first time");
    videoPlay(3);

    function changeVideo() {
        console.log("enter in changeVideo function");
        currentVideo++;
        console.log("changeVideo function called");
        if (currentVideo === (videoCount - 1)) {
            currentVideo = 0;
        }
        videoPlay(currentVideo);
    }
    </script>

Answer 2

You need to setTimeout to change the video. Have a look at getPlayTime function which returns the time in miliseconds. This is the amount of time a video will be played. I hope this helps.

var videoSource = new Array();
videoSource[0] = 'Colgate.mp4';
videoSource[1] = 'Soap.mp4';

var currentVideo = 0;
var videoCount = videoSource.length;

function getPlayTime(videoNum) {
  if(videoNum == 1)
    return 10*60*1000;
  if(videoNum == 2)
    return 15*60*1000;
}

function videoPlay(videoNum) {
    document.getElementById("myVideo").setAttribute("src", videoSource[videoNum]);
    document.getElementById("myVideo").load();
    document.getElementById("myVideo").play();
    setTimeout(changeVideo, getPlayTime(videoNum));
}

videoPlay(1);

function changeVideo() {
    currentVideo++;
    if (currentVideo == (videoCount - 1)) {
        currentVideo = 0;
    }
    videoPlay(currentVideo);
}