Add video.js source link fallback

This commit is contained in:
calzoneman 2016-08-11 21:07:06 -07:00
parent 050dec4d0f
commit 6ebd4af490
2 changed files with 32 additions and 7 deletions

View File

@ -53,14 +53,15 @@ window.VideoJSPlayer = class VideoJSPlayer extends Player
.attr(width: '100%', height: '100%') .attr(width: '100%', height: '100%')
removeOld(video) removeOld(video)
sources = sortSources(data.meta.direct) @sources = sortSources(data.meta.direct)
if sources.length == 0 if @sources.length == 0
console.error('VideoJSPlayer::constructor(): data.meta.direct console.error('VideoJSPlayer::constructor(): data.meta.direct
has no sources!') has no sources!')
@mediaType = null @mediaType = null
return return
sources.forEach((source) -> @sourceIdx = 0
@sources.forEach((source) ->
$('<source/>').attr( $('<source/>').attr(
src: source.src src: source.src
type: source.type type: source.type
@ -84,6 +85,16 @@ window.VideoJSPlayer = class VideoJSPlayer extends Player
@player = videojs(video[0], autoplay: true, controls: true) @player = videojs(video[0], autoplay: true, controls: true)
@player.ready(=> @player.ready(=>
@player.on('error', =>
err = @player.error()
if err and err.code == 4
console.error('Caught error, trying next source')
@sourceIdx++
if @sourceIdx < @sources.length
@player.src(@sources[@sourceIdx])
else
console.error('Out of sources, video will not play')
)
@setVolume(VOLUME) @setVolume(VOLUME)
@player.on('ended', -> @player.on('ended', ->
if CLIENT.leader if CLIENT.leader

View File

@ -510,19 +510,20 @@
VideoJSPlayer.prototype.loadPlayer = function(data) { VideoJSPlayer.prototype.loadPlayer = function(data) {
return waitUntilDefined(window, 'videojs', (function(_this) { return waitUntilDefined(window, 'videojs', (function(_this) {
return function() { return function() {
var sources, video; var video;
video = $('<video/>').addClass('video-js vjs-default-skin embed-responsive-item').attr({ video = $('<video/>').addClass('video-js vjs-default-skin embed-responsive-item').attr({
width: '100%', width: '100%',
height: '100%' height: '100%'
}); });
removeOld(video); removeOld(video);
sources = sortSources(data.meta.direct); _this.sources = sortSources(data.meta.direct);
if (sources.length === 0) { if (_this.sources.length === 0) {
console.error('VideoJSPlayer::constructor(): data.meta.direct has no sources!'); console.error('VideoJSPlayer::constructor(): data.meta.direct has no sources!');
_this.mediaType = null; _this.mediaType = null;
return; return;
} }
sources.forEach(function(source) { _this.sourceIdx = 0;
_this.sources.forEach(function(source) {
return $('<source/>').attr({ return $('<source/>').attr({
src: source.src, src: source.src,
type: source.type, type: source.type,
@ -549,6 +550,19 @@
controls: true controls: true
}); });
return _this.player.ready(function() { return _this.player.ready(function() {
_this.player.on('error', function() {
var err;
err = _this.player.error();
if (err && err.code === 4) {
console.error('Caught error, trying next source');
_this.sourceIdx++;
if (_this.sourceIdx < _this.sources.length) {
return _this.player.src(_this.sources[_this.sourceIdx]);
} else {
return console.error('Out of sources, video will not play');
}
}
});
_this.setVolume(VOLUME); _this.setVolume(VOLUME);
_this.player.on('ended', function() { _this.player.on('ended', function() {
if (CLIENT.leader) { if (CLIENT.leader) {