From 153b8dc6bb96fdba8340a523c8828a72a832fcdf Mon Sep 17 00:00:00 2001 From: Sam Potts Date: Tue, 19 Feb 2019 00:19:25 +1100 Subject: [PATCH] Added RangeTouch, updated Shr lib in demo --- changelog.md | 1 + demo/dist/demo.js | 832 ++++++++++++++++++++----------- demo/dist/demo.min.js | 2 +- demo/dist/demo.min.js.map | 2 +- demo/index.html | 14 +- demo/src/js/demo.js | 4 +- dist/plyr.js | 828 ++++++++++++++++++++---------- dist/plyr.min.js | 2 +- dist/plyr.min.js.map | 2 +- dist/plyr.min.mjs | 2 +- dist/plyr.min.mjs.map | 2 +- dist/plyr.mjs | 828 ++++++++++++++++++++---------- dist/plyr.polyfilled.js | 828 ++++++++++++++++++++---------- dist/plyr.polyfilled.min.js | 2 +- dist/plyr.polyfilled.min.js.map | 2 +- dist/plyr.polyfilled.min.mjs | 2 +- dist/plyr.polyfilled.min.mjs.map | 2 +- dist/plyr.polyfilled.mjs | 828 ++++++++++++++++++++---------- gulpfile.js | 1 - package.json | 7 +- src/js/controls.js | 4 + yarn.lock | 5 + 22 files changed, 2791 insertions(+), 1409 deletions(-) diff --git a/changelog.md b/changelog.md index cdbaba59..4ec4203f 100644 --- a/changelog.md +++ b/changelog.md @@ -9,6 +9,7 @@ - Use `Math.trunc` instead of `parseInt` (thanks @taion) - Many fixes for fullscreen in embedded players with non 16:9 screens or videos - Added 'force' fallback option for fullscreen +- [RangeTouch](https://rangetouch.com) is now bundled with Plyr as a dependency to fix the scrubber on touch devices ### v3.4.8 diff --git a/demo/dist/demo.js b/demo/dist/demo.js index 386d48c2..71f09f65 100644 --- a/demo/dist/demo.js +++ b/demo/dist/demo.js @@ -4184,93 +4184,367 @@ typeof navigator === "object" && (function () { throw new TypeError("Invalid attempt to destructure non-iterable instance"); } + const defaults = { + addCSS: true, // Add CSS to the element to improve usability (required here or in your CSS!) + thumbWidth: 15, // The width of the thumb handle + watch: true, // Watch for new elements that match a string target + }; + + // Element matches a selector + function matches(element, selector) { + + function match() { + return Array.from(document.querySelectorAll(selector)).includes(this); + } + + const matches = + match; + + return matches.call(element, selector); + } + + // Trigger event + function trigger(element, type) { + if (!element || !type) { + return; + } + + // Create and dispatch the event + const event = new Event(type); + + // Dispatch the event + element.dispatchEvent(event); + } + // ========================================================================== // Type checking utils // ========================================================================== - var getConstructor = function getConstructor(input) { + + const getConstructor = input => (input !== null && typeof input !== 'undefined' ? input.constructor : null); + const instanceOf = (input, constructor) => Boolean(input && constructor && input instanceof constructor); + + const isNullOrUndefined = input => input === null || typeof input === 'undefined'; + const isObject$2 = input => getConstructor(input) === Object; + const isNumber = input => getConstructor(input) === Number && !Number.isNaN(input); + const isString$2 = input => getConstructor(input) === String; + const isBoolean = input => getConstructor(input) === Boolean; + const isFunction$2 = input => getConstructor(input) === Function; + const isArray$2 = input => Array.isArray(input); + const isNodeList = input => instanceOf(input, NodeList); + const isElement = input => instanceOf(input, Element); + const isEvent = input => instanceOf(input, Event); + const isEmpty = input => + isNullOrUndefined(input) || + ((isString$2(input) || isArray$2(input) || isNodeList(input)) && !input.length) || + (isObject$2(input) && !Object.keys(input).length); + + var is = { + nullOrUndefined: isNullOrUndefined, + object: isObject$2, + number: isNumber, + string: isString$2, + boolean: isBoolean, + function: isFunction$2, + array: isArray$2, + nodeList: isNodeList, + element: isElement, + event: isEvent, + empty: isEmpty, + }; + + // Get the number of decimal places + function getDecimalPlaces(value) { + const match = `${value}`.match(/(?:\.(\d+))?(?:[eE]([+-]?\d+))?$/); + + if (!match) { + return 0; + } + + return Math.max( + 0, + // Number of digits right of decimal point. + (match[1] ? match[1].length : 0) - + // Adjust for scientific notation. + (match[2] ? +match[2] : 0), + ); + } + + // Round to the nearest step + function round(number, step) { + if (step < 1) { + const places = getDecimalPlaces(step); + return parseFloat(number.toFixed(places)); + } + return Math.round(number / step) * step; + } + + // ========================================================================== + + class RangeTouch { + /** + * Setup a new instance + * @param {String|Element} target + * @param {Object} options + */ + constructor(target, options) { + if (is.element(target)) { + // An Element is passed, use it directly + this.element = target; + } else if (is.string(target)) { + // A CSS Selector is passed, fetch it from the DOM + this.element = document.querySelector(target); + } + + if (!is.element(this.element) || !is.empty(this.element.rangeTouch)) { + return; + } + + this.config = Object.assign({}, defaults, options); + + this.init(); + } + + static get enabled() { + return 'ontouchstart' in document.documentElement; + } + + /** + * Setup multiple instances + * @param {String|Element|NodeList|Array} target + * @param {Object} options + */ + static setup(target, options = {}) { + let targets = null; + + if (is.empty(target) || is.string(target)) { + targets = Array.from(document.querySelectorAll(is.string(target) ? target : 'input[type="range"]')); + } else if (is.element(target)) { + targets = [target]; + } else if (is.nodeList(target)) { + targets = Array.from(target); + } else if (is.array(target)) { + targets = target.filter(is.element); + } + + if (is.empty(targets)) { + return null; + } + + const config = Object.assign({}, defaults, options); + + if (is.string(target) && config.watch) { + // Create an observer instance + const observer = new MutationObserver(mutations => { + Array.from(mutations).forEach(mutation => { + Array.from(mutation.addedNodes).forEach(node => { + if (!is.element(node) || !matches(node, target)) { + return; + } + + // eslint-disable-next-line no-unused-vars + const range = new RangeTouch(node, config); + }); + }); + }); + + // Pass in the target node, as well as the observer options + observer.observe(document.body, { + childList: true, + subtree: true, + }); + } + + return targets.map(t => new RangeTouch(t, options)); + } + + init() { + // Bail if not a touch enabled device + if (!RangeTouch.enabled) { + return; + } + + // Add useful CSS + if (this.config.addCSS) { + // TODO: Restore original values on destroy + this.element.style.userSelect = 'none'; + this.element.style.webKitUserSelect = 'none'; + this.element.style.touchAction = 'manipulation'; + } + + this.listeners(true); + + this.element.rangeTouch = this; + } + + destroy() { + // Bail if not a touch enabled device + if (!RangeTouch.enabled) { + return; + } + + this.listeners(false); + + this.element.rangeTouch = null; + } + + listeners(toggle) { + const method = toggle ? 'addEventListener' : 'removeEventListener'; + + // Listen for events + ['touchstart', 'touchmove', 'touchend'].forEach(type => { + this.element[method](type, event => this.set(event), false); + }); + } + + /** + * Get the value based on touch position + * @param {Event} event + */ + get(event) { + if (!RangeTouch.enabled || !is.event(event)) { + return null; + } + + const input = event.target; + const touch = event.changedTouches[0]; + const min = parseFloat(input.getAttribute('min')) || 0; + const max = parseFloat(input.getAttribute('max')) || 100; + const step = parseFloat(input.getAttribute('step')) || 1; + const delta = max - min; + + // Calculate percentage + let percent; + const clientRect = input.getBoundingClientRect(); + const thumbWidth = ((100 / clientRect.width) * (this.config.thumbWidth / 2)) / 100; + + // Determine left percentage + percent = (100 / clientRect.width) * (touch.clientX - clientRect.left); + + // Don't allow outside bounds + if (percent < 0) { + percent = 0; + } else if (percent > 100) { + percent = 100; + } + + // Factor in the thumb offset + if (percent < 50) { + percent -= (100 - percent * 2) * thumbWidth; + } else if (percent > 50) { + percent += (percent - 50) * 2 * thumbWidth; + } + + // Find the closest step to the mouse position + return min + round(delta * (percent / 100), step); + } + + /** + * Update range value based on position + * @param {Event} event + */ + set(event) { + if (!RangeTouch.enabled || !is.event(event) || event.target.disabled) { + return; + } + + // Prevent text highlight on iOS + event.preventDefault(); + + // Set value + event.target.value = this.get(event); + + // Trigger event + trigger(event.target, event.type === 'touchend' ? 'change' : 'input'); + } + } + + // ========================================================================== + // Type checking utils + // ========================================================================== + var getConstructor$1 = function getConstructor(input) { return input !== null && typeof input !== 'undefined' ? input.constructor : null; }; - var instanceOf = function instanceOf(input, constructor) { + var instanceOf$1 = function instanceOf(input, constructor) { return Boolean(input && constructor && input instanceof constructor); }; - var isNullOrUndefined = function isNullOrUndefined(input) { + var isNullOrUndefined$1 = function isNullOrUndefined(input) { return input === null || typeof input === 'undefined'; }; - var isObject$2 = function isObject(input) { - return getConstructor(input) === Object; + var isObject$3 = function isObject(input) { + return getConstructor$1(input) === Object; }; - var isNumber = function isNumber(input) { - return getConstructor(input) === Number && !Number.isNaN(input); + var isNumber$1 = function isNumber(input) { + return getConstructor$1(input) === Number && !Number.isNaN(input); }; - var isString$2 = function isString(input) { - return getConstructor(input) === String; + var isString$3 = function isString(input) { + return getConstructor$1(input) === String; }; - var isBoolean = function isBoolean(input) { - return getConstructor(input) === Boolean; + var isBoolean$1 = function isBoolean(input) { + return getConstructor$1(input) === Boolean; }; - var isFunction$2 = function isFunction(input) { - return getConstructor(input) === Function; + var isFunction$3 = function isFunction(input) { + return getConstructor$1(input) === Function; }; - var isArray$2 = function isArray(input) { + var isArray$3 = function isArray(input) { return Array.isArray(input); }; var isWeakMap = function isWeakMap(input) { - return instanceOf(input, WeakMap); + return instanceOf$1(input, WeakMap); }; - var isNodeList = function isNodeList(input) { - return instanceOf(input, NodeList); + var isNodeList$1 = function isNodeList(input) { + return instanceOf$1(input, NodeList); }; - var isElement = function isElement(input) { - return instanceOf(input, Element); + var isElement$1 = function isElement(input) { + return instanceOf$1(input, Element); }; var isTextNode = function isTextNode(input) { - return getConstructor(input) === Text; + return getConstructor$1(input) === Text; }; - var isEvent = function isEvent(input) { - return instanceOf(input, Event); + var isEvent$1 = function isEvent(input) { + return instanceOf$1(input, Event); }; var isKeyboardEvent = function isKeyboardEvent(input) { - return instanceOf(input, KeyboardEvent); + return instanceOf$1(input, KeyboardEvent); }; var isCue = function isCue(input) { - return instanceOf(input, window.TextTrackCue) || instanceOf(input, window.VTTCue); + return instanceOf$1(input, window.TextTrackCue) || instanceOf$1(input, window.VTTCue); }; var isTrack = function isTrack(input) { - return instanceOf(input, TextTrack) || !isNullOrUndefined(input) && isString$2(input.kind); + return instanceOf$1(input, TextTrack) || !isNullOrUndefined$1(input) && isString$3(input.kind); }; var isPromise = function isPromise(input) { - return instanceOf(input, Promise); + return instanceOf$1(input, Promise); }; - var isEmpty = function isEmpty(input) { - return isNullOrUndefined(input) || (isString$2(input) || isArray$2(input) || isNodeList(input)) && !input.length || isObject$2(input) && !Object.keys(input).length; + var isEmpty$1 = function isEmpty(input) { + return isNullOrUndefined$1(input) || (isString$3(input) || isArray$3(input) || isNodeList$1(input)) && !input.length || isObject$3(input) && !Object.keys(input).length; }; var isUrl = function isUrl(input) { // Accept a URL object - if (instanceOf(input, window.URL)) { + if (instanceOf$1(input, window.URL)) { return true; } // Must be string from here - if (!isString$2(input)) { + if (!isString$3(input)) { return false; } // Add the protocol if required @@ -4282,31 +4556,31 @@ typeof navigator === "object" && (function () { } try { - return !isEmpty(new URL(string).hostname); + return !isEmpty$1(new URL(string).hostname); } catch (e) { return false; } }; - var is = { - nullOrUndefined: isNullOrUndefined, - object: isObject$2, - number: isNumber, - string: isString$2, - boolean: isBoolean, - function: isFunction$2, - array: isArray$2, + var is$1 = { + nullOrUndefined: isNullOrUndefined$1, + object: isObject$3, + number: isNumber$1, + string: isString$3, + boolean: isBoolean$1, + function: isFunction$3, + array: isArray$3, weakMap: isWeakMap, - nodeList: isNodeList, - element: isElement, + nodeList: isNodeList$1, + element: isElement$1, textNode: isTextNode, - event: isEvent, + event: isEvent$1, keyboardEvent: isKeyboardEvent, cue: isCue, track: isTrack, promise: isPromise, url: isUrl, - empty: isEmpty + empty: isEmpty$1 }; // ========================================================================== @@ -4341,7 +4615,7 @@ typeof navigator === "object" && (function () { var capture = arguments.length > 5 && arguments[5] !== undefined ? arguments[5] : false; // Bail if no element, event, or callback - if (!element || !('addEventListener' in element) || is.empty(event) || !is.function(callback)) { + if (!element || !('addEventListener' in element) || is$1.empty(event) || !is$1.function(callback)) { return; } // Allow multiple events @@ -4419,7 +4693,7 @@ typeof navigator === "object" && (function () { var detail = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : {}; // Bail if no element - if (!is.element(element) || is.empty(type)) { + if (!is$1.element(element) || is$1.empty(type)) { return; } // Create and dispatch the event @@ -4480,7 +4754,7 @@ typeof navigator === "object" && (function () { } // Set attributes function setAttributes(element, attributes) { - if (!is.element(element) || is.empty(attributes)) { + if (!is$1.element(element) || is$1.empty(attributes)) { return; } // Assume null and undefined attributes should be left out, // Setting them would otherwise convert them to "null" and "undefined" @@ -4490,7 +4764,7 @@ typeof navigator === "object" && (function () { var _ref2 = _slicedToArray(_ref, 2), value = _ref2[1]; - return !is.nullOrUndefined(value); + return !is$1.nullOrUndefined(value); }).forEach(function (_ref3) { var _ref4 = _slicedToArray(_ref3, 2), key = _ref4[0], @@ -4504,12 +4778,12 @@ typeof navigator === "object" && (function () { // Create a new var element = document.createElement(type); // Set all passed attributes - if (is.object(attributes)) { + if (is$1.object(attributes)) { setAttributes(element, attributes); } // Add text node - if (is.string(text)) { + if (is$1.string(text)) { element.innerText = text; } // Return built element @@ -4518,7 +4792,7 @@ typeof navigator === "object" && (function () { } // Inaert an element after another function insertAfter(element, target) { - if (!is.element(element) || !is.element(target)) { + if (!is$1.element(element) || !is$1.element(target)) { return; } @@ -4526,7 +4800,7 @@ typeof navigator === "object" && (function () { } // Insert a DocumentFragment function insertElement(type, parent, attributes, text) { - if (!is.element(parent)) { + if (!is$1.element(parent)) { return; } @@ -4534,12 +4808,12 @@ typeof navigator === "object" && (function () { } // Remove element(s) function removeElement(element) { - if (is.nodeList(element) || is.array(element)) { + if (is$1.nodeList(element) || is$1.array(element)) { Array.from(element).forEach(removeElement); return; } - if (!is.element(element) || !is.element(element.parentNode)) { + if (!is$1.element(element) || !is$1.element(element.parentNode)) { return; } @@ -4547,7 +4821,7 @@ typeof navigator === "object" && (function () { } // Remove all child elements function emptyElement(element) { - if (!is.element(element)) { + if (!is$1.element(element)) { return; } @@ -4560,7 +4834,7 @@ typeof navigator === "object" && (function () { } // Replace element function replaceElement(newChild, oldChild) { - if (!is.element(oldChild) || !is.element(oldChild.parentNode) || !is.element(newChild)) { + if (!is$1.element(oldChild) || !is$1.element(oldChild.parentNode) || !is$1.element(newChild)) { return null; } @@ -4573,7 +4847,7 @@ typeof navigator === "object" && (function () { // '.test' to { class: 'test' } // '#test' to { id: 'test' } // '[data-test="test"]' to { 'data-test': 'test' } - if (!is.string(sel) || is.empty(sel)) { + if (!is$1.string(sel) || is$1.empty(sel)) { return {}; } @@ -4594,7 +4868,7 @@ typeof navigator === "object" && (function () { switch (start) { case '.': // Add to existing classname - if (is.object(existing) && is.string(existing.class)) { + if (is$1.object(existing) && is$1.string(existing.class)) { existing.class += " ".concat(className); } @@ -4619,13 +4893,13 @@ typeof navigator === "object" && (function () { } // Toggle hidden function toggleHidden(element, hidden) { - if (!is.element(element)) { + if (!is$1.element(element)) { return; } var hide = hidden; - if (!is.boolean(hide)) { + if (!is$1.boolean(hide)) { hide = !element.hidden; } @@ -4637,13 +4911,13 @@ typeof navigator === "object" && (function () { } // Mirror Element.classList.toggle, with IE compatibility for "force" argument function toggleClass(element, className, force) { - if (is.nodeList(element)) { + if (is$1.nodeList(element)) { return Array.from(element).map(function (e) { return toggleClass(e, className, force); }); } - if (is.element(element)) { + if (is$1.element(element)) { var method = 'toggle'; if (typeof force !== 'undefined') { @@ -4658,10 +4932,10 @@ typeof navigator === "object" && (function () { } // Has class name function hasClass(element, className) { - return is.element(element) && element.classList.contains(className); + return is$1.element(element) && element.classList.contains(className); } // Element matches selector - function matches(element, selector) { + function matches$1(element, selector) { function match() { return Array.from(document.querySelectorAll(selector)).includes(this); @@ -4683,7 +4957,7 @@ typeof navigator === "object" && (function () { var element = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null; var toggle = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false; - if (!is.element(element)) { + if (!is$1.element(element)) { return; } @@ -4718,7 +4992,7 @@ typeof navigator === "object" && (function () { var element = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null; var tabFocus = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false; - if (!is.element(element)) { + if (!is$1.element(element)) { return; } // Set regular focus @@ -4744,7 +5018,7 @@ typeof navigator === "object" && (function () { var type = Object.keys(events).find(function (event) { return element.style[event] !== undefined; }); - return is.string(type) ? events[type] : false; + return is$1.string(type) ? events[type] : false; }(); // Force repaint of element function repaint(element) { @@ -4805,7 +5079,7 @@ typeof navigator === "object" && (function () { // https://developer.apple.com/documentation/webkitjs/adding_picture_in_picture_to_your_safari_media_controls - if (is.function(createElement('video').webkitSetPresentationMode)) { + if (is$1.function(createElement('video').webkitSetPresentationMode)) { return true; } // Chrome // https://developers.google.com/web/updates/2018/10/watch-video-using-picture-in-picture @@ -4819,7 +5093,7 @@ typeof navigator === "object" && (function () { }(), // Airplay support // Safari only currently - airplay: is.function(window.WebKitPlaybackTargetAvailabilityEvent), + airplay: is$1.function(window.WebKitPlaybackTargetAvailabilityEvent), // Inline playback support // https://webkit.org/blog/6784/new-video-policies-for-ios/ playsinline: 'playsInline' in document.createElement('video'), @@ -4827,7 +5101,7 @@ typeof navigator === "object" && (function () { // Credits: http://diveintohtml5.info/everything.html // Related: http://www.leanbackplayer.com/test/h5mt.html mime: function mime(input) { - if (is.empty(input)) { + if (is$1.empty(input)) { return false; } @@ -4884,7 +5158,7 @@ typeof navigator === "object" && (function () { return sources.filter(function (source) { var type = source.getAttribute('type'); - if (is.empty(type)) { + if (is$1.empty(type)) { return true; } @@ -4981,7 +5255,7 @@ typeof navigator === "object" && (function () { // ========================================================================== function dedupe(array) { - if (!is.array(array)) { + if (!is$1.array(array)) { return array; } @@ -4991,7 +5265,7 @@ typeof navigator === "object" && (function () { } // Get the closest value in an array function closest(array, value) { - if (!is.array(array) || !array.length) { + if (!is$1.array(array) || !array.length) { return null; } @@ -5023,12 +5297,12 @@ typeof navigator === "object" && (function () { var source = sources.shift(); - if (!is.object(source)) { + if (!is$1.object(source)) { return target; } Object.keys(source).forEach(function (key) { - if (is.object(source[key])) { + if (is$1.object(source[key])) { if (!Object.keys(target).includes(key)) { Object.assign(target, _defineProperty({}, key, {})); } @@ -5052,7 +5326,7 @@ typeof navigator === "object" && (function () { args[_key - 1] = arguments[_key]; } - if (is.empty(input)) { + if (is$1.empty(input)) { return input; } @@ -5131,13 +5405,13 @@ typeof navigator === "object" && (function () { var key = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : ''; var config = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {}; - if (is.empty(key) || is.empty(config)) { + if (is$1.empty(key) || is$1.empty(config)) { return ''; } var string = getDeep(config.i18n, key); - if (is.empty(string)) { + if (is$1.empty(string)) { if (Object.keys(resources).includes(key)) { return resources[key]; } @@ -5180,12 +5454,12 @@ typeof navigator === "object" && (function () { var store = window.localStorage.getItem(this.key); - if (is.empty(store)) { + if (is$1.empty(store)) { return null; } var json = JSON.parse(store); - return is.string(key) && key.length ? json[key] : json; + return is$1.string(key) && key.length ? json[key] : json; } }, { key: "set", @@ -5196,14 +5470,14 @@ typeof navigator === "object" && (function () { } // Can only store objectst - if (!is.object(object)) { + if (!is$1.object(object)) { return; } // Get current storage var storage = this.get(); // Default to empty object - if (is.empty(storage)) { + if (is$1.empty(storage)) { storage = {}; } // Update the working copy of the values @@ -5276,12 +5550,12 @@ typeof navigator === "object" && (function () { // ========================================================================== function loadSprite(url, id) { - if (!is.string(url)) { + if (!is$1.string(url)) { return; } var prefix = 'cache'; - var hasId = is.string(id); + var hasId = is$1.string(id); var isCached = false; var exists = function exists() { @@ -5323,7 +5597,7 @@ typeof navigator === "object" && (function () { fetch(url).then(function (result) { - if (is.empty(result)) { + if (is$1.empty(result)) { return; } @@ -5356,7 +5630,7 @@ typeof navigator === "object" && (function () { var inverted = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false; // Bail if the value isn't a number - if (!is.number(time)) { + if (!is$1.number(time)) { return formatTime(null, displayHours, inverted); } // Format time component to add leading zero @@ -5422,7 +5696,7 @@ typeof navigator === "object" && (function () { duration: getElement.call(this, this.config.selectors.display.duration) }; // Seek tooltip - if (is.element(this.elements.progress)) { + if (is$1.element(this.elements.progress)) { this.elements.display.seekTooltip = this.elements.progress.querySelector(".".concat(this.config.classNames.tooltip)); } @@ -5473,7 +5747,7 @@ typeof navigator === "object" && (function () { }, // Create a badge createBadge: function createBadge(text) { - if (is.empty(text)) { + if (is$1.empty(text)) { return null; } @@ -5559,11 +5833,11 @@ typeof navigator === "object" && (function () { break; default: - if (is.empty(props.label)) { + if (is$1.empty(props.label)) { props.label = type; } - if (is.empty(props.icon)) { + if (is$1.empty(props.icon)) { props.icon = buttonType; } @@ -5596,7 +5870,7 @@ typeof navigator === "object" && (function () { setAttributes(button, attributes); // We have multiple play buttons if (type === 'play') { - if (!is.array(this.elements.buttons[type])) { + if (!is$1.array(this.elements.buttons[type])) { this.elements.buttons[type] = []; } @@ -5626,7 +5900,9 @@ typeof navigator === "object" && (function () { }, attributes)); this.elements.inputs[type] = input; // Set the fill for webkit now - controls.updateRangeFill.call(this, input); + controls.updateRangeFill.call(this, input); // Improve support on touch devices + + RangeTouch.setup(input); return input; }, // Create a @@ -5684,7 +5960,7 @@ typeof navigator === "object" && (function () { return; } - var isRadioButton = matches(menuItem, '[role="menuitemradio"]'); // Show the respective menu + var isRadioButton = matches$1(menuItem, '[role="menuitemradio"]'); // Show the respective menu if (!isRadioButton && [32, 39].includes(event.which)) { controls.showMenuPanel.call(_this, type, true); @@ -5695,13 +5971,13 @@ typeof navigator === "object" && (function () { if (event.which === 40 || isRadioButton && event.which === 39) { target = menuItem.nextElementSibling; - if (!is.element(target)) { + if (!is$1.element(target)) { target = menuItem.parentNode.firstElementChild; } } else { target = menuItem.previousElementSibling; - if (!is.element(target)) { + if (!is$1.element(target)) { target = menuItem.parentNode.lastElementChild; } } @@ -5744,7 +6020,7 @@ typeof navigator === "object" && (function () { flex.innerHTML = title; - if (is.element(badge)) { + if (is$1.element(badge)) { flex.appendChild(badge); } @@ -5759,7 +6035,7 @@ typeof navigator === "object" && (function () { // Ensure exclusivity if (checked) { Array.from(menuItem.parentNode.children).filter(function (node) { - return matches(node, '[role="menuitemradio"]'); + return matches$1(node, '[role="menuitemradio"]'); }).forEach(function (node) { return node.setAttribute('aria-checked', 'false'); }); @@ -5769,7 +6045,7 @@ typeof navigator === "object" && (function () { } }); this.listeners.bind(menuItem, 'click keyup', function (event) { - if (is.keyboardEvent(event) && event.which !== 32) { + if (is$1.keyboardEvent(event) && event.which !== 32) { return; } @@ -5794,7 +6070,7 @@ typeof navigator === "object" && (function () { break; } - controls.showMenuPanel.call(_this2, 'home', is.keyboardEvent(event)); + controls.showMenuPanel.call(_this2, 'home', is$1.keyboardEvent(event)); }, type, false); controls.bindMenuItemShortcuts.call(this, menuItem, type); list.appendChild(menuItem); @@ -5805,7 +6081,7 @@ typeof navigator === "object" && (function () { var inverted = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false; // Bail if the value isn't a number - if (!is.number(time)) { + if (!is$1.number(time)) { return time; } // Always display hours if duration is over an hour @@ -5820,7 +6096,7 @@ typeof navigator === "object" && (function () { var inverted = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false; // Bail if there's no element to display or the value isn't a number - if (!is.element(target) || !is.number(time)) { + if (!is$1.element(target) || !is$1.number(time)) { return; } // eslint-disable-next-line no-param-reassign @@ -5834,12 +6110,12 @@ typeof navigator === "object" && (function () { } // Update range - if (is.element(this.elements.inputs.volume)) { + if (is$1.element(this.elements.inputs.volume)) { controls.setRange.call(this, this.elements.inputs.volume, this.muted ? 0 : this.volume); } // Update mute state - if (is.element(this.elements.buttons.mute)) { + if (is$1.element(this.elements.buttons.mute)) { this.elements.buttons.mute.pressed = this.muted || this.volume === 0; } }, @@ -5847,7 +6123,7 @@ typeof navigator === "object" && (function () { setRange: function setRange(target) { var value = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0; - if (!is.element(target)) { + if (!is$1.element(target)) { return; } // eslint-disable-next-line @@ -5860,22 +6136,22 @@ typeof navigator === "object" && (function () { updateProgress: function updateProgress(event) { var _this3 = this; - if (!this.supported.ui || !is.event(event)) { + if (!this.supported.ui || !is$1.event(event)) { return; } var value = 0; var setProgress = function setProgress(target, input) { - var value = is.number(input) ? input : 0; - var progress = is.element(target) ? target : _this3.elements.display.buffer; // Update value and label + var value = is$1.number(input) ? input : 0; + var progress = is$1.element(target) ? target : _this3.elements.display.buffer; // Update value and label - if (is.element(progress)) { + if (is$1.element(progress)) { progress.value = value; // Update text label inside var label = progress.getElementsByTagName('span')[0]; - if (is.element(label)) { + if (is$1.element(label)) { label.childNodes[0].nodeValue = value; } } @@ -5909,20 +6185,20 @@ typeof navigator === "object" && (function () { // Webkit polyfill for lower fill range updateRangeFill: function updateRangeFill(target) { // Get range from event if event passed - var range = is.event(target) ? target.target : target; // Needs to be a valid + var range = is$1.event(target) ? target.target : target; // Needs to be a valid - if (!is.element(range) || range.getAttribute('type') !== 'range') { + if (!is$1.element(range) || range.getAttribute('type') !== 'range') { return; } // Set aria values for https://github.com/sampotts/plyr/issues/905 - if (matches(range, this.config.selectors.inputs.seek)) { + if (matches$1(range, this.config.selectors.inputs.seek)) { range.setAttribute('aria-valuenow', this.currentTime); var currentTime = controls.formatTime(this.currentTime); var duration = controls.formatTime(this.duration); var format$$1 = i18n.get('seekLabel', this.config); range.setAttribute('aria-valuetext', format$$1.replace('{currentTime}', currentTime).replace('{duration}', duration)); - } else if (matches(range, this.config.selectors.inputs.volume)) { + } else if (matches$1(range, this.config.selectors.inputs.volume)) { var percent = range.value * 100; range.setAttribute('aria-valuenow', percent); range.setAttribute('aria-valuetext', "".concat(percent.toFixed(1), "%")); @@ -5943,7 +6219,7 @@ typeof navigator === "object" && (function () { var _this4 = this; // Bail if setting not true - if (!this.config.tooltips.seek || !is.element(this.elements.inputs.seek) || !is.element(this.elements.display.seekTooltip) || this.duration === 0) { + if (!this.config.tooltips.seek || !is$1.element(this.elements.inputs.seek) || !is$1.element(this.elements.display.seekTooltip) || this.duration === 0) { return; } // Calculate percentage @@ -5963,7 +6239,7 @@ typeof navigator === "object" && (function () { } // Determine percentage, if already visible - if (is.event(event)) { + if (is$1.event(event)) { percent = 100 / clientRect.width * (event.pageX - clientRect.left); } else if (hasClass(this.elements.display.seekTooltip, visible)) { percent = parseFloat(this.elements.display.seekTooltip.style.left, 10); @@ -5984,14 +6260,14 @@ typeof navigator === "object" && (function () { this.elements.display.seekTooltip.style.left = "".concat(percent, "%"); // Show/hide the tooltip // If the event is a moues in/out and percentage is inside bounds - if (is.event(event) && ['mouseenter', 'mouseleave'].includes(event.type)) { + if (is$1.event(event) && ['mouseenter', 'mouseleave'].includes(event.type)) { toggle(event.type === 'mouseenter'); } }, // Handle time change event timeUpdate: function timeUpdate(event) { // Only invert if only one time element is displayed and used for both duration and currentTime - var invert = !is.element(this.elements.display.duration) && this.config.invertTime; // Duration + var invert = !is$1.element(this.elements.display.duration) && this.config.invertTime; // Duration controls.updateTimeDisplay.call(this, this.elements.display.currentTime, invert ? this.duration - this.currentTime : this.currentTime, invert); // Ignore updates while seeking @@ -6020,12 +6296,12 @@ typeof navigator === "object" && (function () { } // Update ARIA values - if (is.element(this.elements.inputs.seek)) { + if (is$1.element(this.elements.inputs.seek)) { this.elements.inputs.seek.setAttribute('aria-valuemax', this.duration); } // If there's a spot to display duration - var hasDuration = is.element(this.elements.display.duration); // If there's only one time display, display duration there + var hasDuration = is$1.element(this.elements.display.duration); // If there's only one time display, display duration there if (!hasDuration && this.config.displayDuration && this.paused) { controls.updateTimeDisplay.call(this, this.elements.display.currentTime, this.duration); @@ -6052,14 +6328,14 @@ typeof navigator === "object" && (function () { if (setting === 'captions') { value = this.currentTrack; } else { - value = !is.empty(input) ? input : this[setting]; // Get default + value = !is$1.empty(input) ? input : this[setting]; // Get default - if (is.empty(value)) { + if (is$1.empty(value)) { value = this.config[setting].default; } // Unsupported value - if (!is.empty(this.options[setting]) && !this.options[setting].includes(value)) { + if (!is$1.empty(this.options[setting]) && !this.options[setting].includes(value)) { this.debug.warn("Unsupported value of '".concat(value, "' for ").concat(setting)); return; } // Disabled value @@ -6072,12 +6348,12 @@ typeof navigator === "object" && (function () { } // Get the list if we need to - if (!is.element(list)) { + if (!is$1.element(list)) { list = pane && pane.querySelector('[role="menu"]'); } // If there's no list it means it's not been rendered... - if (!is.element(list)) { + if (!is$1.element(list)) { return; } // Update the label @@ -6087,7 +6363,7 @@ typeof navigator === "object" && (function () { var target = list && list.querySelector("[value=\"".concat(value, "\"]")); - if (is.element(target)) { + if (is$1.element(target)) { target.checked = true; } }, @@ -6098,7 +6374,7 @@ typeof navigator === "object" && (function () { return value === 1 ? i18n.get('normal', this.config) : "".concat(value, "×"); case 'quality': - if (is.number(value)) { + if (is$1.number(value)) { var label = i18n.get("qualityLabel.".concat(value), this.config); if (!label.length) { @@ -6122,21 +6398,21 @@ typeof navigator === "object" && (function () { var _this5 = this; // Menu required - if (!is.element(this.elements.settings.panels.quality)) { + if (!is$1.element(this.elements.settings.panels.quality)) { return; } var type = 'quality'; var list = this.elements.settings.panels.quality.querySelector('[role="menu"]'); // Set options if passed and filter based on uniqueness and config - if (is.array(options)) { + if (is$1.array(options)) { this.options.quality = dedupe(options).filter(function (quality) { return _this5.config.quality.options.includes(quality); }); } // Toggle the pane and tab - var toggle = !is.empty(this.options.quality) && this.options.quality.length > 1; + var toggle = !is$1.empty(this.options.quality) && this.options.quality.length > 1; controls.toggleMenuButton.call(this, type, toggle); // Empty the menu emptyElement(list); // Check if we need to toggle the parent @@ -6216,7 +6492,7 @@ typeof navigator === "object" && (function () { var _this6 = this; // Menu required - if (!is.element(this.elements.settings.panels.captions)) { + if (!is$1.element(this.elements.settings.panels.captions)) { return; } // TODO: Captions or language? Currently it's mixed @@ -6264,14 +6540,14 @@ typeof navigator === "object" && (function () { var _this7 = this; // Menu required - if (!is.element(this.elements.settings.panels.speed)) { + if (!is$1.element(this.elements.settings.panels.speed)) { return; } var type = 'speed'; var list = this.elements.settings.panels.speed.querySelector('[role="menu"]'); // Set the speed options - if (is.array(options)) { + if (is$1.array(options)) { this.options.speed = options; } else if (this.isHTML5 || this.isVimeo) { this.options.speed = [0.5, 0.75, 1, 1.25, 1.5, 1.75, 2]; @@ -6282,7 +6558,7 @@ typeof navigator === "object" && (function () { return _this7.config.speed.options.includes(speed); }); // Toggle the pane and tab - var toggle = !is.empty(this.options.speed) && this.options.speed.length > 1; + var toggle = !is$1.empty(this.options.speed) && this.options.speed.length > 1; controls.toggleMenuButton.call(this, type, toggle); // Empty the menu emptyElement(list); // Check if we need to toggle the parent @@ -6307,7 +6583,7 @@ typeof navigator === "object" && (function () { // Check if we need to hide/show the settings menu checkMenu: function checkMenu() { var buttons = this.elements.settings.buttons; - var visible = !is.empty(buttons) && Object.values(buttons).some(function (button) { + var visible = !is$1.empty(buttons) && Object.values(buttons).some(function (button) { return !button.hidden; }); toggleHidden(this.elements.settings.menu, !visible); @@ -6322,7 +6598,7 @@ typeof navigator === "object" && (function () { var target = pane; - if (!is.element(target)) { + if (!is$1.element(target)) { target = Object.values(this.elements.settings.panels).find(function (pane) { return !pane.hidden; }); @@ -6336,7 +6612,7 @@ typeof navigator === "object" && (function () { var popup = this.elements.settings.popup; var button = this.elements.buttons.settings; // Menu and button are required - if (!is.element(popup) || !is.element(button)) { + if (!is$1.element(popup) || !is$1.element(button)) { return; } // True toggle by default @@ -6344,11 +6620,11 @@ typeof navigator === "object" && (function () { var hidden = popup.hidden; var show = hidden; - if (is.boolean(input)) { + if (is$1.boolean(input)) { show = input; - } else if (is.keyboardEvent(input) && input.which === 27) { + } else if (is$1.keyboardEvent(input) && input.which === 27) { show = false; - } else if (is.event(input)) { + } else if (is$1.event(input)) { var isMenuItem = popup.contains(input.target); // If the click was inside the menu or if the click // wasn't the button or menu item and we're trying to // show the menu (a doc click shouldn't show the menu) @@ -6365,11 +6641,11 @@ typeof navigator === "object" && (function () { toggleClass(this.elements.container, this.config.classNames.menu.open, show); // Focus the first item if key interaction - if (show && is.keyboardEvent(input)) { + if (show && is$1.keyboardEvent(input)) { controls.focusFirstMenuItem.call(this, null, true); } else if (!show && !hidden) { // If closing, re-focus the button - setFocus.call(this, button, is.keyboardEvent(input)); + setFocus.call(this, button, is$1.keyboardEvent(input)); } }, // Get the natural size of a menu panel @@ -6398,7 +6674,7 @@ typeof navigator === "object" && (function () { var tabFocus = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false; var target = document.getElementById("plyr-settings-".concat(this.id, "-").concat(type)); // Nothing to show, bail - if (!is.element(target)) { + if (!is$1.element(target)) { return; } // Hide all other panels @@ -6446,7 +6722,7 @@ typeof navigator === "object" && (function () { setDownloadLink: function setDownloadLink() { var button = this.elements.buttons.download; // Bail if no button - if (!is.element(button)) { + if (!is$1.element(button)) { return; } // Set download link @@ -6547,7 +6823,7 @@ typeof navigator === "object" && (function () { } // Settings button / menu - if (this.config.controls.includes('settings') && !is.empty(this.config.settings)) { + if (this.config.controls.includes('settings') && !is$1.empty(this.config.settings)) { var control = createElement('div', { class: 'plyr__menu', hidden: '' @@ -6669,7 +6945,7 @@ typeof navigator === "object" && (function () { }; var download = this.config.urls.download; - if (!is.url(download) && this.isEmbed) { + if (!is$1.url(download) && this.isEmbed) { extend(_attributes, { icon: "logo-".concat(this.provider), label: this.provider @@ -6724,7 +7000,7 @@ typeof navigator === "object" && (function () { }; var update = true; // If function, run it and use output - if (is.function(this.config.controls)) { + if (is$1.function(this.config.controls)) { this.config.controls = this.config.controls.call(this, props); } // Convert falsy controls to empty array (primarily for empty strings) @@ -6733,7 +7009,7 @@ typeof navigator === "object" && (function () { this.config.controls = []; } - if (is.element(this.config.controls) || is.string(this.config.controls)) { + if (is$1.element(this.config.controls) || is$1.string(this.config.controls)) { // HTMLElement or Non-empty string passed as the option container = this.config.controls; } else { @@ -6765,9 +7041,9 @@ typeof navigator === "object" && (function () { if (update) { - if (is.string(this.config.controls)) { + if (is$1.string(this.config.controls)) { container = replace(container); - } else if (is.element(container)) { + } else if (is$1.element(container)) { container.innerHTML = replace(container.innerHTML); } } // Controls container @@ -6775,25 +7051,25 @@ typeof navigator === "object" && (function () { var target; // Inject to custom location - if (is.string(this.config.selectors.controls.container)) { + if (is$1.string(this.config.selectors.controls.container)) { target = document.querySelector(this.config.selectors.controls.container); } // Inject into the container by default - if (!is.element(target)) { + if (!is$1.element(target)) { target = this.elements.container; } // Inject controls HTML (needs to be before captions, hence "afterbegin") - var insertMethod = is.element(container) ? 'insertAdjacentElement' : 'insertAdjacentHTML'; + var insertMethod = is$1.element(container) ? 'insertAdjacentElement' : 'insertAdjacentHTML'; target[insertMethod]('afterbegin', container); // Find the elements if need be - if (!is.element(this.elements.controls)) { + if (!is$1.element(this.elements.controls)) { controls.findElements.call(this); } // Add pressed property to buttons - if (!is.empty(this.elements.buttons)) { + if (!is$1.empty(this.elements.buttons)) { var addProperty = function addProperty(button) { var className = _this10.config.classNames.controlPressed; Object.defineProperty(button, 'pressed', { @@ -6810,7 +7086,7 @@ typeof navigator === "object" && (function () { Object.values(this.elements.buttons).filter(Boolean).forEach(function (button) { - if (is.array(button) || is.nodeList(button)) { + if (is$1.array(button) || is$1.nodeList(button)) { Array.from(button).filter(Boolean).forEach(addProperty); } else { addProperty(button); @@ -6864,7 +7140,7 @@ typeof navigator === "object" && (function () { function buildUrlParams(input) { var params = new URLSearchParams(); - if (is.object(input)) { + if (is$1.object(input)) { Object.entries(input).forEach(function (_ref) { var _ref2 = _slicedToArray(_ref, 2), key = _ref2[0], @@ -6888,7 +7164,7 @@ typeof navigator === "object" && (function () { if (!this.isVideo || this.isYouTube || this.isHTML5 && !support.textTracks) { // Clear menu and hide - if (is.array(this.config.controls) && this.config.controls.includes('settings') && this.config.settings.includes('captions')) { + if (is$1.array(this.config.controls) && this.config.controls.includes('settings') && this.config.settings.includes('captions')) { controls.setCaptionsMenu.call(this); } @@ -6896,7 +7172,7 @@ typeof navigator === "object" && (function () { } // Inject the container - if (!is.element(this.elements.captions)) { + if (!is$1.element(this.elements.captions)) { this.elements.captions = createElement('div', getAttributesFromSelector(this.config.selectors.captions)); insertAfter(this.elements.captions, this.elements.wrapper); } // Fix IE captions if CORS is used @@ -6939,7 +7215,7 @@ typeof navigator === "object" && (function () { var active = this.storage.get('captions'); - if (!is.boolean(active)) { + if (!is$1.boolean(active)) { active = this.config.captions.active; } @@ -6999,7 +7275,7 @@ typeof navigator === "object" && (function () { } // Enable or disable captions based on track length - toggleClass(this.elements.container, this.config.classNames.captions.enabled, !is.empty(tracks)); // Update available languages in list + toggleClass(this.elements.container, this.config.classNames.captions.enabled, !is$1.empty(tracks)); // Update available languages in list if ((this.config.controls || []).includes('settings') && this.config.settings.includes('captions')) { controls.setCaptionsMenu.call(this); @@ -7020,7 +7296,7 @@ typeof navigator === "object" && (function () { var activeClass = this.config.classNames.captions.active; // Get the next state // If the method is called without parameter, toggle based on current value - var active = is.nullOrUndefined(input) ? !toggled : input; // Update state and trigger event + var active = is$1.nullOrUndefined(input) ? !toggled : input; // Update state and trigger event if (active !== toggled) { // When passive, don't override user preferences @@ -7067,7 +7343,7 @@ typeof navigator === "object" && (function () { return; } - if (!is.number(index)) { + if (!is$1.number(index)) { this.debug.warn('Invalid caption argument', index); return; } @@ -7118,7 +7394,7 @@ typeof navigator === "object" && (function () { setLanguage: function setLanguage(input) { var passive = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true; - if (!is.string(input)) { + if (!is$1.string(input)) { this.debug.warn('Invalid language argument', input); return; } // Normalize @@ -7180,16 +7456,16 @@ typeof navigator === "object" && (function () { getLabel: function getLabel(track) { var currentTrack = track; - if (!is.track(currentTrack) && support.textTracks && this.captions.toggled) { + if (!is$1.track(currentTrack) && support.textTracks && this.captions.toggled) { currentTrack = captions.getCurrentTrack.call(this); } - if (is.track(currentTrack)) { - if (!is.empty(currentTrack.label)) { + if (is$1.track(currentTrack)) { + if (!is$1.empty(currentTrack.label)) { return currentTrack.label; } - if (!is.empty(currentTrack.language)) { + if (!is$1.empty(currentTrack.language)) { return track.language.toUpperCase(); } @@ -7206,13 +7482,13 @@ typeof navigator === "object" && (function () { return; } - if (!is.element(this.elements.captions)) { + if (!is$1.element(this.elements.captions)) { this.debug.warn('No captions element to render to'); return; } // Only accept array or empty input - if (!is.nullOrUndefined(input) && !Array.isArray(input)) { + if (!is$1.nullOrUndefined(input) && !Array.isArray(input)) { this.debug.warn('updateCues: Invalid input', input); return; } @@ -7247,7 +7523,7 @@ typeof navigator === "object" && (function () { // ========================================================================== // Plyr default config // ========================================================================== - var defaults = { + var defaults$1 = { // Disable enabled: true, // Custom media title @@ -7679,7 +7955,7 @@ typeof navigator === "object" && (function () { var button = this.player.elements.buttons.fullscreen; - if (is.element(button)) { + if (is$1.element(button)) { button.pressed = this.active; } // Trigger an event @@ -7721,7 +7997,7 @@ typeof navigator === "object" && (function () { } // Check if the property already exists - var hasProperty = is.string(viewport.content) && viewport.content.includes(property); + var hasProperty = is$1.string(viewport.content) && viewport.content.includes(property); if (toggle) { this.cleanupViewport = !hasProperty; @@ -7774,7 +8050,7 @@ typeof navigator === "object" && (function () { on.call(this.player, this.player.elements.container, 'dblclick', function (event) { // Ignore double click in controls - if (is.element(_this2.player.elements.controls) && _this2.player.elements.controls.contains(event.target)) { + if (is$1.element(_this2.player.elements.controls) && _this2.player.elements.controls.contains(event.target)) { return; } @@ -7823,7 +8099,7 @@ typeof navigator === "object" && (function () { toggleFallback.call(this, true); } else if (!this.prefix) { this.target.requestFullscreen(); - } else if (!is.empty(this.prefix)) { + } else if (!is$1.empty(this.prefix)) { this.target["".concat(this.prefix, "Request").concat(this.property)](); } } // Bail from fullscreen @@ -7843,7 +8119,7 @@ typeof navigator === "object" && (function () { toggleFallback.call(this, false); } else if (!this.prefix) { (document.cancelFullScreen || document.exitFullscreen).call(document); - } else if (!is.empty(this.prefix)) { + } else if (!is$1.empty(this.prefix)) { var action = this.prefix === 'moz' ? 'Cancel' : 'Exit'; document["".concat(this.prefix).concat(action).concat(this.property)](); } @@ -7902,7 +8178,7 @@ typeof navigator === "object" && (function () { key: "prefix", get: function get() { // No prefix - if (is.function(document.exitFullscreen)) { + if (is$1.function(document.exitFullscreen)) { return ''; } // Check for fullscreen support by vendor prefix @@ -7910,7 +8186,7 @@ typeof navigator === "object" && (function () { var value = ''; var prefixes = ['webkit', 'moz', 'ms']; prefixes.some(function (pre) { - if (is.function(document["".concat(pre, "ExitFullscreen")]) || is.function(document["".concat(pre, "CancelFullScreen")])) { + if (is$1.function(document["".concat(pre, "ExitFullscreen")]) || is$1.function(document["".concat(pre, "CancelFullScreen")])) { value = pre; return true; } @@ -7986,7 +8262,7 @@ typeof navigator === "object" && (function () { } // Inject custom controls if not present - if (!is.element(this.elements.controls)) { + if (!is$1.element(this.elements.controls)) { // Inject custom controls controls.inject.call(this); // Re-attach control listeners @@ -8048,7 +8324,7 @@ typeof navigator === "object" && (function () { // Find the current text var label = i18n.get('play', this.config); // If there's a media title set, use that for the label - if (is.string(this.config.title) && !is.empty(this.config.title)) { + if (is$1.string(this.config.title) && !is$1.empty(this.config.title)) { label += ", ".concat(this.config.title); } // If there's a play button, set label @@ -8061,12 +8337,12 @@ typeof navigator === "object" && (function () { if (this.isEmbed) { var iframe = getElement.call(this, 'iframe'); - if (!is.element(iframe)) { + if (!is$1.element(iframe)) { return; } // Default to media type - var title = !is.empty(this.config.title) ? this.config.title : 'video'; + var title = !is$1.empty(this.config.title) ? this.config.title : 'video'; var format = i18n.get('frameTitle', this.config); iframe.setAttribute('title', format.replace('{title}', title)); } @@ -8129,7 +8405,7 @@ typeof navigator === "object" && (function () { target.pressed = _this3.playing; }); // Only update controls on non timeupdate events - if (is.event(event) && event.type === 'timeupdate') { + if (is$1.event(event) && event.type === 'timeupdate') { return; } // Toggle controls @@ -8174,11 +8450,11 @@ typeof navigator === "object" && (function () { function setAspectRatio(input) { var ratio = input; - if (!is.string(ratio) && !is.nullOrUndefined(this.embed)) { + if (!is$1.string(ratio) && !is$1.nullOrUndefined(this.embed)) { ratio = this.embed.ratio; } - if (!is.string(ratio)) { + if (!is$1.string(ratio)) { ratio = this.config.ratio; } @@ -8234,7 +8510,7 @@ typeof navigator === "object" && (function () { // Firefox doesn't get the keycode for whatever reason - if (!is.number(code)) { + if (!is$1.number(code)) { return; } // Seek by the number keys @@ -8252,15 +8528,15 @@ typeof navigator === "object" && (function () { // and any that accept key input http://webaim.org/techniques/keyboard/ var focused = document.activeElement; - if (is.element(focused)) { + if (is$1.element(focused)) { var editable = player.config.selectors.editable; var seek = elements.inputs.seek; - if (focused !== seek && matches(focused, editable)) { + if (focused !== seek && matches$1(focused, editable)) { return; } - if (event.which === 32 && matches(focused, 'button, [role^="menuitem"]')) { + if (event.which === 32 && matches$1(focused, 'button, [role^="menuitem"]')) { return; } } // Which keycodes should we prevent default @@ -8614,7 +8890,7 @@ typeof navigator === "object" && (function () { // Re-fetch the wrapper var wrapper = getElement.call(player, ".".concat(player.config.classNames.video)); // Bail if there's no wrapper (this should never happen) - if (!is.element(wrapper)) { + if (!is$1.element(wrapper)) { return; } // On click play, pause or restart @@ -8695,7 +8971,7 @@ typeof navigator === "object" && (function () { value: function proxy(event, defaultHandler, customHandlerKey) { var player = this.player; var customHandler = player.config.listeners[customHandlerKey]; - var hasCustomHandler = is.function(customHandler); + var hasCustomHandler = is$1.function(customHandler); var returned = true; // Execute custom handler if (hasCustomHandler) { @@ -8703,7 +8979,7 @@ typeof navigator === "object" && (function () { } // Only call default handler if not prevented in custom handler - if (returned && is.function(defaultHandler)) { + if (returned && is$1.function(defaultHandler)) { defaultHandler.call(player, event); } } // Trigger custom and default handlers @@ -8716,7 +8992,7 @@ typeof navigator === "object" && (function () { var passive = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : true; var player = this.player; var customHandler = player.config.listeners[customHandlerKey]; - var hasCustomHandler = is.function(customHandler); + var hasCustomHandler = is$1.function(customHandler); on.call(player, element, type, function (event) { return _this2.proxy(event, defaultHandler, customHandlerKey); }, passive && !hasCustomHandler); @@ -8816,7 +9092,7 @@ typeof navigator === "object" && (function () { var code = event.keyCode ? event.keyCode : event.which; var attribute = 'play-on-seeked'; - if (is.keyboardEvent(event) && code !== 39 && code !== 37) { + if (is$1.keyboardEvent(event) && code !== 39 && code !== 37) { return; } // Record seek time so we can prevent hiding controls for a few seconds after seek @@ -8853,7 +9129,7 @@ typeof navigator === "object" && (function () { var seekTo = seek.getAttribute('seek-value'); - if (is.empty(seekTo)) { + if (is$1.empty(seekTo)) { seekTo = seek.value; } @@ -8907,7 +9183,7 @@ typeof navigator === "object" && (function () { // Only if one time element is used for both currentTime and duration - if (player.config.toggleInvert && !is.element(elements.display.duration)) { + if (player.config.toggleInvert && !is$1.element(elements.display.duration)) { this.bind(elements.display.currentTime, 'click', function () { // Do nothing if we're at the start if (player.currentTime === 0) { @@ -9287,11 +9563,11 @@ typeof navigator === "object" && (function () { } function parseId(url) { - if (is.empty(url)) { + if (is$1.empty(url)) { return null; } - if (is.number(Number(url))) { + if (is$1.number(Number(url))) { return url; } @@ -9320,7 +9596,7 @@ typeof navigator === "object" && (function () { setAspectRatio.call(this); // Load the API if not already - if (!is.object(window.Vimeo)) { + if (!is$1.object(window.Vimeo)) { loadScript(this.config.urls.vimeo.sdk).then(function () { vimeo.ready.call(_this); }).catch(function (error) { @@ -9347,7 +9623,7 @@ typeof navigator === "object" && (function () { var source = player.media.getAttribute('src'); // Get from
if needed - if (is.empty(source)) { + if (is$1.empty(source)) { source = player.media.getAttribute(player.config.attributes.embed.id); } @@ -9370,7 +9646,7 @@ typeof navigator === "object" && (function () { player.media = replaceElement(wrapper, player.media); // Get poster image fetch(format(player.config.urls.vimeo.api, id), 'json').then(function (response) { - if (is.empty(response)) { + if (is$1.empty(response)) { return; } // Get the URL for thumbnail @@ -9479,7 +9755,7 @@ typeof navigator === "object" && (function () { return muted; }, set: function set(input) { - var toggle = is.boolean(input) ? input : false; + var toggle = is$1.boolean(input) ? input : false; player.embed.setVolume(toggle ? 0 : player.config.volume).then(function () { muted = toggle; triggerEvent.call(player, player.media, 'volumechange'); @@ -9493,7 +9769,7 @@ typeof navigator === "object" && (function () { return loop; }, set: function set(input) { - var toggle = is.boolean(input) ? input : player.config.loop.active; + var toggle = is$1.boolean(input) ? input : player.config.loop.active; player.embed.setLoop(toggle).then(function () { loop = toggle; }); @@ -9569,7 +9845,7 @@ typeof navigator === "object" && (function () { } }); - if (is.element(player.embed.element) && player.supported.ui) { + if (is$1.element(player.embed.element) && player.supported.ui) { var frame = player.embed.element; // Fix keyboard focus issues // https://github.com/sampotts/plyr/issues/317 @@ -9627,7 +9903,7 @@ typeof navigator === "object" && (function () { // ========================================================================== function parseId$1(url) { - if (is.empty(url)) { + if (is$1.empty(url)) { return null; } @@ -9656,7 +9932,7 @@ typeof navigator === "object" && (function () { setAspectRatio.call(this); // Setup API - if (is.object(window.YT) && is.function(window.YT.Player)) { + if (is$1.object(window.YT) && is$1.function(window.YT.Player)) { youtube.ready.call(this); } else { // Load the API @@ -9685,11 +9961,11 @@ typeof navigator === "object" && (function () { // Try via undocumented API method first // This method disappears now and then though... // https://github.com/sampotts/plyr/issues/709 - if (is.function(this.embed.getVideoData)) { + if (is$1.function(this.embed.getVideoData)) { var _this$embed$getVideoD = this.embed.getVideoData(), title = _this$embed$getVideoD.title; - if (is.empty(title)) { + if (is$1.empty(title)) { this.config.title = title; ui.setTitle.call(this); return; @@ -9699,10 +9975,10 @@ typeof navigator === "object" && (function () { var key = this.config.keys.google; - if (is.string(key) && !is.empty(key)) { + if (is$1.string(key) && !is$1.empty(key)) { var url = format(this.config.urls.youtube.api, videoId, key); fetch(url).then(function (result) { - if (is.object(result)) { + if (is$1.object(result)) { _this2.config.title = result.items[0].snippet.title; ui.setTitle.call(_this2); } @@ -9715,14 +9991,14 @@ typeof navigator === "object" && (function () { var currentId = player.media.getAttribute('id'); - if (!is.empty(currentId) && currentId.startsWith('youtube-')) { + if (!is$1.empty(currentId) && currentId.startsWith('youtube-')) { return; } // Get the source URL or ID var source = player.media.getAttribute('src'); // Get from
if needed - if (is.empty(source)) { + if (is$1.empty(source)) { source = player.media.getAttribute(this.config.attributes.embed.id); } // Replace the