Name is required.
Email address is required.
Invalid email address
Answer is required.
Exceeding max length of 5KB

Embedding MP4 on Android

Hi,

I'm trying to implement a page similar to your empbedding example here :

http://support.jwplayer.com/customer/portal/articles/1406723-mp4-video-embed

Your example page works well on an Android phone. I try to load the same video as your example on my page but when I click the play button, it takes me to your site instead of playing the video. So I looked at your page's source and it turns out you are using an external button as well as an external control bar. You are not using the jwplayer's built-in buttons and controls. If you are trying to show how well your player can play mp4 on any platform, why would you create a sample page that makes it look so easy but in truth, it is not. Here is my page:

delta-live.mediasocial.tv/mobile/index.html

It loads the video and then every 2 minutes, it tries to reload the video and play it. Neither option works.
I would like to simulate how your sample page works. If you don't mind, can you share how to do this and also share the un-minified version of the javascript file that controls the sample page ? Thanks.

27 Community Answers

Up Down

lrmpham

User  
0 rated :

FYI, you'll need to load both pages on an Android phone to see what I mean.

Up Down

MisterNeutron

User  
0 rated :

Can this simple page play a video on any platform?

http://misterneutron.com/JW6video/

You've got over 1500 lines of code, just to play a video. Overkill, anyone?! There are so many things happening on that page, it's virtually impossible to debug. But you certainly can't use width: 100% with height: 180.

You don't need to tinker with the JW Player Javascript. There's no need to start customizing it, and doing so can only lead to problems.

Up Down

lrmpham

User  
0 rated :

There are a lot more to that page than simply playing a video, but I was just providing a link to a player. Yes, I could have mocked up something simpler, but if you search for 'jwplayer' on that page, it is simple enough to find the setup and play settings. The link that you provided does the same thing as the JWPlayer sample mp4 embed page. It uses external play buttons and external control buttons. Why can't they provide a simple example using the jwplayer control's built-in buttons and controls ? Or, is there a problem with that and embedding mp4s ? FYI, the non-minified javascript that I was referring to is the script for the example page, not for the jwplayer control itself. Thanks for looking.

Up Down

lrmpham

User  
0 rated :

Nevermind, I see what you are saying regarding the player. I did not realize that the jwplayer.js file sets up all the buttons and controls external to the player itself. Thanks.

Up Down

Cooper Reid

JW Player Support Agent  
0 rated :

Were you able to get this resolved? http://support.jwplayer.com/customer/portal/articles/1406723-mp4-video-embed
Cooper

Up Down

lrmpham

User  
0 rated :

Yes and No. Thanks to MisterNeutron I created a simpler page here:

http://delta-live.mediasocial.tv/mobile/jwplayer6.htm

It loads a video in the player and waits 30 seconds then load a second video and tries to auto-play the second video. When it tries to play the second video, the player just sit there and spins. However, if I load the page, and immediately click the play button to play the first video, then pause it, then wait for the second video to load, then it will play the second video automatically. Is this a permission issue on Android and iOS ? So that the user has to explicitly click on the player first to give it "permission" to play on their phone ? Any way to detect if the permission has been given and auto play, and If permission has not been given then it will not try to auto-play ? Thanks.

Up Down

MisterNeutron

User  
0 rated :

Autoplay will not work on any mobile device. They are designed to prevent this, no matter what script you're using.

Up Down

lrmpham

User  
0 rated :

Correct, but is there a way to detect if the permission has been given to the player so that if I programmaticaly load a second video and tell it to play, it will play ? Because obviously, autoplay will work for the second video if you manually click the play button on the first video.

Up Down

lrmpham

User  
0 rated :

One more bit of information. After loading the second video, if I seek forward an X amount of seconds, the player would show a continuous spinning icon. If I click on the spinning icon, it would play the video but back at the beginning, and not where I want it to seek to. Is there any workaround for this on Android or iOS phone, so that the play button would show up instead of the spinning icon and it would seek to the proper time when playing ? Thanks.

Up Down

Cooper Reid

JW Player Support Agent  
0 rated :

There is no content on the link you provided.

Up Down

lrmpham

User  
0 rated :

Sorry, we had a problem with the server but it is up now.
So just to summarize our findings and questions we have:
Here is the sample URL to load on your Android phone in Chrome:

http://delta-live.mediasocial.tv/mobile/jwplayer6.htm

This page loads video 1 in to jwplayer. After 20 seconds it loads video 2, seek 10 seconds into video 2, and tries to autoplay video 2. Here is what we find:

1. If user does not manually play video 1, when video 2 loads and tries to autoplay, jwplayer will just display a spinning icon. We know that it won't autoplay but can jwplayer display a Play button instead of the spinning icon ?
2. If user manually play video 1, when video 2 loads, it WILL autoplay video 2. However, it does not seek 10 seconds into video 2. Is there a workaround for that ?

Thanks.

Up Down

Cooper Reid

JW Player Support Agent  
0 rated :

You’re javascript has some errors:

_loadVideo: function _loadVideo() {
jwplayer(‘myElement’).stop();
//jwplayer(“mainVideo”).load([{ file: _nextVideoURL}]);
jwplayer(‘myElement’).load([{ file: “http://content.jwplatform.com/videos/HkauGhRi-640.mp4”}]);
jwplayer(‘myElement’).seek(10);
jwplayer(‘myElement’).play(true);
};

should be

function _loadVideo() {
jwplayer(‘myElement’).stop();
//jwplayer(“mainVideo”).load([{ file: _nextVideoURL}]);
jwplayer(‘myElement’).load([{ file: “http://content.jwplatform.com/videos/HkauGhRi-640.mp4”}]);
jwplayer(‘myElement’).seek(10);
jwplayer(‘myElement’).play(true);
};

-Cooper

Up Down

lrmpham

User  
0 rated :

Not sure what the error was, and I made the fix by copying your code, but nothing has changed. Same errors.

Up Down

Cooper Reid

JW Player Support Agent  
0 rated :

You should be using ‘onComplete’ instead of setting an interval.
jwplayer().onComplete(loadVideo);
Cooper

Up Down

lrmpham

User  
0 rated :

I need to use an interval to simulate how my app works. Basically, it is a "broadcasting" tool where the user can schedule a video to play at a certain time.

Up Down

Cooper Reid

JW Player Support Agent  
0 rated :

You can use `onTime` if you wish to bind behavior to a specific point during playback:
http://support.jwplayer.com/customer/portal/articles/1413089-javascript-api-reference#seek
Cooper

Up Down

lrmpham

User  
0 rated :

I don't need to do things at a certain point during playback. I just need to advance to a certain point before playing the video. Like when a video is scheduled to start at 10AM and someone comes in at 10:10AM, I need to advance the video 10 minutes before playing.
Do you have any feedback regarding my other question about the spinning icon ? Thanks.

Up Down

Cooper Reid

JW Player Support Agent  
0 rated :

On mobile, you cannot autoplay, this also includes seeking prior to manually playing the video. If you are trying to call seek on mobile without the video in a playing state, you might experience issues.
Cooper

Up Down

lrmpham

User  
0 rated :

Ok, but just to confirm, after I manually play the first video, it WILL autoplay the second video. You say I will not be able to seek prior to playing the video, can I seek AFTER the video is playing ? Also, is there a way to get rid of the spinning icon ? Thanks,

Up Down

Cooper Reid

JW Player Support Agent  
0 rated :

Yes, you should be able to seek while the video is playing without issues. There is no way to hide the spinning icon – this means that the player is buffering or something went wrong in the case of autoplaying on mobile.
Cooper

Up Down

lrmpham

User  
0 rated :

UPDATE: I changed the code to seek AFTER play and it seeks correctly. So I think the only thing left on this issue is to get rid of the spinning icon and replacing it with a regular play button. Thanks.

Up Down

lrmpham

User  
0 rated :

UPDATE: I modified the code to use onPlay then Seek. So I load the second video, which displays the Play icon correctly. When I manually click the Play icon, the onPlay event fires but it does not seek. Please advise. Thanks.

Up Down

Cooper Reid

JW Player Support Agent  
0 rated :

You may have to use a setTimeout in order to get the timing right -
Cooper

Up Down

lrmpham

User  
0 rated :

So I used the setTimeout to try and time the seek properly (after jwplayer has loaded the second video, but has mix results. Here is what I did to the page:

There are 2 jwplayer instances on the page.
Both loads a wildlife video when the page loads, but does not play.
After 10 seconds, the top player loads a 47 seconds video, and the bottom player loads a 27 minutes video.
Both player responds to the onPlay event, where both uses the setTimeout to do a seek after x number of seconds. If I used 3 seconds as the timeout for both players, only the top player will seek properly. The bottom player does not seek at all. If I extend the timeout of the bottom player to 9 seconds, then it will seek but by then, the video would have been playing for 9 seconds, which I don't want it to do.
So it seems there is a buffering before play and if the video is long, it takes time to buffer before it will actually play, by which time, the timeout would have expired and it won't seek.
The onPlay event will fire as soon as I manually click the play button, even though it looks like it is still buffering. Is there a property I can monitor so that I can know EXACTLY when the player will start playing ? Thanks.


Up Down

lrmpham

User  
0 rated :

UPDATE: If after 10 seconds, I let both players load the second video, and then I wait a minute or so before pressing the play button, then it will IMMEDIATELY play and it will seek properly. So it does look like there is some buffering being done before playing. I just need to know at what point is the player ready to play. Thanks.

Up Down

lrmpham

User  
0 rated :

Any comments/answers to my question ? Thanks.

Up Down

Cooper Reid

JW Player Support Agent  
0 rated :

I don’t have an explanation to the behavior you are seeing, but is there any reason why you can’t just listen for playback-readiness by using the onPlay event handler?
http://support.jwplayer.com/customer/portal/articles/1413089-javascript-api-reference
-Cooper

This question has received the maximum number of answers.