HTML5 Video Play sequence of video segments using ....mp4#t=2,4 and setTimeOut //with name space + more accurate pause

HTML5 Video Play sequence of video segments using format http://solutions.brightcove.com/bcls/assets/videos/Bird_Titmouse.mp4#t=2,4 and setTimeOut

by Pietro Passarelli

HTML

<video id="preview" width="400">
  <!--   <source src="" type="video/mp4"> -->
  <!--   <source src="" type="video/ogg"> -->
  Your browser does not support HTML5 video.
</video>

<button id="playButton">play</button>
<button id="pauseButton">pause</button>
<button id="stopButton">Stop</button>

JavaScript

/* HTML5 Video Play sequence of video segments using format, and `setTimeout`.
http://solutions.brightcove.com/bcls/assets/videos/Bird_Titmouse.mp4#t=2,4
- Working
*/

//sample sequence of video segments, array of objects with src, in point, and outpoint.
var playlist = [{
  "src": "http://solutions.brightcove.com/bcls/assets/videos/SeaTurtle.mp4",
  "startTime": 3,
  "endTime": 6
}, {
  "src": "http://solutions.brightcove.com/bcls/assets/videos/Water-Droplet.mp4",
  "startTime": 1,
  "endTime": 3
}, {
  "src": "http://dl1.webmfiles.org/big-buck-bunny_trailer.webm",
  "startTime": 1,
  "endTime": 6
}, {
  "src": "http://solutions.brightcove.com/bcls/assets/videos/Water-Droplet.mp4",
  "startTime": 1,
  "endTime": 3
}]

//// to try with webm video eg nwjs that does not support mp4
//var videoSequence = [{"src": "http://dl1.webmfiles.org/big-buck-bunny_trailer.webm", "startTime":3.2 , "endTime":6},{"src": "http://dl1.webmfiles.org/elephants-dream.webm", "startTime": 1, "endTime":3},{"src": "http://dl1.webmfiles.org/big-buck-bunny_trailer.webm", "startTime": 10, "endTime":15}]

var playBtn = document.getElementById("playButton");
var stopBtn = document.getElementById("stopButton");
var pauseBtn = document.getElementById("pauseButton");
var video = document.getElementById("preview");
window.app = {};
window.app.papereditPreview = {};

window.app.papereditPreview.counter = 0;
window.app.papereditPreview.numberOfClips = playlist.length - 1;
window.app.papereditPreview.timer;
window.app.papereditPreview.pausedState = {};
window.app.papereditPreview.pausedState.paused = false;

function playSequence(playlist) {
  var segment = playlist[window.app.papereditPreview.counter];
  video.setAttribute("src", segment.src + "#t=" + segment.startTime + "," + segment.endTime);
  video.load;
  if(window.app.papereditPreview.pausedState.paused ){
  	video.currentTime = parseFloat(window.app.papereditPreview.pausedState.resumedTime);
  	window.app.papereditPreview.pausedState.paused  =...