6

I have an html5 video which I am trying to set up callbacks at certain intervals during playback. The video starts playing from javascript with video.play(). Right now my code listens for the 'loadedmetadata' event, then queries the duration and sets up those callbacks. Works fine on mobile safari, but not on Android (2.3.4 and 2.3.7).

On Android, 'loadedmetadata' seems to be emitted before the duration is actually available. To test this, I logged the duration at every step of the loading process in my code to see where it can actually be read. Until video.play() and after one 'timeupdate' event, the video.duration property is 6000, regardless of the video being used. I tested this with an mp4 file and a 3gp file. Once those conditions are met, the actual duration is available.

I found this other post with similar issues [1]. The highest voted answer that wasn't accepted is how I originally set this up, and it works fine on iOS. The accepted answer also does not work, and suggests this is a webkit issue. I log the video.readyState property and see that it is '4' before the video starts playing, but the duration is still not available until after it starts playing, and the first 'timeupdate' event.

Our current workaround is querying the video.duration value, and only setting up the event callbacks when video.duration !== 6000. This is pretty ugly and I'd like to get to the bottom of it, lest this hack come back to bite. A discussion here [2] seemed to suggest that the issue may be related to encoding. That is, not encoded properly, android doesn't read the metadata correctly until the file is loaded, or perhaps at all and it calculates the duration another way.

Is there anything I can do to make this cleaner, or am I stuck with the hack for now?

[1] Problem retrieving HTML5 video duration

[2] http://www.broken-links.com/2010/07/08/making-html5-video-work-on-android-phones/

Community
  • 1
  • 1
brodney
  • 1,176
  • 2
  • 14
  • 29
  • 2
    I've used a `v.addEventListener('durationchange', repos, false);` listener to track the change, but yeah... seems like it's a WebView/Video issue on a lot of the Android builds – Offbeatmammal Mar 11 '13 at 15:59
  • 1
    Mobile Device has its own limitations so they do not load everything what a desktop browser do, in android browser, the video is not called until you play, as that will save bandwidth and reduce memory/buffer use.. I think there you can make it by default play and then use a script that will stop video after 1-2 seconds... that should serve your purpose.. – MarmiK Jul 16 '13 at 06:24

1 Answers1

0

Id use a setTimeout which calls a function to check whether the duration is available recursively.

This way the function can as soon as any information is available, display etc. the duration.

David Fariña
  • 1,536
  • 1
  • 18
  • 28