Flowplayer · Bad URL sample

See this demo for how to recover seamlessly from a bad url scenario.

<head/>

<script>

$(function () {
flowplayer().on("error", function (e, api, error) {
console.info(error.code, error.message);
});
 
$("button").click(function () {
var webm = $(this).data("href"),
mp4 = webm.slice(0, webm.lastIndexOf(".")) + ".mp4";
 
// select second player by index
flowplayer(1).load({
sources: [
{ type: "video/webm", src: webm },
{ type: "video/mp4", src: mp4 }
]
});
});
});

JavaScript

<body/>

<div class="flowplayer" data-ratio="0.4167" data-debug="true">
<video>
<source type="video/webm" src="//bad.flowplayer.org/bauhaus.webm">
<source type="video/mp4" src="//bad.flowplayer.org/bauhaus.mp4">
</video>
</div>
 
<div class="flowplayer" data-ratio="0.4167" data-debug="true">
<video>
<source type="video/webm" src="//edge.flowplayer.org/bauhaus.webm">
<source type="video/mp4" src="//edge.flowplayer.org/bauhaus.mp4">
</video>
</div>
 
<p>
<button id="good" data-href="//edge.flowplayer.org/functional.webm">
Load good URL
</button>
 
<button id="bad" data-href="//foo.flowplayer.org.webm">
Load bad URL
</button>
</p>

HTML