Html5 video function should have only one video to play

Question

Based on this function, how can I have only the first video to play? I'm not longer need the second one on this function!

this video was initially created to play 2 videos, where the second one was looping through. Really clever but it gives me black flashes on ie9, which I can't fix.

  (function($) {$.fn.videoLoop = function (options) { function changeVideoSrc(vidObj,vidEl){ vidEl.html(""); vidObj.media.forEach(function(obj){ console.log(obj); vidEl.append($("<source>").attr("src",obj.src).attr("type",obj.format)); }); } var video = this, videoEl = video[0], selVideoIdx = 0; options = options || {}; var playlist = options.playlist || [], poster = options.poster || "http://placehold.it/1024x768/FFFFFF/FFFFFF"; if (playlist.length > 1) { var firstvid = playlist[selVideoIdx % playlist.length]; changeVideoSrc(firstvid,video); video.attr('poster', poster); video.attr('autoload', true); video.attr('autoplay', true); selVideoIdx++; video.on('loadedmetadata', function () { videoEl.currentTime = 0.5; videoEl.play(); }).bind('ended', function () { var currentvid = playlist[selVideoIdx % playlist.length]; changeVideoSrc(currentvid,video); videoEl.loop = true; videoEl.load(); selVideoIdx++; }); } }; var video1 = {}; video1.title = 'FIRST'; video1.media = [{'format':'video/mp4','src':'http://www.w3schools.com/html/mov_bbb.mp4'},{'format':'video/ogv','src':'http://www.w3schools.com/html/mov_bbb.ogv'}]; var video2 = {}; video2.title = 'LOOP'; video2.media = [{'format':'video/mp4','src':'http://media.w3.org/2010/05/sintel/trailer.mp4'},{'format':'video/ogv','src':'http://media.w3.org/2010/05/sintel/trailer.ogv'}]; var data = {}; data.playlist = [video1,video2]; data.poster = "http://placehold.it/1024x768/000000/FFFFFF" $('#start').videoLoop(data); }(jQuery)); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div class="video-start target"> <video id="start" width="400" height="300" controls> Your browser does not support the video tag. </video> </div> 

Answer 1

The simplest solution is to modify two lines of code

if (playlist.length > 1) {

should be

if (playlist.length > 0) {

and

data.playlist = [video1,video2];

Can be changed so that instead of passing two values to the array, pass just the one!

data.playlist = [video1];