HTML5 video play to the end then rewind to beginning and play again

by Brett

HTML

<video id="video" autoplay>
	<source src="http://www.quirksmode.org/html5/videos/big_buck_bunny.mp4" type="video/mp4">
	<source src="http://www.quirksmode.org/html5/videos/big_buck_bunny.ogv" type="video/ogg">
</video>

CSS

video{
  display: block;
  height: 350px;
}

JavaScript

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

video.addEventListener('ended', videoEnded, false);

function videoEnded(e) {
	// After the event
  intervalRewind = setInterval( function() {
  	//video.playbackRate = 1.0;
    if(video.currentTime == 0) {
    	clearInterval(intervalRewind);
      video.play();
            
    } else {
      video.currentTime += -.5;
    }
  }, 30);       
}    

$(video).on('play', function() {
    video.playbackRate = 1.0;
    clearInterval(intervalRewind);
});