aboutsummaryrefslogtreecommitdiffstats
path: root/demo/dist/demo.js
diff options
context:
space:
mode:
Diffstat (limited to 'demo/dist/demo.js')
-rw-r--r--demo/dist/demo.js250
1 files changed, 171 insertions, 79 deletions
diff --git a/demo/dist/demo.js b/demo/dist/demo.js
index 4b8071b0..f83878b7 100644
--- a/demo/dist/demo.js
+++ b/demo/dist/demo.js
@@ -1,7 +1,7 @@
typeof navigator === "object" && (function () {
'use strict';
- var commonjsGlobal = typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
+ var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
function createCommonjsModule(fn, module) {
return module = { exports: {} }, fn(module, module.exports), module.exports;
@@ -4951,6 +4951,83 @@ typeof navigator === "object" && (function () {
reducedMotion: 'matchMedia' in window && window.matchMedia('(prefers-reduced-motion)').matches
};
+ function validateRatio(input) {
+ if (!is$1.array(input) && (!is$1.string(input) || !input.includes(':'))) {
+ return false;
+ }
+
+ var ratio = is$1.array(input) ? input : input.split(':');
+ return ratio.map(Number).every(is$1.number);
+ }
+ function reduceAspectRatio(ratio) {
+ if (!is$1.array(ratio) || !ratio.every(is$1.number)) {
+ return null;
+ }
+
+ var _ratio = _slicedToArray(ratio, 2),
+ width = _ratio[0],
+ height = _ratio[1];
+
+ var getDivider = function getDivider(w, h) {
+ return h === 0 ? w : getDivider(h, w % h);
+ };
+
+ var divider = getDivider(width, height);
+ return [width / divider, height / divider];
+ }
+ function getAspectRatio(input) {
+ var parse = function parse(ratio) {
+ if (!validateRatio(ratio)) {
+ return null;
+ }
+
+ return ratio.split(':').map(Number);
+ }; // Provided ratio
+
+
+ var ratio = parse(input); // Get from config
+
+ if (ratio === null) {
+ ratio = parse(this.config.ratio);
+ } // Get from embed
+
+
+ if (ratio === null && !is$1.empty(this.embed) && is$1.string(this.embed.ratio)) {
+ ratio = parse(this.embed.ratio);
+ }
+
+ return ratio;
+ } // Set aspect ratio for responsive container
+
+ function setAspectRatio(input) {
+ if (!this.isVideo) {
+ return {};
+ }
+
+ var ratio = getAspectRatio.call(this, input);
+
+ var _ref = is$1.array(ratio) ? ratio : [0, 0],
+ _ref2 = _slicedToArray(_ref, 2),
+ w = _ref2[0],
+ h = _ref2[1];
+
+ var padding = 100 / w * h;
+ this.elements.wrapper.style.paddingBottom = "".concat(padding, "%"); // For Vimeo we have an extra <div> to hide the standard controls and UI
+
+ if (this.isVimeo && this.supported.ui) {
+ var height = 240;
+ var offset = (height - padding) / (height / 50);
+ this.media.style.transform = "translateY(-".concat(offset, "%)");
+ } else if (this.isHTML5) {
+ this.elements.wrapper.classList.toggle(this.config.classNames.videoFixedRatio, ratio !== null);
+ }
+
+ return {
+ padding: padding,
+ ratio: ratio
+ };
+ }
+
// ==========================================================================
var html5 = {
getSources: function getSources() {
@@ -4984,7 +5061,9 @@ typeof navigator === "object" && (function () {
return;
}
- var player = this; // Quality
+ var player = this; // Set aspect ratio if set
+
+ setAspectRatio.call(player); // Quality
Object.defineProperty(player.media, 'quality', {
get: function get() {
@@ -7358,8 +7437,9 @@ typeof navigator === "object" && (function () {
invertTime: true,
// Clicking the currentTime inverts it's value to show time left rather than elapsed
toggleInvert: true,
- // Aspect ratio (for embeds)
- ratio: '16:9',
+ // Force an aspect ratio
+ // The format must be `'w:h'` (e.g. `'16:9'`)
+ ratio: null,
// Click video container to play/pause
clickToPlay: true,
// Auto hide the controls
@@ -7371,7 +7451,7 @@ typeof navigator === "object" && (function () {
// Sprite (for icons)
loadSprite: true,
iconPrefix: 'plyr',
- iconUrl: 'https://cdn.plyr.io/3.5.2/plyr.svg',
+ iconUrl: 'https://cdn.plyr.io/3.5.3/plyr.svg',
// Blank video (used to prevent errors on source change)
blankVideo: 'https://cdn.plyr.io/static/blank.mp4',
// Quality default
@@ -7571,6 +7651,7 @@ typeof navigator === "object" && (function () {
provider: 'plyr--{0}',
video: 'plyr__video-wrapper',
embed: 'plyr__video-embed',
+ videoFixedRatio: 'plyr__video-wrapper--fixed-ratio',
embedContainer: 'plyr__video-embed__container',
poster: 'plyr__poster',
posterEnabled: 'plyr__poster-enabled',
@@ -8247,44 +8328,6 @@ typeof navigator === "object" && (function () {
}
};
- /* function reduceAspectRatio(width, height) {
- const getRatio = (w, h) => (h === 0 ? w : getRatio(h, w % h));
- const ratio = getRatio(width, height);
- return `${width / ratio}:${height / ratio}`;
- } */
- // Set aspect ratio for responsive container
-
- function setAspectRatio(input) {
- var ratio = input;
-
- if (!is$1.string(ratio) && !is$1.nullOrUndefined(this.embed)) {
- ratio = this.embed.ratio;
- }
-
- if (!is$1.string(ratio)) {
- ratio = this.config.ratio;
- }
-
- var _ratio$split$map = ratio.split(':').map(Number),
- _ratio$split$map2 = _slicedToArray(_ratio$split$map, 2),
- x = _ratio$split$map2[0],
- y = _ratio$split$map2[1];
-
- var padding = 100 / x * y;
- this.elements.wrapper.style.paddingBottom = "".concat(padding, "%"); // For Vimeo we have an extra <div> to hide the standard controls and UI
-
- if (this.isVimeo && this.supported.ui) {
- var height = 240;
- var offset = (height - padding) / (height / 50);
- this.media.style.transform = "translateY(-".concat(offset, "%)");
- }
-
- return {
- padding: padding,
- ratio: ratio
- };
- }
-
var Listeners =
/*#__PURE__*/
function () {
@@ -8537,6 +8580,8 @@ typeof navigator === "object" && (function () {
}, {
key: "container",
value: function container() {
+ var _this = this;
+
var player = this.player;
var config = player.config,
elements = player.elements,
@@ -8588,16 +8633,15 @@ typeof navigator === "object" && (function () {
var target = player.elements.wrapper.firstChild;
- var _ratio$split$map = ratio.split(':').map(Number),
- _ratio$split$map2 = _slicedToArray(_ratio$split$map, 2),
- height = _ratio$split$map2[1];
+ var _ratio = _slicedToArray(ratio, 2),
+ y = _ratio[1];
- var _player$embed$ratio$s = player.embed.ratio.split(':').map(Number),
- _player$embed$ratio$s2 = _slicedToArray(_player$embed$ratio$s, 2),
- videoWidth = _player$embed$ratio$s2[0],
- videoHeight = _player$embed$ratio$s2[1];
+ var _getAspectRatio$call = getAspectRatio.call(_this),
+ _getAspectRatio$call2 = _slicedToArray(_getAspectRatio$call, 2),
+ videoX = _getAspectRatio$call2[0],
+ videoY = _getAspectRatio$call2[1];
- target.style.maxWidth = toggle ? "".concat(height / videoHeight * videoWidth, "px") : null;
+ target.style.maxWidth = toggle ? "".concat(y / videoY * videoX, "px") : null;
target.style.margin = toggle ? '0 auto' : null;
}; // Resize on fullscreen change
@@ -8650,7 +8694,7 @@ typeof navigator === "object" && (function () {
}, {
key: "media",
value: function media() {
- var _this = this;
+ var _this2 = this;
var player = this.player;
var elements = player.elements; // Time change on media
@@ -8715,11 +8759,11 @@ typeof navigator === "object" && (function () {
}
if (player.ended) {
- _this.proxy(event, player.restart, 'restart');
+ _this2.proxy(event, player.restart, 'restart');
- _this.proxy(event, player.play, 'play');
+ _this2.proxy(event, player.play, 'play');
} else {
- _this.proxy(event, player.togglePlay, 'play');
+ _this2.proxy(event, player.togglePlay, 'play');
}
});
} // Disable right click
@@ -8794,21 +8838,21 @@ typeof navigator === "object" && (function () {
}, {
key: "bind",
value: function bind(element, type, defaultHandler, customHandlerKey) {
- var _this2 = this;
+ var _this3 = this;
var passive = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : true;
var player = this.player;
var customHandler = player.config.listeners[customHandlerKey];
var hasCustomHandler = is$1.function(customHandler);
on.call(player, element, type, function (event) {
- return _this2.proxy(event, defaultHandler, customHandlerKey);
+ return _this3.proxy(event, defaultHandler, customHandlerKey);
}, passive && !hasCustomHandler);
} // Listen for control events
}, {
key: "controls",
value: function controls$1() {
- var _this3 = this;
+ var _this4 = this;
var player = this.player;
var elements = player.elements; // IE doesn't support input event, so we fallback to change
@@ -8817,7 +8861,7 @@ typeof navigator === "object" && (function () {
if (elements.buttons.play) {
Array.from(elements.buttons.play).forEach(function (button) {
- _this3.bind(button, 'click', player.togglePlay, 'play');
+ _this4.bind(button, 'click', player.togglePlay, 'play');
});
} // Pause
@@ -8924,7 +8968,7 @@ typeof navigator === "object" && (function () {
if (browser.isIos) {
var inputs = getElements.call(player, 'input[type="range"]');
Array.from(inputs).forEach(function (input) {
- return _this3.bind(input, inputEvent, function (event) {
+ return _this4.bind(input, inputEvent, function (event) {
return repaint(event.target);
});
});
@@ -8982,7 +9026,7 @@ typeof navigator === "object" && (function () {
if (browser.isWebkit) {
Array.from(getElements.call(player, 'input[type="range"]')).forEach(function (element) {
- _this3.bind(element, 'input', function (event) {
+ _this4.bind(element, 'input', function (event) {
return controls.updateRangeFill.call(player, event.target);
});
});
@@ -9029,7 +9073,7 @@ typeof navigator === "object" && (function () {
toggleClass(elements.controls, config.classNames.noTransition, false);
}, 0); // Delay a little more for mouse users
- var delay = _this3.touch ? 3000 : 4000; // Clear timer
+ var delay = _this4.touch ? 3000 : 4000; // Clear timer
clearTimeout(timers.controls); // Hide again after delay
@@ -9269,9 +9313,11 @@ typeof navigator === "object" && (function () {
/**
* Initiate script load and register bundle.
* @param {(string|string[])} paths - The file paths
- * @param {(string|Function)} [arg1] - The bundleId or success callback
- * @param {Function} [arg2] - The success or error callback
- * @param {Function} [arg3] - The error callback
+ * @param {(string|Function|Object)} [arg1] - The (1) bundleId or (2) success
+ * callback or (3) object literal with success/error arguments, numRetries,
+ * etc.
+ * @param {(Function|Object)} [arg2] - The (1) success callback or (2) object
+ * literal with success/error arguments, numRetries, etc.
*/
@@ -9607,7 +9653,7 @@ typeof navigator === "object" && (function () {
height = _dimensions[1];
player.embed.ratio = "".concat(width, ":").concat(height);
- setAspectRatio.call(_this2, player.embed.ratio);
+ setAspectRatio.call(_this2);
}); // Set autopause
player.embed.setAutopause(player.config.autopause).then(function (state) {
@@ -9729,6 +9775,19 @@ typeof navigator === "object" && (function () {
}
}
+ function getHost(config) {
+ if (config.noCookie) {
+ return 'https://www.youtube-nocookie.com';
+ }
+
+ if (window.location.protocol === 'http:') {
+ return 'http://www.youtube.com';
+ } // Use YouTube's default
+
+
+ return undefined;
+ }
+
var youtube = {
setup: function setup() {
var _this = this;
@@ -9821,7 +9880,7 @@ typeof navigator === "object" && (function () {
player.media = replaceElement(container, player.media); // Id to poster wrapper
var posterSrc = function posterSrc(format) {
- return "https://img.youtube.com/vi/".concat(videoId, "/").concat(format, "default.jpg");
+ return "https://i.ytimg.com/vi/".concat(videoId, "/").concat(format, "default.jpg");
}; // Check thumbnail images in order of quality, but reject fallback thumbnails (120px wide)
@@ -9845,7 +9904,7 @@ typeof navigator === "object" && (function () {
player.embed = new window.YT.Player(id, {
videoId: videoId,
- host: config.noCookie ? 'https://www.youtube-nocookie.com' : undefined,
+ host: getHost(config),
playerVars: extend({}, {
autoplay: player.config.autoplay ? 1 : 0,
// Autoplay
@@ -10060,7 +10119,7 @@ typeof navigator === "object" && (function () {
case 1:
// Restore paused state (YouTube starts playing on seek if the video hasn't been played yet)
- if (player.media.paused && !player.embed.hasPlayed) {
+ if (!player.config.autoplay && player.media.paused && !player.embed.hasPlayed) {
player.media.pause();
} else {
assurePlaybackState$1.call(player, true);
@@ -10782,11 +10841,11 @@ typeof navigator === "object" && (function () {
lines.forEach(function (line) {
if (!is$1.number(result.startTime)) {
// The line with start and end times on it is the first line of interest
- var matchTimes = line.match(/([0-9]{2}):([0-9]{2}):([0-9]{2}).([0-9]{2,3})( ?--> ?)([0-9]{2}):([0-9]{2}):([0-9]{2}).([0-9]{2,3})/); // Note that this currently ignores caption formatting directives that are optionally on the end of this line - fine for non-captions VTT
+ var matchTimes = line.match(/([0-9]{2})?:?([0-9]{2}):([0-9]{2}).([0-9]{2,3})( ?--> ?)([0-9]{2})?:?([0-9]{2}):([0-9]{2}).([0-9]{2,3})/); // Note that this currently ignores caption formatting directives that are optionally on the end of this line - fine for non-captions VTT
if (matchTimes) {
- result.startTime = Number(matchTimes[1]) * 60 * 60 + Number(matchTimes[2]) * 60 + Number(matchTimes[3]) + Number("0.".concat(matchTimes[4]));
- result.endTime = Number(matchTimes[6]) * 60 * 60 + Number(matchTimes[7]) * 60 + Number(matchTimes[8]) + Number("0.".concat(matchTimes[9]));
+ result.startTime = Number(matchTimes[1] || 0) * 60 * 60 + Number(matchTimes[2]) * 60 + Number(matchTimes[3]) + Number("0.".concat(matchTimes[4]));
+ result.endTime = Number(matchTimes[6] || 0) * 60 * 60 + Number(matchTimes[7]) * 60 + Number(matchTimes[8]) + Number("0.".concat(matchTimes[9]));
}
} else if (!is$1.empty(line.trim()) && is$1.empty(result.text)) {
// If we already have the startTime, then we're definitely up to the text line(s)
@@ -10921,8 +10980,9 @@ typeof navigator === "object" && (function () {
urlPrefix: ''
}; // If the URLs don't start with '/', then we need to set their relative path to be the location of the VTT file
// If the URLs do start with '/', then they obviously don't need a prefix, so it will remain blank
+ // If the thumbnail URLs start with with none of '/', 'http://' or 'https://', then we need to set their relative path to be the location of the VTT file
- if (!thumbnail.frames[0].text.startsWith('/')) {
+ if (!thumbnail.frames[0].text.startsWith('/') && !thumbnail.frames[0].text.startsWith('http://') && !thumbnail.frames[0].text.startsWith('https://')) {
thumbnail.urlPrefix = url.substring(0, url.lastIndexOf('/') + 1);
} // Download the first frame, so that we can determine/set the height of this thumbnailsDef
@@ -11826,8 +11886,10 @@ typeof navigator === "object" && (function () {
} // Autoplay if required
- if (this.config.autoplay) {
- this.play();
+ if (this.isHTML5 && this.config.autoplay) {
+ setTimeout(function () {
+ return _this.play();
+ }, 10);
} // Seek time will be recorded (in listeners.js) so we can prevent hiding controls for a few seconds after seek
@@ -12137,12 +12199,14 @@ typeof navigator === "object" && (function () {
}; // Stop playback
- this.stop(); // Provider specific stuff
+ this.stop(); // Clear timeouts
- if (this.isHTML5) {
- // Clear timeout
- clearTimeout(this.timers.loading); // Restore native video controls
+ clearTimeout(this.timers.loading);
+ clearTimeout(this.timers.controls);
+ clearTimeout(this.timers.resized); // Provider specific stuff
+ if (this.isHTML5) {
+ // Restore native video controls
ui.toggleNativeControls.call(this, true); // Clean up
done();
@@ -12616,6 +12680,34 @@ typeof navigator === "object" && (function () {
return this.media.getAttribute('poster');
}
/**
+ * Get the current aspect ratio in use
+ */
+
+ }, {
+ key: "ratio",
+ get: function get() {
+ var ratio = reduceAspectRatio(getAspectRatio.call(this));
+ return is$1.array(ratio) ? ratio.join(':') : ratio;
+ }
+ /**
+ * Set video aspect ratio
+ */
+ ,
+ set: function set(input) {
+ if (!this.isVideo) {
+ this.debug.warn('Aspect ratio can only be set for video');
+ return;
+ }
+
+ if (!is$1.string(input) || !validateRatio(input)) {
+ this.debug.error("Invalid aspect ratio specified (".concat(input, ")"));
+ return;
+ }
+
+ this.config.ratio = input;
+ setAspectRatio.call(this);
+ }
+ /**
* Set the autoplay state
* @param {Boolean} input - Whether to autoplay or not
*/
generated by cgit v1.2.3 (git 2.25.1) at 2025-06-08 16:52:19 +0000