Trouble using fullscreen API on Android 4.4.2


#1

I’m having trouble making a video player element fullscreen using the fullscreen API, specifically webkitRequestFullScreen. I’m specifically having trouble with my Ionic app on a Samsung Galaxy S4 running 4.4.2. Here’s what I’m trying to doing.

$scope.goFullscreen = function() {
		var elem = document.getElementById("video_element");
		var requestMethod = elem.requestFullScreen || elem.webkitRequestFullScreen;

		  if (requestMethod) { // Native full screen.
		    requestMethod.call(elem);
		    console.log("requested fullscreen");
		  }
	};

The function is firing but nothing happens, no errors, nothing. I tried the same function in a simple Cordova app and it works. I’ve tried a couple of other players in my app such as Video.js and it’s fullscreen button doesn’t work either. Anyone else having this problem?


#2

Are you using Crosswalk? I’ve found dealing with video in WebView to be a bad experience.


#3

The fullscreen api is still a work-in-progress

http://caniuse.com/#feat=fullscreen


#4

Not using Crosswalk yet as I’m having trouble building my app with it added because of a Cordova plugin. Yes I’ve found dealing with video in the WebView to be enormously painful, especially HLS which already has very poor support in Android.


#5

For anyone else coming across this thread I’ve resorted to using this native video player Cordova plugin since browser based fullscreen support is so spotty:


#6

Hi ,
I am trying to do that but it is creating another issue , it doesn’t allow to place footer above the keyboard. I followed http://ionicframework.com/docs/api/page/keyboard/ this link but it id not working. if there is something else let me know.

Thanks