VideoJS event ended fired on start in Firefox

Question

I'm using video JS and in firefox the event "ended" gets fired at the end and at the beginning of the video play.

Take a look to that fiddle in FF: http://jsfiddle.net/planadecu/a3Chu/

In all the other browsers work correctly.

The piece of code called at the video start is the following:

var videoPlayer = _V_("video", {}, function(){
  this.addEvent("ended", function(){ 
      this.posterImage.el.style.display = 'block';
  });
});​

I need to trigger an event just at the end of the video, not at the start. Do you know a way to workaround this issue (to me its a bug) ?

You can reproduce it on the fiddle provided.

Thanks for your help.

Answer 1

I think this is a problem with your video...

Check this out: http://jsfiddle.net/a3Chu/2/

All I've done is removed this source file:

<source type="video/webm" src="http://www.reservango.com/static/video/reservango_video_vfinal_CAT.webm">

I noticed that the script is firing correctly - the video starts at the end(!)

I tried with alternate .webm files and they behaved normally, so I'm stuck thinking it's something with your file in particular.

I've used FF 15.0.1 for testing

EDIT

I've also tested this on FF 16.0.2 - still seems to be that video file in particular. You can, of course, change up the source so that the other formats are attempted first. I know that my FF will run the .ogv if the .webm is the last source item within the fiddle I modified (above). This is not going to be completely reliable however. I also found this (old FF version but same issue): https://stackoverflow.com/a/10138928/427485 which suggests the same approach.

I find it very strange that some .webm files are working... Are you able to try re-encoding the video? Also I'd check all your mime type on that server, just in case they are wrong and only FF is getting confused (wouldn't be the first time...). This would also explain why the .webm's hosted elsewhere render fine.