JWPlayer Show image on error
I am using player.onError event handling (JWPlayer 6) to load a error.mp4 video when our livestream is offline or not available.
Problem with this is that the error video is reloaded once it ends which creates 1-2 seconds of loading time and doesn't look good.
I read in few posts in JWPlayer forum that its possible to show a image aswell or even replace the player itself with a custom image in event handling, but none of the posts in forum actually provided the way to do so.
My current code is as follows:
<div id="myElement">Loading the player...</div>
<script type="text/javascript">
var playerInstance = jwplayer("myElement");
playerInstance.setup({
file: "rtmp://62.210.247.57:1935/live/live",
title: 'OneStream',
});
console.log('Error1');
playerInstance.onError(function(){
console.log('onError');
playerInstance.load({file:"streamError.mp4",image:"http://content.jwplatform.com/thumbs/7RtXk3vl-480.jpg"});
});
playerInstance.onComplete(function(){
console.log('onComplete');
playerInstance.load({file:"rtmp://62.210.247.57:1935/live/live",image:"http: //content.jwplatform.com/thumbs/7RtXk3vl-480.jpg"});
});
</script>
I want to use a static error.png image so I can use the onBuffer event or such to check the RTMP livestream in realtime and when its online, load it instead.
