MediaElement.JS & setCurrentTime () for iPad

Question

I am currently using MediaElement.js for an HTML5 video page on my site.

I keep the position of the video when the user leaves the page / site to return to where they left off.

I got this working in a browser, however, when I try to do this for the iPad, I cannot use setCurrentTime() .

I tried using the following in a game event, and the loadedmetadata event both worked fine in Chrome, but not in the iPad.

 player.addEventListener('loadedmetadata', function (e) { if (savedPosition > 0) { // Debug console.log('[StartFrom]' + savedPosition); // Set the start time from the relation in seconds player.setCurrentTime(savedPosition); // Debug console.log('[CurrentPosition]' + player.currentTime); // Set the video has played flag - so if paused and played it is not // reset to start time videoHasPlayed = true; } }, false); 

Does anyone have smart ideas on how to help me solve this problem? https://github.com/johndyer/mediaelement/issues/243

Answer 1

I found a solution to my own problem, after various bits of research, I moved the code to the timeupdate event, and it works fine on the iPad and now on the desktop.

Make sure you use a boolean to stop the logic entering a crazy loop.

  //EVENT - When the video time has been updated player.addEventListener('timeupdate', function (e) { //If video has not been played AND savedPosition is greater than 0 if (!videoHasPlayed && savedPosition > 0) { //Debug console.log('[StartFrom - meta]' + savedPosition); //Set the start time from the relation in seconds (MediaElement) player.setCurrentTime(savedPosition); //Debug console.log('[CurrentPosition - meta]' + player.currentTime); //Set the video has played flag //Otherwise be continual loop of going back to this time //This event gets called around every 250ms videoHasPlayed = true; } }, false);