From 9c94490fab258830b53c204d4ccf6728adde3515 Mon Sep 17 00:00:00 2001 From: Vincent Vanwaelscappel Date: Wed, 7 Jun 2017 17:35:20 +0200 Subject: [PATCH] done #1459 @1 --- js/libs/fluidbook/fluidbook.video.js | 760 +++++++++++++-------------- 1 file changed, 380 insertions(+), 380 deletions(-) diff --git a/js/libs/fluidbook/fluidbook.video.js b/js/libs/fluidbook/fluidbook.video.js index 1a81ae6f..73c42f73 100644 --- a/js/libs/fluidbook/fluidbook.video.js +++ b/js/libs/fluidbook/fluidbook.video.js @@ -1,390 +1,390 @@ function FluidbookVideo(fluidbook) { - var $this = this; - - this.players = {}; - - $(fluidbook).on('changePage', function (e, page) { - $this.removeAllVideos(); - }); - - $(window).on('fluidbookresize', function (e) { - $this.resizeControls(); - }); - - this.fluidbook = fluidbook; - this.flash = FlashDetect.installed && FlashDetect.major >= 9; - this.video = (Modernizr.video && (Modernizr.video.h264 || Modernizr.video.webm || Modernizr.video.ogg)) != false; - - this.videoFormats = []; - - var probably = []; - var maybe = []; - var not = []; - // if (Modernizr.ftouch && this.flash) { - // maybe.push('flv'); - // } - - if (this.video) { - var formats = this.fluidbook.datas.videoFormats; - for (var i = 0; i < formats.length; i++) { - var f = formats[i]; - if (f == 'mp4') { - f = 'h264'; - } - if (f == 'ogv') { - f = 'ogg'; - } - var support = Modernizr.video[f]; - if (f == 'ogg') { - f = 'ogv'; - } - if (f == 'h264') { - f = 'mp4'; - } - if (support == 'probably') { - probably.push(f); - } else if (support == 'maybe') { - maybe.push(f); - } else { - not.push(f); - } - } - } - // if (!Modernizr.ftouch && this.flash) { - // maybe.push('flv'); - // } - - - this.videoFormats = $.merge(probably, maybe, not); - this.preferedFormat = this.videoFormats[0]; + var $this = this; + + this.players = {}; + + $(fluidbook).on('changePage', function (e, page) { + $this.removeAllVideos(); + }); + + $(window).on('fluidbookresize', function (e) { + $this.resizeControls(); + }); + + this.fluidbook = fluidbook; + this.video = (Modernizr.video && (Modernizr.video.h264 || Modernizr.video.webm || Modernizr.video.ogg)) != false; + + this.videoFormats = []; + + var probably = []; + var maybe = []; + var not = []; + + if (this.video) { + var formats = this.fluidbook.datas.videoFormats; + for (var i = 0; i < formats.length; i++) { + var f = formats[i]; + if (f == 'mp4') { + f = 'h264'; + } + if (f == 'ogv') { + f = 'ogg'; + } + var support = Modernizr.video[f]; + if (f == 'ogg') { + f = 'ogv'; + } + if (f == 'h264') { + f = 'mp4'; + } + if (support == 'probably') { + probably.push(f); + } else if (support == 'maybe') { + maybe.push(f); + } else { + not.push(f); + } + } + } + // if (!Modernizr.ftouch && this.flash) { + // maybe.push('flv'); + // } + + + this.videoFormats = $.merge(probably, maybe, not); + this.preferedFormat = this.videoFormats[0]; } FluidbookVideo.prototype = { - initVideo: function (e) { + initVideo: function (e) { - var $this = this; + var $this = this; - if ($(e).html() != '') { - return; - } + if ($(e).html() != '') { + return; + } - // if ($('#videoPopup').length == 0) { - // $('body').append('
'); + // if ($('#videoPopup').length == 0) { + // $('body').append('
'); // - // $(document).on('click touchend', '.videoPopupLink', function(e) { - // e.preventDefault(); - // $this.openVideo(this); - // return false; - // }); - // } - - var id = $(e).data('id'), - width = parseFloat($(e).data('width')), - height = parseFloat($(e).data('height')), - name = $(e).data('name'), - controls = $(e).data('controls'), - loop = $(e).data('loop'), - sound = $(e).data('sound'), - autoplay = $(e).data('autoplay'), - setup = $(e).data('setup'), - path, - poster, - html, - player; - - //fb('Initialising video ID: ' + id); - - // Player might be active but not visible so we need to dispose of it before re-initialising the element - if (videojs.players[id]) { - //fb(id + ' player already active. Disposing...'); - videojs(id).dispose(); - } - - - if (fluidbook.datas.mobileVideosPath == '') { - path = "data/links/" + name; - } else { - path = fluidbook.datas.mobileVideosPath + name; - if (!fluidbook.datas.standalone && path.substr(0, 3) == '../') { - path = '../' + path; - } - } - - if (name !== '') { - poster = path + '.jpg'; - } - - html = ''; - - $(e).html(html); - - player = videojs(id, setup); - player.ready(function() { - //fb(id + ' player is ready'); - - $this.resizeControls(); // Make sure player controls are the right size - - if (fluidbook.video.players[id]) { - //fb('found saved settings for player ID ' + id); - var settings = fluidbook.video.players[id]; - //console.log(settings); - - // In the case of autoplay videos, we don't want the autoplay to fire - // more than once (ie. never after we have these settings reccorded) - // It interferes with play/pausing - player.autoplay(false); - - // Restore settings - player.volume(settings.volume); - player.muted(settings.muted); - player.currentTime(settings.currentTime); - - // Start player to go to current position - necessary even if it will be paused immediately - setTimeout(function() { player.play(); }, 50); - - player.one('play', function() { - //fb('Player has started playing... ID: ' + id); - // Handle pause in here if needed.. Better than using the timeout... - - if (settings.paused) { - //fb(id + ' should be paused'); - setTimeout(function() { player.pause(); }, 100); - } - - }); - - - player.play(); // Start player to go to current position - necessary even if it will be paused immediately - if (settings.paused) { - player.pause(); - } - - // var playPromise = player.play(); - // if (settings.paused) { - // if (playPromise && (typeof Promise !== 'undefined') && (playPromise instanceof Promise)) { - // playPromise.then((result) => { - // setTimeout(player.pause, 100); - // }); - // } else { - // player.pause(); - // } - // } - } - - }); - - player.on('pause', function() { - fb(id + ' player paused'); - - // Show play button (ref: http://stackoverflow.com/a/25296575) - this.bigPlayButton.show(); - - // Now the issue is that we need to hide it again if we start playing - // So every time we do this, we can create a one-time listener for play events. - player.one('play', function() { - this.bigPlayButton.hide(); - }); - }); - - // player.on('fullscreenchange', function() { - // fb('Entering or exiting fullscreen... resetting control sizes #' + player.id()); - // Note: this doesn't work because the fluidbookresize gets called multiple times after this fires and that overrides this change - // $('#' + player.id()).attr('style', ''); // Reset inline styles - // }); - - }, - openVideo: function(link) { - if (link === undefined) return false; - - link = $(link); - - var popup = $('#videoPopup'), - html, - width = parseFloat(link.data('width')), - height = parseFloat(link.data('height')), - name = link.data('name'), - controls = link.data('controls'), - loop = link.data('loop'), - sound = link.data('sound'), - autoplay = link.data('autoplay'), - path, - poster; - - //console.info(width, height, name, loop); - - if (fluidbook.datas.mobileVideosPath == '') { - path = "data/links/" + name; - } else { - path = fluidbook.datas.mobileVideosPath + name; - if (!fluidbook.datas.standalone && path.substr(0, 3) == '../') { - path = '../' + path; - } - } - poster = path + '.jpg'; - - // Build