diff options
Diffstat (limited to 'dist/plyr.js')
-rw-r--r-- | dist/plyr.js | 205 |
1 files changed, 105 insertions, 100 deletions
diff --git a/dist/plyr.js b/dist/plyr.js index 031ccb1e..ef3683ee 100644 --- a/dist/plyr.js +++ b/dist/plyr.js @@ -170,6 +170,10 @@ typeof navigator === "object" && (function (global, factory) { return instanceOf(input, TextTrack) || !isNullOrUndefined(input) && isString(input.kind); }; + var isPromise = function isPromise(input) { + return instanceOf(input, Promise); + }; + var isEmpty = function isEmpty(input) { return isNullOrUndefined(input) || (isString(input) || isArray(input) || isNodeList(input)) && !input.length || isObject(input) && !Object.keys(input).length; }; @@ -215,6 +219,7 @@ typeof navigator === "object" && (function (global, factory) { keyboardEvent: isKeyboardEvent, cue: isCue, track: isTrack, + promise: isPromise, url: isUrl, empty: isEmpty }; @@ -3198,7 +3203,7 @@ typeof navigator === "object" && (function (global, factory) { // Sprite (for icons) loadSprite: true, iconPrefix: 'plyr', - iconUrl: 'https://cdn.plyr.io/3.4.8/plyr.svg', + iconUrl: 'https://cdn.plyr.io/3.5.0-beta.4/plyr.svg', // Blank video (used to prevent errors on source change) blankVideo: 'https://cdn.plyr.io/static/blank.mp4', // Quality default @@ -4518,23 +4523,6 @@ typeof navigator === "object" && (function (global, factory) { on.call(player, player.media, 'waiting canplay seeked playing', function (event) { return ui.checkLoading.call(player, event); - }); // If autoplay, then load advertisement if required - // TODO: Show some sort of loading state while the ad manager loads else there's a delay before ad shows - - on.call(player, player.media, 'playing', function () { - if (!player.ads) { - return; - } // If ads are enabled, wait for them first - - - if (player.ads.enabled && !player.ads.initialized) { - // Wait for manager response - player.ads.managerPromise.then(function () { - return player.ads.play(); - }).catch(function () { - return player.play(); - }); - } }); // Click video if (player.supported.ui && player.config.clickToPlay && !player.isAudio) { @@ -6101,10 +6089,11 @@ typeof navigator === "object" && (function (global, factory) { google.ima.settings.setVpaidMode(google.ima.ImaSdkSettings.VpaidMode.ENABLED); // Set language - google.ima.settings.setLocale(this.player.config.ads.language); // We assume the adContainer is the video container of the plyr element - // that will house the ads + google.ima.settings.setLocale(this.player.config.ads.language); // Set playback for iOS10+ + + google.ima.settings.setDisableCustomPlaybackForIOS10Plus(this.player.config.playsinline); // We assume the adContainer is the video container of the plyr element that will house the ads - this.elements.displayContainer = new google.ima.AdDisplayContainer(this.elements.container); // Request video ads to be pre-loaded + this.elements.displayContainer = new google.ima.AdDisplayContainer(this.elements.container, this.player.media); // Request video ads to be pre-loaded this.requestAds(); } @@ -6198,25 +6187,7 @@ typeof navigator === "object" && (function (global, factory) { this.manager = event.getAdsManager(this.player, settings); // Get the cue points for any mid-rolls by filtering out the pre- and post-roll - this.cuePoints = this.manager.getCuePoints(); // Add advertisement cue's within the time line if available - - if (!is.empty(this.cuePoints)) { - this.cuePoints.forEach(function (cuePoint) { - if (cuePoint !== 0 && cuePoint !== -1 && cuePoint < _this6.player.duration) { - var seekElement = _this6.player.elements.progress; - - if (is.element(seekElement)) { - var cuePercentage = 100 / _this6.player.duration * cuePoint; - var cue = createElement('span', { - class: _this6.player.config.classNames.cues - }); - cue.style.left = "".concat(cuePercentage.toString(), "%"); - seekElement.appendChild(cue); - } - } - }); - } // Set volume to match player - + this.cuePoints = this.manager.getCuePoints(); // Set volume to match player this.manager.setVolume(this.player.volume); // Add listeners to the required events // Advertisement error events @@ -6233,6 +6204,29 @@ typeof navigator === "object" && (function (global, factory) { this.trigger('loaded'); } + }, { + key: "addCuePoints", + value: function addCuePoints() { + var _this7 = this; + + // Add advertisement cue's within the time line if available + if (!is.empty(this.cuePoints)) { + this.cuePoints.forEach(function (cuePoint) { + if (cuePoint !== 0 && cuePoint !== -1 && cuePoint < _this7.player.duration) { + var seekElement = _this7.player.elements.progress; + + if (is.element(seekElement)) { + var cuePercentage = 100 / _this7.player.duration * cuePoint; + var cue = createElement('span', { + class: _this7.player.config.classNames.cues + }); + cue.style.left = "".concat(cuePercentage.toString(), "%"); + seekElement.appendChild(cue); + } + } + }); + } + } /** * This is where all the event handling takes place. Retrieve the ad from the event. Some * events (e.g. ALL_ADS_COMPLETED) don't have the ad object associated @@ -6243,7 +6237,7 @@ typeof navigator === "object" && (function (global, factory) { }, { key: "onAdEvent", value: function onAdEvent(event) { - var _this7 = this; + var _this8 = this; var container = this.player.elements.container; // Retrieve the ad from the event. Some events (e.g. ALL_ADS_COMPLETED) // don't have ad object associated @@ -6253,7 +6247,7 @@ typeof navigator === "object" && (function (global, factory) { var dispatchEvent = function dispatchEvent(type) { var event = "ads".concat(type.replace(/_/g, '').toLowerCase()); - triggerEvent.call(_this7.player, _this7.player.media, event); + triggerEvent.call(_this8.player, _this8.player.media, event); }; switch (event.type) { @@ -6362,37 +6356,39 @@ typeof navigator === "object" && (function (global, factory) { }, { key: "listeners", value: function listeners() { - var _this8 = this; + var _this9 = this; var container = this.player.elements.container; - var time; // Add listeners to the required events - + var time; + this.player.on('canplay', function () { + _this9.addCuePoints(); + }); this.player.on('ended', function () { - _this8.loader.contentComplete(); + _this9.loader.contentComplete(); }); this.player.on('timeupdate', function () { - time = _this8.player.currentTime; + time = _this9.player.currentTime; }); this.player.on('seeked', function () { - var seekedTime = _this8.player.currentTime; + var seekedTime = _this9.player.currentTime; - if (is.empty(_this8.cuePoints)) { + if (is.empty(_this9.cuePoints)) { return; } - _this8.cuePoints.forEach(function (cuePoint, index) { + _this9.cuePoints.forEach(function (cuePoint, index) { if (time < cuePoint && cuePoint < seekedTime) { - _this8.manager.discardAdBreak(); + _this9.manager.discardAdBreak(); - _this8.cuePoints.splice(index, 1); + _this9.cuePoints.splice(index, 1); } }); }); // Listen to the resizing of the window. And resize ad accordingly // TODO: eventually implement ResizeObserver window.addEventListener('resize', function () { - if (_this8.manager) { - _this8.manager.resize(container.offsetWidth, container.offsetHeight, google.ima.ViewMode.NORMAL); + if (_this9.manager) { + _this9.manager.resize(container.offsetWidth, container.offsetHeight, google.ima.ViewMode.NORMAL); } }); } @@ -6403,7 +6399,7 @@ typeof navigator === "object" && (function (global, factory) { }, { key: "play", value: function play() { - var _this9 = this; + var _this10 = this; var container = this.player.elements.container; @@ -6414,23 +6410,23 @@ typeof navigator === "object" && (function (global, factory) { this.managerPromise.then(function () { // Initialize the container. Must be done via a user action on mobile devices - _this9.elements.displayContainer.initialize(); + _this10.elements.displayContainer.initialize(); try { - if (!_this9.initialized) { + if (!_this10.initialized) { // Initialize the ads manager. Ad rules playlist will start at this time - _this9.manager.init(container.offsetWidth, container.offsetHeight, google.ima.ViewMode.NORMAL); // Call play to start showing the ad. Single video and overlay ads will + _this10.manager.init(container.offsetWidth, container.offsetHeight, google.ima.ViewMode.NORMAL); // Call play to start showing the ad. Single video and overlay ads will // start at this time; the call will be ignored for ad rules - _this9.manager.start(); + _this10.manager.start(); } - _this9.initialized = true; + _this10.initialized = true; } catch (adError) { // An error may be thrown if there was a problem with the // VAST response - _this9.onAdError(adError); + _this10.onAdError(adError); } }).catch(function () {}); } @@ -6444,11 +6440,9 @@ typeof navigator === "object" && (function (global, factory) { // Hide the advertisement container this.elements.container.style.zIndex = ''; // Ad is stopped - this.playing = false; // Play our video + this.playing = false; // Play video - if (this.player.currentTime < this.player.duration) { - this.player.play(); - } + this.player.media.play(); } /** * Pause our video @@ -6458,11 +6452,11 @@ typeof navigator === "object" && (function (global, factory) { key: "pauseContent", value: function pauseContent() { // Show the advertisement container - this.elements.container.style.zIndex = 3; // Ad is playing. + this.elements.container.style.zIndex = 3; // Ad is playing this.playing = true; // Pause our video. - this.player.pause(); + this.player.media.pause(); } /** * Destroy the adsManager so we can grab new ads after this. If we don't then we're not @@ -6491,23 +6485,23 @@ typeof navigator === "object" && (function (global, factory) { }, { key: "loadAds", value: function loadAds() { - var _this10 = this; + var _this11 = this; // Tell our adsManager to go bye bye this.managerPromise.then(function () { // Destroy our adsManager - if (_this10.manager) { - _this10.manager.destroy(); + if (_this11.manager) { + _this11.manager.destroy(); } // Re-set our adsManager promises - _this10.managerPromise = new Promise(function (resolve) { - _this10.on('loaded', resolve); + _this11.managerPromise = new Promise(function (resolve) { + _this11.on('loaded', resolve); - _this10.player.debug.log(_this10.manager); + _this11.player.debug.log(_this11.manager); }); // Now request some new advertisements - _this10.requestAds(); + _this11.requestAds(); }).catch(function () {}); } /** @@ -6518,7 +6512,7 @@ typeof navigator === "object" && (function (global, factory) { }, { key: "trigger", value: function trigger(event) { - var _this11 = this; + var _this12 = this; for (var _len = arguments.length, args = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) { args[_key - 1] = arguments[_key]; @@ -6529,7 +6523,7 @@ typeof navigator === "object" && (function (global, factory) { if (is.array(handlers)) { handlers.forEach(function (handler) { if (is.function(handler)) { - handler.apply(_this11, args); + handler.apply(_this12, args); } }); } @@ -6563,13 +6557,13 @@ typeof navigator === "object" && (function (global, factory) { }, { key: "startSafetyTimer", value: function startSafetyTimer(time, from) { - var _this12 = this; + var _this13 = this; this.player.debug.log("Safety timer invoked from: ".concat(from)); this.safetyTimer = setTimeout(function () { - _this12.cancel(); + _this13.cancel(); - _this12.clearSafetyTimer('startSafetyTimer()'); + _this13.clearSafetyTimer('startSafetyTimer()'); }, time); } /** @@ -6851,8 +6845,8 @@ typeof navigator === "object" && (function (global, factory) { } } }, { - key: "finishScrubbing", - value: function finishScrubbing() { + key: "endScrubbing", + value: function endScrubbing() { var _this4 = this; this.mouseDown = false; // Hide scrubbing preview. But wait until the video has successfully seeked before hiding the scrubbing preview @@ -7694,8 +7688,19 @@ typeof navigator === "object" && (function (global, factory) { * Play the media, or play the advertisement (if they are not blocked) */ value: function play() { + var _this2 = this; + if (!is.function(this.media.play)) { return null; + } // Intecept play with ads + + + if (this.ads && this.ads.enabled) { + this.ads.managerPromise.then(function () { + return _this2.ads.play(); + }).catch(function () { + return _this2.media.play(); + }); } // Return the promise (for HTML5) @@ -7913,7 +7918,7 @@ typeof navigator === "object" && (function (global, factory) { }, { key: "destroy", value: function destroy(callback) { - var _this2 = this; + var _this3 = this; var soft = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false; @@ -7925,20 +7930,20 @@ typeof navigator === "object" && (function (global, factory) { // Reset overflow (incase destroyed while in fullscreen) document.body.style.overflow = ''; // GC for embed - _this2.embed = null; // If it's a soft destroy, make minimal changes + _this3.embed = null; // If it's a soft destroy, make minimal changes if (soft) { - if (Object.keys(_this2.elements).length) { + if (Object.keys(_this3.elements).length) { // Remove elements - removeElement(_this2.elements.buttons.play); - removeElement(_this2.elements.captions); - removeElement(_this2.elements.controls); - removeElement(_this2.elements.wrapper); // Clear for GC - - _this2.elements.buttons.play = null; - _this2.elements.captions = null; - _this2.elements.controls = null; - _this2.elements.wrapper = null; + removeElement(_this3.elements.buttons.play); + removeElement(_this3.elements.captions); + removeElement(_this3.elements.controls); + removeElement(_this3.elements.wrapper); // Clear for GC + + _this3.elements.buttons.play = null; + _this3.elements.captions = null; + _this3.elements.controls = null; + _this3.elements.wrapper = null; } // Callback @@ -7947,22 +7952,22 @@ typeof navigator === "object" && (function (global, factory) { } } else { // Unbind listeners - unbindListeners.call(_this2); // Replace the container with the original element provided + unbindListeners.call(_this3); // Replace the container with the original element provided - replaceElement(_this2.elements.original, _this2.elements.container); // Event + replaceElement(_this3.elements.original, _this3.elements.container); // Event - triggerEvent.call(_this2, _this2.elements.original, 'destroyed', true); // Callback + triggerEvent.call(_this3, _this3.elements.original, 'destroyed', true); // Callback if (is.function(callback)) { - callback.call(_this2.elements.original); + callback.call(_this3.elements.original); } // Reset state - _this2.ready = false; // Clear for garbage collection + _this3.ready = false; // Clear for garbage collection setTimeout(function () { - _this2.elements = null; - _this2.media = null; + _this3.elements = null; + _this3.media = null; }, 200); } }; // Stop playback |