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

HLS + Fallback Progressive Download via HTML5


Hi,

I'm trying to setup a player that utilizes an HLS stream (which I'm currently using and works) but also has the option to load two fallback .mp4s if their on a mobile device that doesn't support HLS.

I know the m3u8 playlist and individual files work because I'm able to load it through the publish mode, however trying to combine these into one player is the goal.

Thanks in advance

Here is my code:

<div id="myElement">Loading the player...</div>
<script type="text/javascript">
var playerInstance = jwplayer("2wSLsUb1.js");
playerInstance.setup({
playlist: [{
image: "http://drcnqysx2qwcg.cloudfront.net/M01PatPreyPredator/hls_640Thumbs-00002.png",
sources: [{
file: "http://d3fk8fzsguno39.cloudfront.net/M01PatPreyPredator/M01PatPreyPredatorHLS.m3u8"
},{
file: "http://d3fk8fzsguno39.cloudfront.net/M01PatPreyPredator/320Fallback.mp4"
},{
file: "http://d3fk8fzsguno39.cloudfront.net/M01PatPreyPredator/360Fallback.mp4"
}]
}],
primary: "flash"
});
});
</script>

5 Community Answers

mark

User  
0 rated :

What version of JW Player are you using? The cloud player?
There is no need to include the primary: 'flash" in there, remove it- other than that, looks ok, is there a problem?

jlove

User  
0 rated :

JW Player 7.

Here's the code that worked oddly enough

<div id="myElement">Loading the player...</div>
<script type="text/javascript">
var playerInstance = jwplayer("myElement");
playerInstance.setup({
playlist: [{
sources: [{
file: "http://d3fk8fzsguno39.cloudfront.net/M01PatPreyPredator/M01PatPreyPredatorHLS.m3u8",
image: "http://drcnqysx2qwcg.cloudfront.net/M01PatPreyPredator/hls_640Thumbs-00002.png",
title: Video"
},{
file: "http://d3fk8fzsguno39.cloudfront.net/M01PatPreyPredator/320Fallback.mp4",
image: "http://drcnqysx2qwcg.cloudfront.net/M01PatPreyPredator/hls_640Thumbs-00002.png",
title: "Video"
},{
file: "http://d3fk8fzsguno39.cloudfront.net/M01PatPreyPredator/360Fallback.mp4",
image: "http://drcnqysx2qwcg.cloudfront.net/M01PatPreyPredator/hls_640Thumbs-00002.png",
title: "Video"
}]
}],
primary: 'flash'
});
</script>

Alex

JW Player Support Agent  
0 rated :

Hi, there!

It looks like you resolved your issue by replacing the parameter in the creation of your playerInstance variable to the name of the DIV preceding it. So, is everything working as expected?

jlove

User  
0 rated :

Hi Alex,

This works, but it actually uses JWP6 instead of 7. I've since removed the plugin for 6 from my WP instance and have loaded the cloudplayer url into the header of my site, it will not load the cloud player.

Alex

JW Player Support Agent  
0 rated :

Hi!

Can you please give me a link to a page where you have the affected player installed?

This question has received the maximum number of answers.