Video playback resume
Open, ConfirmedPublic

Description

Usability improvement: video playback resume.

This seemed a great staring point, but even getting the example code to run seems not to work https://github.com/Reelhouse/videojs-resume

Details

Type
To Do

The end code I put together as an example seemed to work ok outside of the current code base. Should be able to be modified to fit in an external script.

<script>
        var player = videojs('player');

	$('#player').click(function(){
		localStorage.setItem("playHead", Math.round(parseInt(player.currentTime())));
	});
        $('button').click(function(){
            if(localStorage.getItem("playHead")) {
            	player.currentTime(parseInt(localStorage.getItem("playHead")));
		player.play();
            }
        });
</script>

Hi Pete. Thanks for providing this code. In the example that you provide on http://peterrobie.com/blenderCloud/ I noticed that the pause button does not pause the video anymore, but it causes it to restart playback from the stored location. Do you have any fix for that?

Hi Francesco and thank you for pointing that out. I revised the code and checked to make sure that all buttons function properly. This should function correctly in any HTML5 browser. Let me know if you have any other questions.

<script>
    $('document').ready(function(){
        var player = videojs('player');

        $('#player').click(function(){
            localStorage.setItem("playHead", Math.round(parseInt(player.currentTime())));
        });
        $('button').click(function(){

            var Title = $(this).attr("title");

            switch(Title) {
                case 'Pause':
                    console.log("Switch: Pause");
                    localStorage.setItem("playHead", Math.round(parseInt(player.currentTime())));
                    break;
                
                case 'Play':
                    console.log("Switch: Play");
                    player.play();
                    break;

                case 'Resume':
                    console.log("Switch: Resume");
                    player.currentTime(parseInt(localStorage.getItem("playHead")));
                    player.pause();
                    break;

                default:
            }
        });
    });
</script>

Hi Peter,

Thanks for the update. Did you update the demo online as well? I still could not get a reliable payback resume there.
Regarding the code, could you confirm that currently the playhead time is now store only if the video is paused before reloading the page?

Before merging this code we need to take care of some other issue, like associating the playhead with a specific video. Are you available to do it when the time comes?

Thanks!