html5 video on Android 4: play fullscreen then redirect to another webpage - not working

Question

I\'m designing an html5 page for Android 4 smartphones with a single 3gpp (or mp4) video that has to autoplay fullscreen when opened; when video ends should redirect to another

Answer 1

I've recently had a similar problem. After hours of searching the web, here's how i made it work:

Before invoking the "play()" method, use the "load()" method. So in your code:

    function playVideo() {
        var video = document.getElementById("video");
        video.addEventListener('ended', videoEnd, false);
        video.webkitEnterFullScreen();
        video.load();
        video.play();
    }

I;ve teste on android 2.2, 2.3 and IPhone 3 and it works. However it doesn't seem to play on android 4.0.

P.S.

If you want to redirect when the video finishes playing use this event:

var video = document.getElementById("video");
video.addEventListener("ended",doSomething,true);

function doSomething() {
     //your redirect code here
}

Answer 2

I have some suggestion which might help you,

This will be applicable for the Android web view Application not android web application.

You can either create the android hook up or the android web view client, the pass the values as the variable (Query String) and play the video from the Android native, where you have all the control.

Please find the code for the playing the video.

enter code here

public void videoPlayer(String path, String fileName, boolean autoplay){
getWindow().setFormat(PixelFormat.TRANSLUCENT);
//the VideoView will hold the video
VideoView videoHolder = new VideoView(this);
//MediaController is the ui control howering above the video (just like in the default youtube player).
videoHolder.setMediaController(new MediaController(this));
//assing a video file to the video holder
videoHolder.setVideoURI(Uri.parse(path+"/"+fileName));
//get focus, before playing the video.
videoHolder.requestFocus();
if(autoplay){
    videoHolder.start();
}

}

If you want to implement kind of bright cove then contact me i will help for the HTML 5

Cheers

Answer 3

I know this is an old post, but someone may be looking for this. Personally I just hide the video-element (with a simple jquery $videoElement.hide()) after the video finished, which brings me back to the browser automatically.

We have tested this on several mobile devices (iOS and Android).

I still have another problem though, which is that now my browser seems to be fullscreen (which causes other problems in my case).

Answer 4

It seems in later versions of android, programmatic video.play() requires explicit authorization from the WebView. eg

settings.setMediaPlaybackRequiresUserGesture(false);