HTML5 Video Playlist: A Brief Kludge

edited July 18 in Tech
How to create a sequential video playlist using JavaScript and the HTML5 <video> tag, despite the world conspiring against you!

More...

Comments

  • edited June 2010
    Darn it, I feel a strong desire to try and improve this. Probably with an array. Yet I should be doing my own work.
  • edited June 2010
    Do it! DOOOOOOO IIIIIIIIIIT
  • edited June 2010
    I smell delicious procrastination.
  • edited June 2010
    This worked in chrome for me:
    <script type="text/javascript">
    
       function myEndedListener(){
          var myVideo = document.getElementsByTagName('video')[0];
          myVideo.addEventListener('ended',myNewSrc,false);
       }
    
       var position = 0;
       var videoList=new Array("videoplaylisttest1.m4v",
                               "videoplaylisttest2.m4v",
                               "videoplaylisttest3.m4v");
    
       function myNewSrc() {
          var myVideo = document.getElementsByTagName('video')[0];
          if(++position >= videoList.length) {
             position = 0;
          }
          myVideo.src=videoList[position];
          myVideo.load();
          myVideo.play();
       }
    
    </script>
    
    It is infinitely expandable and cycles back to the beginning when it's done. It'd probably work in other browsers like opera and firefox if they supported the codec in your test videos. Hopefully they settle on a standard codec at some point for this stuff.
  • edited June 2010
    Awesome! I was just going off of the buggy code from the sample but figured there had to be a simpler way to accomplish the task.