android html5 video fullscreenchange not called on entering fullscreen

Question

I have an app running via cordova/phonegap on android. We lock the orientation to portrait but if a user plays a video we would like to toggle landscape. I followed this post but I cannot make it work because the fullscreenchange event is only fired on leaving the fullscreen via the backbutton, but not on entering the fullscreen via clicking the video controls' fullscreen-button.

Here's the code:

$(document).on('webkitfullscreenchange fullscreenchange', handler) // -> handler not called on entering fullscreen

Could this be a browser bug? Anyone else experienced this issue or got another solution/workaround?

Tested on Android 4.x.

EDIT: Could that be the reason? http://caniuse.com/#feat=fullscreen (no fullscreen support for android) - but it does fire on leaving the fullscreen via the backbutton...

mwager mwager · Accepted Answer · 2014-11-24T13:47:53

Seems like the webkitbeginfullscreen event is getting fired.

So now I probably will use something like this:

videoEl.addEventListener('webkitbeginfullscreen', function() {
    screen.lockOrientation('landscape-primary');
}, false);
videoEl.addEventListener('webkitendfullscreen', function() {
    screen.lockOrientation('portrait-primary');
}, false);

See https://stackoverflow.com/a/22010698/2235793

NOTE: theses two events are not fired on a nexus 5 running android 4.4.4 (inside cordova v3.6). But there, webkitfullscreenchange event is fired on enter and exit. Sigh.

android html5 video fullscreenchange not called on entering fullscreen

1 Answers