@tabler/core 1.0.0-beta17 → 1.0.0-beta18

package/dist/libs/plyr/dist/plyr.js

@@ -5,6 +5,7 @@ typeof navigator === "object" && (function (global, factory) {
 })(this, (function () { 'use strict';
 
   function _defineProperty$1(obj, key, value) {
+    key = _toPropertyKey(key);
     if (key in obj) {
       Object.defineProperty(obj, key, {
         value: value,
@@ -17,6 +18,20 @@ typeof navigator === "object" && (function (global, factory) {
     }
     return obj;
   }
+  function _toPrimitive(input, hint) {
+    if (typeof input !== "object" || input === null) return input;
+    var prim = input[Symbol.toPrimitive];
+    if (prim !== undefined) {
+      var res = prim.call(input, hint || "default");
+      if (typeof res !== "object") return res;
+      throw new TypeError("@@toPrimitive must return a primitive value.");
+    }
+    return (hint === "string" ? String : Number)(input);
+  }
+  function _toPropertyKey(arg) {
+    var key = _toPrimitive(arg, "string");
+    return typeof key === "symbol" ? key : String(key);
+  }
 
   function _classCallCheck(e, t) {
     if (!(e instanceof t)) throw new TypeError("Cannot call a class as a function");
@@ -318,12 +333,20 @@ typeof navigator === "object" && (function (global, factory) {
   // Unfortunately, due to mixed support, UA sniffing is required
   // ==========================================================================
 
-  const browser = {
-    isIE: Boolean(window.document.documentMode),
-    isEdge: /Edge/g.test(navigator.userAgent),
-    isWebkit: 'WebkitAppearance' in document.documentElement.style && !/Edge/g.test(navigator.userAgent),
-    isIPhone: /iPhone|iPod/gi.test(navigator.userAgent) && navigator.maxTouchPoints > 1,
-    isIos: /iPad|iPhone|iPod/gi.test(navigator.userAgent) && navigator.maxTouchPoints > 1
+  const isIE = Boolean(window.document.documentMode);
+  const isEdge = /Edge/g.test(navigator.userAgent);
+  const isWebKit = 'WebkitAppearance' in document.documentElement.style && !/Edge/g.test(navigator.userAgent);
+  const isIPhone = /iPhone|iPod/gi.test(navigator.userAgent) && navigator.maxTouchPoints > 1;
+  // navigator.platform may be deprecated but this check is still required
+  const isIPadOS = navigator.platform === 'MacIntel' && navigator.maxTouchPoints > 1;
+  const isIos = /iPad|iPhone|iPod/gi.test(navigator.userAgent) && navigator.maxTouchPoints > 1;
+  var browser = {
+    isIE,
+    isEdge,
+    isWebKit,
+    isIPhone,
+    isIPadOS,
+    isIos
   };
 
   // ==========================================================================
@@ -396,9 +419,7 @@ typeof navigator === "object" && (function (global, factory) {
 
   // Set attributes
   function setAttributes(element, attributes) {
-    if (!is.element(element) || is.empty(attributes)) {
-      return;
-    }
+    if (!is.element(element) || is.empty(attributes)) return;
 
     // Assume null and undefined attributes should be left out,
     // Setting them would otherwise convert them to "null" and "undefined"
@@ -424,19 +445,15 @@ typeof navigator === "object" && (function (global, factory) {
     return element;
   }
 
-  // Inaert an element after another
+  // Insert an element after another
   function insertAfter(element, target) {
-    if (!is.element(element) || !is.element(target)) {
-      return;
-    }
+    if (!is.element(element) || !is.element(target)) return;
     target.parentNode.insertBefore(element, target.nextSibling);
   }
 
   // Insert a DocumentFragment
   function insertElement(type, parent, attributes, text) {
-    if (!is.element(parent)) {
-      return;
-    }
+    if (!is.element(parent)) return;
     parent.appendChild(createElement(type, attributes, text));
   }
 
@@ -454,9 +471,7 @@ typeof navigator === "object" && (function (global, factory) {
 
   // Remove all child elements
   function emptyElement(element) {
-    if (!is.element(element)) {
-      return;
-    }
+    if (!is.element(element)) return;
     let {
       length
     } = element.childNodes;
@@ -468,9 +483,7 @@ typeof navigator === "object" && (function (global, factory) {
 
   // Replace element
   function replaceElement(newChild, oldChild) {
-    if (!is.element(oldChild) || !is.element(oldChild.parentNode) || !is.element(newChild)) {
-      return null;
-    }
+    if (!is.element(oldChild) || !is.element(oldChild.parentNode) || !is.element(newChild)) return null;
     oldChild.parentNode.replaceChild(newChild, oldChild);
     return newChild;
   }
@@ -482,9 +495,7 @@ typeof navigator === "object" && (function (global, factory) {
     // '#test' to { id: 'test' }
     // '[data-test="test"]' to { 'data-test': 'test' }
 
-    if (!is.string(sel) || is.empty(sel)) {
-      return {};
-    }
+    if (!is.string(sel) || is.empty(sel)) return {};
     const attributes = {};
     const existing = extend({}, existingAttributes);
     sel.split(',').forEach(s => {
@@ -522,9 +533,7 @@ typeof navigator === "object" && (function (global, factory) {
 
   // Toggle hidden
   function toggleHidden(element, hidden) {
-    if (!is.element(element)) {
-      return;
-    }
+    if (!is.element(element)) return;
     let hide = hidden;
     if (!is.boolean(hide)) {
       hide = !element.hidden;
@@ -597,20 +606,14 @@ typeof navigator === "object" && (function (global, factory) {
   }
 
   // Set focus and tab focus class
-  function setFocus(element = null, tabFocus = false) {
-    if (!is.element(element)) {
-      return;
-    }
+  function setFocus(element = null, focusVisible = false) {
+    if (!is.element(element)) return;
 
     // Set regular focus
     element.focus({
-      preventScroll: true
+      preventScroll: true,
+      focusVisible
     });
-
-    // If we want to mimic keyboard focus via tab
-    if (tabFocus) {
-      toggleClass(element, this.config.classNames.tabFocus);
-    }
   }
 
   // ==========================================================================
@@ -631,10 +634,9 @@ typeof navigator === "object" && (function (global, factory) {
     video: 'canPlayType' in document.createElement('video'),
     // Check for support
     // Basic functionality vs full UI
-    check(type, provider, playsinline) {
-      const canPlayInline = browser.isIPhone && playsinline && support.playsinline;
+    check(type, provider) {
       const api = support[type] || provider !== 'html5';
-      const ui = api && support.rangeInput && (type !== 'video' || !browser.isIPhone || canPlayInline);
+      const ui = api && support.rangeInput;
       return {
         api,
         ui
@@ -1131,7 +1133,7 @@ typeof navigator === "object" && (function (global, factory) {
   // Format string
   function format(input, ...args) {
     if (is.empty(input)) return input;
-    return input.toString().replace(/{(\d+)}/g, (match, i) => args[i].toString());
+    return input.toString().replace(/{(\d+)}/g, (_, i) => args[i].toString());
   }
 
   // Get percentage
@@ -1712,7 +1714,8 @@ typeof navigator === "object" && (function (global, factory) {
       const attributes = getAttributesFromSelector(this.config.selectors.display[type], attrs);
       const container = createElement('div', extend(attributes, {
         class: `${attributes.class ? attributes.class : ''} ${this.config.classNames.display.time} `.trim(),
-        'aria-label': i18n.get(type, this.config)
+        'aria-label': i18n.get(type, this.config),
+        role: 'timer'
       }), '00:00');
 
       // Reference for updates
@@ -1726,7 +1729,7 @@ typeof navigator === "object" && (function (global, factory) {
       // Navigate through menus via arrow keys and space
       on.call(this, menuItem, 'keydown keyup', event => {
         // We only care about space and ⬆️ ⬇️️ ➡️
-        if (!['Space', 'ArrowUp', 'ArrowDown', 'ArrowRight'].includes(event.key)) {
+        if (![' ', 'ArrowUp', 'ArrowDown', 'ArrowRight'].includes(event.key)) {
           return;
         }
 
@@ -1741,11 +1744,11 @@ typeof navigator === "object" && (function (global, factory) {
         const isRadioButton = matches(menuItem, '[role="menuitemradio"]');
 
         // Show the respective menu
-        if (!isRadioButton && ['Space', 'ArrowRight'].includes(event.key)) {
+        if (!isRadioButton && [' ', 'ArrowRight'].includes(event.key)) {
           controls.showMenuPanel.call(this, type, true);
         } else {
           let target;
-          if (event.key !== 'Space') {
+          if (event.key !== ' ') {
             if (event.key === 'ArrowDown' || isRadioButton && event.key === 'ArrowRight') {
               target = menuItem.nextElementSibling;
               if (!is.element(target)) {
@@ -1810,7 +1813,7 @@ typeof navigator === "object" && (function (global, factory) {
         }
       });
       this.listeners.bind(menuItem, 'click keyup', event => {
-        if (is.keyboardEvent(event) && event.key !== 'Space') {
+        if (is.keyboardEvent(event) && event.key !== ' ') {
           return;
         }
         event.preventDefault();
@@ -1950,7 +1953,7 @@ typeof navigator === "object" && (function (global, factory) {
       }
 
       // WebKit only
-      if (!browser.isWebkit) {
+      if (!browser.isWebKit && !browser.isIPadOS) {
         return;
       }
 
@@ -2333,7 +2336,7 @@ typeof navigator === "object" && (function (global, factory) {
       toggleHidden(this.elements.settings.menu, !visible);
     },
     // Focus the first menu item in a given (or visible) menu
-    focusFirstMenuItem(pane, tabFocus = false) {
+    focusFirstMenuItem(pane, focusVisible = false) {
       if (this.elements.settings.popup.hidden) {
         return;
       }
@@ -2342,7 +2345,7 @@ typeof navigator === "object" && (function (global, factory) {
         target = Object.values(this.elements.settings.panels).find(p => !p.hidden);
       }
       const firstItem = target.querySelector('[role^="menuitem"]');
-      setFocus.call(this, firstItem, tabFocus);
+      setFocus.call(this, firstItem, focusVisible);
     },
     // Show/hide menu
     toggleMenu(input) {
@@ -2418,7 +2421,7 @@ typeof navigator === "object" && (function (global, factory) {
       };
     },
     // Show a panel in the menu
-    showMenuPanel(type = '', tabFocus = false) {
+    showMenuPanel(type = '', focusVisible = false) {
       const target = this.elements.container.querySelector(`#plyr-settings-${this.id}-${type}`);
 
       // Nothing to show, bail
@@ -2469,7 +2472,7 @@ typeof navigator === "object" && (function (global, factory) {
       toggleHidden(target, false);
 
       // Focus the first item
-      controls.focusFirstMenuItem.call(this, target, tabFocus);
+      controls.focusFirstMenuItem.call(this, target, focusVisible);
     },
     // Set the download URL
     setDownloadUrl() {
@@ -2596,7 +2599,7 @@ typeof navigator === "object" && (function (global, factory) {
           // Volume range control
           // Ignored on iOS as it's handled globally
           // https://developer.apple.com/library/safari/documentation/AudioVideo/Conceptual/Using_HTML5_Audio_Video/Device-SpecificConsiderations/Device-SpecificConsiderations.html
-          if (control === 'volume' && !browser.isIos) {
+          if (control === 'volume' && !browser.isIos && !browser.isIPadOS) {
             // Set the attributes
             const attributes = {
               max: 1,
@@ -3388,8 +3391,7 @@ typeof navigator === "object" && (function (global, factory) {
     autoplay: false,
     // Only allow one media playing at once (vimeo only)
     autopause: true,
-    // Allow inline playback on iOS (this effects YouTube/Vimeo - HTML5 requires the attribute present)
-    // TODO: Remove iosNative fullscreen option in favour of this (logic needs work)
+    // Allow inline playback on iOS
     playsinline: true,
     // Default time to skip when rewind/fast forward
     seekTime: 10,
@@ -3419,7 +3421,7 @@ typeof navigator === "object" && (function (global, factory) {
     // Sprite (for icons)
     loadSprite: true,
     iconPrefix: 'plyr',
-    iconUrl: 'https://cdn.plyr.io/3.7.3/plyr.svg',
+    iconUrl: 'https://cdn.plyr.io/3.7.8/plyr.svg',
     // Blank video (used to prevent errors on source change)
     blankVideo: 'https://cdn.plyr.io/static/blank.mp4',
     // Quality default
@@ -3652,7 +3654,6 @@ typeof navigator === "object" && (function (global, factory) {
       marker: 'plyr__progress__marker',
       hidden: 'plyr__sr-only',
       hideControls: 'plyr--hide-controls',
-      isIos: 'plyr--is-ios',
       isTouch: 'plyr--is-touch',
       uiSupported: 'plyr--full-ui',
       noTransition: 'plyr--no-transition',
@@ -3680,7 +3681,6 @@ typeof navigator === "object" && (function (global, factory) {
         supported: 'plyr--airplay-supported',
         active: 'plyr--airplay-active'
       },
-      tabFocus: 'plyr__tab-focus',
       previewThumbnails: {
         // Tooltip thumbs
         thumbContainer: 'plyr__preview-thumb',
@@ -3825,9 +3825,7 @@ typeof navigator === "object" && (function (global, factory) {
   class Fullscreen {
     constructor(player) {
       _defineProperty$1(this, "onChange", () => {
-        if (!this.enabled) {
-          return;
-        }
+        if (!this.supported) return;
 
         // Update toggle button
         const button = this.player.elements.buttons.fullscreen;
@@ -3844,8 +3842,8 @@ typeof navigator === "object" && (function (global, factory) {
         // Store or restore scroll position
         if (toggle) {
           this.scrollPosition = {
-            x: window.scrollX || 0,
-            y: window.scrollY || 0
+            x: window.scrollX ?? 0,
+            y: window.scrollY ?? 0
           };
         } else {
           window.scrollTo(this.scrollPosition.x, this.scrollPosition.y);
@@ -3872,9 +3870,7 @@ typeof navigator === "object" && (function (global, factory) {
           const hasProperty = is.string(viewport.content) && viewport.content.includes(property);
           if (toggle) {
             this.cleanupViewport = !hasProperty;
-            if (!hasProperty) {
-              viewport.content += `,${property}`;
-            }
+            if (!hasProperty) viewport.content += `,${property}`;
           } else if (this.cleanupViewport) {
             viewport.content = viewport.content.split(',').filter(part => part.trim() !== property).join(',');
           }
@@ -3883,11 +3879,10 @@ typeof navigator === "object" && (function (global, factory) {
         // Toggle button and fire events
         this.onChange();
       });
+      // Trap focus inside container
       _defineProperty$1(this, "trapFocus", event => {
-        // Bail if iOS, not active, not the tab key
-        if (browser.isIos || !this.active || event.key !== 'Tab') {
-          return;
-        }
+        // Bail if iOS/iPadOS, not active, not the tab key
+        if (browser.isIos || browser.isIPadOS || !this.active || event.key !== 'Tab') return;
 
         // Get the current focused element
         const focused = document.activeElement;
@@ -3904,28 +3899,22 @@ typeof navigator === "object" && (function (global, factory) {
           event.preventDefault();
         }
       });
+      // Update UI
       _defineProperty$1(this, "update", () => {
-        if (this.enabled) {
+        if (this.supported) {
           let mode;
-          if (this.forceFallback) {
-            mode = 'Fallback (forced)';
-          } else if (Fullscreen.native) {
-            mode = 'Native';
-          } else {
-            mode = 'Fallback';
-          }
+          if (this.forceFallback) mode = 'Fallback (forced)';else if (Fullscreen.nativeSupported) mode = 'Native';else mode = 'Fallback';
           this.player.debug.log(`${mode} fullscreen enabled`);
         } else {
           this.player.debug.log('Fullscreen not supported and fallback disabled');
         }
 
         // Add styling hook to show button
-        toggleClass(this.player.elements.container, this.player.config.classNames.fullscreen.enabled, this.enabled);
+        toggleClass(this.player.elements.container, this.player.config.classNames.fullscreen.enabled, this.supported);
       });
+      // Make an element fullscreen
       _defineProperty$1(this, "enter", () => {
-        if (!this.enabled) {
-          return;
-        }
+        if (!this.supported) return;
 
         // iOS native fullscreen doesn't need the request step
         if (browser.isIos && this.player.config.fullscreen.iosNative) {
@@ -3934,7 +3923,7 @@ typeof navigator === "object" && (function (global, factory) {
           } else {
             this.target.webkitEnterFullscreen();
           }
-        } else if (!Fullscreen.native || this.forceFallback) {
+        } else if (!Fullscreen.nativeSupported || this.forceFallback) {
           this.toggleFallback(true);
         } else if (!this.prefix) {
           this.target.requestFullscreen({
@@ -3944,16 +3933,19 @@ typeof navigator === "object" && (function (global, factory) {
           this.target[`${this.prefix}Request${this.property}`]();
         }
       });
+      // Bail from fullscreen
       _defineProperty$1(this, "exit", () => {
-        if (!this.enabled) {
-          return;
-        }
+        if (!this.supported) return;
 
         // iOS native fullscreen
         if (browser.isIos && this.player.config.fullscreen.iosNative) {
-          this.target.webkitExitFullscreen();
+          if (this.player.isVimeo) {
+            this.player.embed.exitFullscreen();
+          } else {
+            this.target.webkitEnterFullscreen();
+          }
           silencePromise(this.player.play());
-        } else if (!Fullscreen.native || this.forceFallback) {
+        } else if (!Fullscreen.nativeSupported || this.forceFallback) {
           this.toggleFallback(false);
         } else if (!this.prefix) {
           (document.cancelFullScreen || document.exitFullscreen).call(document);
@@ -3962,12 +3954,9 @@ typeof navigator === "object" && (function (global, factory) {
           document[`${this.prefix}${action}${this.property}`]();
         }
       });
+      // Toggle state
       _defineProperty$1(this, "toggle", () => {
-        if (!this.active) {
-          this.enter();
-        } else {
-          this.exit();
-        }
+        if (!this.active) this.enter();else this.exit();
       });
       // Keep reference to parent
       this.player = player;
@@ -4010,26 +3999,22 @@ typeof navigator === "object" && (function (global, factory) {
 
       // Update the UI
       this.update();
-
-      // this.toggle = this.toggle.bind(this);
     }
 
     // Determine if native supported
-    static get native() {
+    static get nativeSupported() {
       return !!(document.fullscreenEnabled || document.webkitFullscreenEnabled || document.mozFullScreenEnabled || document.msFullscreenEnabled);
     }
 
     // If we're actually using native
-    get usingNative() {
-      return Fullscreen.native && !this.forceFallback;
+    get useNative() {
+      return Fullscreen.nativeSupported && !this.forceFallback;
     }
 
     // Get the prefix for handlers
     static get prefix() {
       // No prefix
-      if (is.function(document.exitFullscreen)) {
-        return '';
-      }
+      if (is.function(document.exitFullscreen)) return '';
 
       // Check for fullscreen support by vendor prefix
       let value = '';
@@ -4047,19 +4032,26 @@ typeof navigator === "object" && (function (global, factory) {
       return this.prefix === 'moz' ? 'FullScreen' : 'Fullscreen';
     }
 
-    // Determine if fullscreen is enabled
-    get enabled() {
-      return (Fullscreen.native || this.player.config.fullscreen.fallback) && this.player.config.fullscreen.enabled && this.player.supported.ui && this.player.isVideo;
+    // Determine if fullscreen is supported
+    get supported() {
+      return [
+      // Fullscreen is enabled in config
+      this.player.config.fullscreen.enabled,
+      // Must be a video
+      this.player.isVideo,
+      // Either native is supported or fallback enabled
+      Fullscreen.nativeSupported || this.player.config.fullscreen.fallback,
+      // YouTube has no way to trigger fullscreen, so on devices with no native support, playsinline
+      // must be enabled and iosNative fullscreen must be disabled to offer the fullscreen fallback
+      !this.player.isYouTube || Fullscreen.nativeSupported || !browser.isIos || this.player.config.playsinline && !this.player.config.fullscreen.iosNative].every(Boolean);
     }
 
     // Get active state
     get active() {
-      if (!this.enabled) {
-        return false;
-      }
+      if (!this.supported) return false;
 
       // Fallback using classname
-      if (!Fullscreen.native || this.forceFallback) {
+      if (!Fullscreen.nativeSupported || this.forceFallback) {
         return hasClass(this.target, this.player.config.classNames.fullscreen.fallback);
       }
       const element = !this.prefix ? this.target.getRootNode().fullscreenElement : this.target.getRootNode()[`${this.prefix}${this.property}Element`];
@@ -4068,7 +4060,7 @@ typeof navigator === "object" && (function (global, factory) {
 
     // Get target element
     get target() {
-      return browser.isIos && this.player.config.fullscreen.iosNative ? this.player.media : this.player.elements.fullscreen || this.player.elements.container;
+      return browser.isIos && this.player.config.fullscreen.iosNative ? this.player.media : this.player.elements.fullscreen ?? this.player.elements.container;
     }
   }
 
@@ -4175,9 +4167,6 @@ typeof navigator === "object" && (function (global, factory) {
       // Check for airplay support
       toggleClass(this.elements.container, this.config.classNames.airplay.supported, support.airplay && this.isHTML5);
 
-      // Add iOS class
-      toggleClass(this.elements.container, this.config.classNames.isIos, browser.isIos);
-
       // Add touch class
       toggleClass(this.elements.container, this.config.classNames.isTouch, this.touch);
 
@@ -4356,6 +4345,7 @@ typeof navigator === "object" && (function (global, factory) {
 
   class Listeners {
     constructor(_player) {
+      // Device is touch enabled
       _defineProperty$1(this, "firstTouch", () => {
         const {
           player
@@ -4368,62 +4358,7 @@ typeof navigator === "object" && (function (global, factory) {
         // Add touch class
         toggleClass(elements.container, player.config.classNames.isTouch, true);
       });
-      _defineProperty$1(this, "setTabFocus", event => {
-        const {
-          player
-        } = this;
-        const {
-          elements
-        } = player;
-        const {
-          key,
-          type,
-          timeStamp
-        } = event;
-        clearTimeout(this.focusTimer);
-
-        // Ignore any key other than tab
-        if (type === 'keydown' && key !== 'Tab') {
-          return;
-        }
-
-        // Store reference to event timeStamp
-        if (type === 'keydown') {
-          this.lastKeyDown = timeStamp;
-        }
-
-        // Remove current classes
-        const removeCurrent = () => {
-          const className = player.config.classNames.tabFocus;
-          const current = getElements.call(player, `.${className}`);
-          toggleClass(current, className, false);
-        };
-
-        // Determine if a key was pressed to trigger this event
-        const wasKeyDown = timeStamp - this.lastKeyDown <= 20;
-
-        // Ignore focus events if a key was pressed prior
-        if (type === 'focus' && !wasKeyDown) {
-          return;
-        }
-
-        // Remove all current
-        removeCurrent();
-
-        // Delay the adding of classname until the focus has changed
-        // This event fires before the focusin event
-        if (type !== 'focusout') {
-          this.focusTimer = setTimeout(() => {
-            const focused = document.activeElement;
-
-            // Ignore if current focus element isn't inside the player
-            if (!elements.container.contains(focused)) {
-              return;
-            }
-            toggleClass(document.activeElement, player.config.classNames.tabFocus, true);
-          }, 10);
-        }
-      });
+      // Global window & document listeners
       _defineProperty$1(this, "global", (toggle = true) => {
         const {
           player
@@ -4439,10 +4374,8 @@ typeof navigator === "object" && (function (global, factory) {
 
         // Detect touch by events
         once.call(player, document.body, 'touchstart', this.firstTouch);
-
-        // Tab focus detection
-        toggleListener.call(player, document.body, 'keydown focus blur focusout', this.setTabFocus, toggle, false, true);
       });
+      // Container listeners
       _defineProperty$1(this, "container", () => {
         const {
           player
@@ -4550,6 +4483,7 @@ typeof navigator === "object" && (function (global, factory) {
           method.call(player, window, 'resize', resized);
         });
       });
+      // Listen for media events
       _defineProperty$1(this, "media", () => {
         const {
           player
@@ -4677,6 +4611,7 @@ typeof navigator === "object" && (function (global, factory) {
           triggerEvent.call(player, elements.container, event.type, true, detail);
         });
       });
+      // Run default and custom handlers
       _defineProperty$1(this, "proxy", (event, defaultHandler, customHandlerKey) => {
         const {
           player
@@ -4695,6 +4630,7 @@ typeof navigator === "object" && (function (global, factory) {
           defaultHandler.call(player, event);
         }
       });
+      // Trigger custom and default handlers
       _defineProperty$1(this, "bind", (element, type, defaultHandler, customHandlerKey, passive = true) => {
         const {
           player
@@ -4703,6 +4639,7 @@ typeof navigator === "object" && (function (global, factory) {
         const hasCustomHandler = is.function(customHandler);
         on.call(player, element, type, event => this.proxy(event, defaultHandler, customHandlerKey), passive && !hasCustomHandler);
       });
+      // Listen for control events
       _defineProperty$1(this, "controls", () => {
         const {
           player
@@ -4777,7 +4714,7 @@ typeof navigator === "object" && (function (global, factory) {
         // We have to bind to keyup otherwise Firefox triggers a click when a keydown event handler shifts focus
         // https://bugzilla.mozilla.org/show_bug.cgi?id=1220143
         this.bind(elements.buttons.settings, 'keyup', event => {
-          if (!['Space', 'Enter'].includes(event.key)) {
+          if (![' ', 'Enter'].includes(event.key)) {
             return;
           }
 
@@ -4901,7 +4838,7 @@ typeof navigator === "object" && (function (global, factory) {
         });
 
         // Polyfill for lower fill in <input type="range"> for webkit
-        if (browser.isWebkit) {
+        if (browser.isWebKit) {
           Array.from(getElements.call(player, 'input[type="range"]')).forEach(element => {
             this.bind(element, 'input', event => controls.updateRangeFill.call(player, event.target));
           });
@@ -5002,7 +4939,6 @@ typeof navigator === "object" && (function (global, factory) {
       this.lastKeyDown = null;
       this.handleKey = this.handleKey.bind(this);
       this.toggleMenu = this.toggleMenu.bind(this);
-      this.setTabFocus = this.setTabFocus.bind(this);
       this.firstTouch = this.firstTouch.bind(this);
     }
 
@@ -5059,13 +4995,13 @@ typeof navigator === "object" && (function (global, factory) {
           if (focused !== seek && matches(focused, editable)) {
             return;
           }
-          if (event.key === 'Space' && matches(focused, 'button, [role^="menuitem"]')) {
+          if (event.key === ' ' && matches(focused, 'button, [role^="menuitem"]')) {
             return;
           }
         }
 
         // Which keys should we prevent default
-        const preventDefault = ['Space', 'ArrowLeft', 'ArrowUp', 'ArrowRight', 'ArrowDown', '0', '1', '2', '3', '4', '5', '6', '7', '8', '9', 'c', 'f', 'k', 'l', 'm'];
+        const preventDefault = [' ', 'ArrowLeft', 'ArrowUp', 'ArrowRight', 'ArrowDown', '0', '1', '2', '3', '4', '5', '6', '7', '8', '9', 'c', 'f', 'k', 'l', 'm'];
 
         // If the key is found prevent default (e.g. prevent scrolling for arrows)
         if (preventDefault.includes(key)) {
@@ -5087,7 +5023,7 @@ typeof navigator === "object" && (function (global, factory) {
               seekByIncrement(parseInt(key, 10));
             }
             break;
-          case 'Space':
+          case ' ':
           case 'k':
             if (!repeat) {
               silencePromise(player.togglePlay());
@@ -5140,8 +5076,6 @@ typeof navigator === "object" && (function (global, factory) {
     toggleMenu(event) {
       controls.toggleMenu.call(this.player, event);
     }
-
-    // Device is touch enabled
   }
 
   var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
@@ -5553,7 +5487,7 @@ typeof navigator === "object" && (function (global, factory) {
         autoplay: player.autoplay,
         muted: player.muted,
         gesture: 'media',
-        playsinline: !this.config.fullscreen.iosNative,
+        playsinline: player.config.playsinline,
         // hash has to be added to iframe-URL
         ...hashParam,
         ...frameParams
@@ -5704,7 +5638,7 @@ typeof navigator === "object" && (function (global, factory) {
         },
         set(input) {
           const toggle = is.boolean(input) ? input : false;
-          player.embed.setVolume(toggle ? 0 : player.config.volume).then(() => {
+          player.embed.setMuted(toggle ? true : player.config.muted).then(() => {
             muted = toggle;
             triggerEvent.call(player, player.media, 'volumechange');
           });
@@ -5977,7 +5911,7 @@ typeof navigator === "object" && (function (global, factory) {
         const posterSrc = s => `https://i.ytimg.com/vi/${videoId}/${s}default.jpg`;
 
         // Check thumbnail images in order of quality, but reject fallback thumbnails (120px wide)
-        loadImage(posterSrc('maxres'), 121) // Higest quality and unpadded
+        loadImage(posterSrc('maxres'), 121) // Highest quality and un-padded
         .catch(() => loadImage(posterSrc('sd'), 121)) // 480p padded 4:3
         .catch(() => loadImage(posterSrc('hq'))) // 360p padded 4:3. Always exists
         .then(image => ui.setPoster.call(player, image.src)).then(src => {
@@ -6003,7 +5937,7 @@ typeof navigator === "object" && (function (global, factory) {
           // Disable keyboard as we handle it
           disablekb: 1,
           // Allow iOS inline playback
-          playsinline: !player.config.fullscreen.iosNative ? 1 : 0,
+          playsinline: player.config.playsinline && !player.config.fullscreen.iosNative ? 1 : 0,
           // Captions are flaky on YouTube
           cc_load_policy: player.captions.active ? 1 : 0,
           cc_lang_pref: player.config.captions.language,
@@ -6022,7 +5956,7 @@ typeof navigator === "object" && (function (global, factory) {
                 100: 'The video requested was not found. This error occurs when a video has been removed (for any reason) or has been marked as private.',
                 101: 'The owner of the requested video does not allow it to be played in embedded players.',
                 150: 'The owner of the requested video does not allow it to be played in embedded players.'
-              }[code] || 'An unknown error occured';
+              }[code] || 'An unknown error occurred';
               player.media.error = {
                 code,
                 message
@@ -6334,6 +6268,9 @@ typeof navigator === "object" && (function (global, factory) {
      * @return {Ads}
      */
     constructor(player) {
+      /**
+       * Load the IMA SDK
+       */
       _defineProperty$1(this, "load", () => {
         if (!this.enabled) {
           return;
@@ -6351,6 +6288,9 @@ typeof navigator === "object" && (function (global, factory) {
           this.ready();
         }
       });
+      /**
+       * Get the ads instance ready
+       */
       _defineProperty$1(this, "ready", () => {
         // Double check we're enabled
         if (!this.enabled) {
@@ -6372,6 +6312,14 @@ typeof navigator === "object" && (function (global, factory) {
         // Setup the IMA SDK
         this.setupIMA();
       });
+      /**
+       * In order for the SDK to display ads for our video, we need to tell it where to put them,
+       * so here we define our ad container. This div is set up to render on top of the video player.
+       * Using the code below, we tell the SDK to render ads within that div. We also provide a
+       * handle to the content video player - the SDK will poll the current time of our player to
+       * properly place mid-rolls. After we create the ad display container, we initialize it. On
+       * mobile devices, this initialization is done as the result of a user action.
+       */
       _defineProperty$1(this, "setupIMA", () => {
         // Create the container for our advertisements
         this.elements.container = createElement('div', {
@@ -6401,6 +6349,9 @@ typeof navigator === "object" && (function (global, factory) {
         // Request video ads to be pre-loaded
         this.requestAds();
       });
+      /**
+       * Request advertisements
+       */
       _defineProperty$1(this, "requestAds", () => {
         const {
           container
@@ -6427,6 +6378,10 @@ typeof navigator === "object" && (function (global, factory) {
           this.onAdError(error);
         }
       });
+      /**
+       * Update the ad countdown
+       * @param {Boolean} start
+       */
       _defineProperty$1(this, "pollCountdown", (start = false) => {
         if (!start) {
           clearInterval(this.countdownTimer);
@@ -6440,6 +6395,10 @@ typeof navigator === "object" && (function (global, factory) {
         };
         this.countdownTimer = setInterval(update, 100);
       });
+      /**
+       * This method is called whenever the ads are ready inside the AdDisplayContainer
+       * @param {Event} event - adsManagerLoadedEvent
+       */
       _defineProperty$1(this, "onAdsManagerLoaded", event => {
         // Load could occur after a source change (race condition)
         if (!this.enabled) {
@@ -6490,6 +6449,12 @@ typeof navigator === "object" && (function (global, factory) {
           });
         }
       });
+      /**
+       * 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
+       * https://developers.google.com/interactive-media-ads/docs/sdks/html5/v3/apis#ima.AdEvent.Type
+       * @param {Event} event
+       */
       _defineProperty$1(this, "onAdEvent", event => {
         const {
           container
@@ -6585,10 +6550,19 @@ typeof navigator === "object" && (function (global, factory) {
             break;
         }
       });
+      /**
+       * Any ad error handling comes through here
+       * @param {Event} event
+       */
       _defineProperty$1(this, "onAdError", event => {
         this.cancel();
         this.player.debug.warn('Ads error', event);
       });
+      /**
+       * Setup hooks for Plyr and window events. This ensures
+       * the mid- and post-roll launch at the correct time. And
+       * resize the advertisement when the player resizes
+       */
       _defineProperty$1(this, "listeners", () => {
         const {
           container
@@ -6624,6 +6598,9 @@ typeof navigator === "object" && (function (global, factory) {
           }
         });
       });
+      /**
+       * Initialize the adsManager and start playing advertisements
+       */
       _defineProperty$1(this, "play", () => {
         const {
           container
@@ -6656,6 +6633,9 @@ typeof navigator === "object" && (function (global, factory) {
           }
         }).catch(() => {});
       });
+      /**
+       * Resume our video
+       */
       _defineProperty$1(this, "resumeContent", () => {
         // Hide the advertisement container
         this.elements.container.style.zIndex = '';
@@ -6666,6 +6646,9 @@ typeof navigator === "object" && (function (global, factory) {
         // Play video
         silencePromise(this.player.media.play());
       });
+      /**
+       * Pause our video
+       */
       _defineProperty$1(this, "pauseContent", () => {
         // Show the advertisement container
         this.elements.container.style.zIndex = 3;
@@ -6676,6 +6659,12 @@ typeof navigator === "object" && (function (global, factory) {
         // Pause our video.
         this.player.media.pause();
       });
+      /**
+       * Destroy the adsManager so we can grab new ads after this. If we don't then we're not
+       * allowed to call new ads based on google policies, as they interpret this as an accidental
+       * video requests. https://developers.google.com/interactive-
+       * media-ads/docs/sdks/android/faq#8
+       */
       _defineProperty$1(this, "cancel", () => {
         // Pause our video
         if (this.initialized) {
@@ -6688,6 +6677,9 @@ typeof navigator === "object" && (function (global, factory) {
         // Re-create our adsManager
         this.loadAds();
       });
+      /**
+       * Re-create our adsManager
+       */
       _defineProperty$1(this, "loadAds", () => {
         // Tell our adsManager to go bye bye
         this.managerPromise.then(() => {
@@ -6708,6 +6700,11 @@ typeof navigator === "object" && (function (global, factory) {
           this.requestAds();
         }).catch(() => {});
       });
+      /**
+       * Handles callbacks after an ad event was invoked
+       * @param {String} event - Event type
+       * @param args
+       */
       _defineProperty$1(this, "trigger", (event, ...args) => {
         const handlers = this.events[event];
         if (is.array(handlers)) {
@@ -6718,6 +6715,12 @@ typeof navigator === "object" && (function (global, factory) {
           });
         }
       });
+      /**
+       * Add event listeners
+       * @param {String} event - Event type
+       * @param {Function} callback - Callback for when event occurs
+       * @return {Ads}
+       */
       _defineProperty$1(this, "on", (event, callback) => {
         if (!is.array(this.events[event])) {
           this.events[event] = [];
@@ -6725,6 +6728,14 @@ typeof navigator === "object" && (function (global, factory) {
         this.events[event].push(callback);
         return this;
       });
+      /**
+       * Setup a safety timer for when the ad network doesn't respond for whatever reason.
+       * The advertisement has 12 seconds to get its things together. We stop this timer when the
+       * advertisement is playing, or when a user action is required to start, then we clear the
+       * timer on ad ready
+       * @param {Number} time
+       * @param {String} from
+       */
       _defineProperty$1(this, "startSafetyTimer", (time, from) => {
         this.player.debug.log(`Safety timer invoked from: ${from}`);
         this.safetyTimer = setTimeout(() => {
@@ -6732,6 +6743,10 @@ typeof navigator === "object" && (function (global, factory) {
           this.clearSafetyTimer('startSafetyTimer()');
         }, time);
       });
+      /**
+       * Clear our safety timer(s)
+       * @param {String} from
+       */
       _defineProperty$1(this, "clearSafetyTimer", from => {
         if (!is.nullOrUndefined(this.safetyTimer)) {
           this.player.debug.log(`Safety timer cleared from: ${from}`);
@@ -6770,11 +6785,6 @@ typeof navigator === "object" && (function (global, factory) {
       } = this;
       return this.player.isHTML5 && this.player.isVideo && config.enabled && (!is.empty(config.publisherId) || is.url(config.tagUrl));
     }
-
-    /**
-     * Load the IMA SDK
-     */
-
     // Build the tag URL
     get tagUrl() {
       const {
@@ -6795,15 +6805,6 @@ typeof navigator === "object" && (function (global, factory) {
       const base = 'https://go.aniview.com/api/adserver6/vast/';
       return `${base}?${buildUrlParams(params)}`;
     }
-
-    /**
-     * In order for the SDK to display ads for our video, we need to tell it where to put them,
-     * so here we define our ad container. This div is set up to render on top of the video player.
-     * Using the code below, we tell the SDK to render ads within that div. We also provide a
-     * handle to the content video player - the SDK will poll the current time of our player to
-     * properly place mid-rolls. After we create the ad display container, we initialize it. On
-     * mobile devices, this initialization is done as the result of a user action.
-     */
   }
 
   /**
@@ -6902,9 +6903,13 @@ typeof navigator === "object" && (function (global, factory) {
 
           // Check to see if thumb container size was specified manually in CSS
           this.determineContainerAutoSizing();
+
+          // Set up listeners
+          this.listeners();
           this.loaded = true;
         });
       });
+      // Download VTT files and parse them
       _defineProperty$1(this, "getThumbnails", () => {
         return new Promise(resolve => {
           const {
@@ -6940,6 +6945,7 @@ typeof navigator === "object" && (function (global, factory) {
           }
         });
       });
+      // Process individual VTT file
       _defineProperty$1(this, "getThumbnail", url => {
         return new Promise(resolve => {
           fetch(url).then(response => {
@@ -7046,6 +7052,9 @@ typeof navigator === "object" && (function (global, factory) {
           });
         }
       });
+      /**
+       * Setup hooks for Plyr and window events
+       */
       _defineProperty$1(this, "listeners", () => {
         // Hide thumbnail preview - on mouse click, mouse leave (in listeners.js for now), and video play/seek. All four are required, e.g., for buffering
         this.player.on('play', () => {
@@ -7058,6 +7067,9 @@ typeof navigator === "object" && (function (global, factory) {
           this.lastTime = this.player.media.currentTime;
         });
       });
+      /**
+       * Create HTML elements for image containers
+       */
       _defineProperty$1(this, "render", () => {
         // Create HTML element: plyr__preview-thumbnail-container
         this.elements.thumb.container = createElement('div', {
@@ -7133,6 +7145,7 @@ typeof navigator === "object" && (function (global, factory) {
           this.loadImage(qualityIndex);
         }
       });
+      // Show the image that's currently specified in this.showingThumb
       _defineProperty$1(this, "loadImage", (qualityIndex = 0) => {
         const thumbNum = this.showingThumb;
         const thumbnail = this.thumbnails[qualityIndex];
@@ -7186,6 +7199,7 @@ typeof navigator === "object" && (function (global, factory) {
         // Each step here has a short time delay, and only continues if still hovering/seeking the same spot. This is to protect slow connections from overloading
         this.preloadNearby(thumbNum, true).then(this.preloadNearby(thumbNum, false)).then(this.getHigherQuality(qualityIndex, previewImage, frame, thumbFilename));
       });
+      // Remove all preview images that aren't the designated current image
       _defineProperty$1(this, "removeOldImages", currentImage => {
         // Get a list of all images, convert it from a DOM list to an array
         Array.from(this.currentImageContainer.children).forEach(image => {
@@ -7210,6 +7224,8 @@ typeof navigator === "object" && (function (global, factory) {
           }
         });
       });
+      // Preload images before and after the current one. Only if the user is still hovering/seeking the same frame
+      // This will only preload the lowest quality
       _defineProperty$1(this, "preloadNearby", (thumbNum, forward = true) => {
         return new Promise(resolve => {
           setTimeout(() => {
@@ -7255,6 +7271,7 @@ typeof navigator === "object" && (function (global, factory) {
           }, 300);
         });
       });
+      // If user has been hovering current image for half a second, look for a higher quality one
       _defineProperty$1(this, "getHigherQuality", (currentQualityIndex, previewImage, frame, thumbFilename) => {
         if (currentQualityIndex < this.thumbnails.length - 1) {
           // Only use the higher quality version if it's going to look any better - if the current thumb is of a lower pixel density than the thumbnail container
@@ -7296,6 +7313,7 @@ typeof navigator === "object" && (function (global, factory) {
           this.sizeSpecifiedInCSS = true;
         }
       });
+      // Set the size to be about a quarter of the size of video. Unless option dynamicSize === false, in which case it needs to be set in CSS
       _defineProperty$1(this, "setThumbContainerSizeAndPos", () => {
         const {
           imageContainer
@@ -7332,6 +7350,7 @@ typeof navigator === "object" && (function (global, factory) {
         // The arrow can follow the cursor
         container.style.setProperty('--preview-arrow-offset', `${position - clamped}px`);
       });
+      // Can't use 100% width, in case the video is a different aspect ratio to the video container
       _defineProperty$1(this, "setScrubbingContainerSize", () => {
         const {
           width,
@@ -7343,6 +7362,7 @@ typeof navigator === "object" && (function (global, factory) {
         this.elements.scrubbing.container.style.width = `${width}px`;
         this.elements.scrubbing.container.style.height = `${height}px`;
       });
+      // Sprites need to be offset to the correct location
       _defineProperty$1(this, "setImageSizeAndOffset", (previewImage, frame) => {
         if (!this.usingSprites) return;
 
@@ -7567,6 +7587,9 @@ typeof navigator === "object" && (function (global, factory) {
   // Plyr instance
   class Plyr {
     constructor(target, options) {
+      /**
+       * Play the media, or play the advertisement (if they are not blocked)
+       */
       _defineProperty$1(this, "play", () => {
         if (!is.function(this.media.play)) {
           return null;
@@ -7580,12 +7603,19 @@ typeof navigator === "object" && (function (global, factory) {
         // Return the promise (for HTML5)
         return this.media.play();
       });
+      /**
+       * Pause the media
+       */
       _defineProperty$1(this, "pause", () => {
         if (!this.playing || !is.function(this.media.pause)) {
           return null;
         }
         return this.media.pause();
       });
+      /**
+       * Toggle playback based on current status
+       * @param {Boolean} input
+       */
       _defineProperty$1(this, "togglePlay", input => {
         // Toggle based on current state if nothing passed
         const toggle = is.boolean(input) ? input : !this.playing;
@@ -7594,6 +7624,9 @@ typeof navigator === "object" && (function (global, factory) {
         }
         return this.pause();
       });
+      /**
+       * Stop playback
+       */
       _defineProperty$1(this, "stop", () => {
         if (this.isHTML5) {
           this.pause();
@@ -7602,28 +7635,55 @@ typeof navigator === "object" && (function (global, factory) {
           this.media.stop();
         }
       });
+      /**
+       * Restart playback
+       */
       _defineProperty$1(this, "restart", () => {
         this.currentTime = 0;
       });
+      /**
+       * Rewind
+       * @param {Number} seekTime - how far to rewind in seconds. Defaults to the config.seekTime
+       */
       _defineProperty$1(this, "rewind", seekTime => {
         this.currentTime -= is.number(seekTime) ? seekTime : this.config.seekTime;
       });
+      /**
+       * Fast forward
+       * @param {Number} seekTime - how far to fast forward in seconds. Defaults to the config.seekTime
+       */
       _defineProperty$1(this, "forward", seekTime => {
         this.currentTime += is.number(seekTime) ? seekTime : this.config.seekTime;
       });
+      /**
+       * Increase volume
+       * @param {Boolean} step - How much to decrease by (between 0 and 1)
+       */
       _defineProperty$1(this, "increaseVolume", step => {
         const volume = this.media.muted ? 0 : this.volume;
         this.volume = volume + (is.number(step) ? step : 0);
       });
+      /**
+       * Decrease volume
+       * @param {Boolean} step - How much to decrease by (between 0 and 1)
+       */
       _defineProperty$1(this, "decreaseVolume", step => {
         this.increaseVolume(-step);
       });
+      /**
+       * Trigger the airplay dialog
+       * TODO: update player with state, support, enabled
+       */
       _defineProperty$1(this, "airplay", () => {
         // Show dialog if supported
         if (support.airplay) {
           this.media.webkitShowPlaybackTargetPicker();
         }
       });
+      /**
+       * Toggle the player controls
+       * @param {Boolean} [toggle] - Whether to show the controls
+       */
       _defineProperty$1(this, "toggleControls", toggle => {
         // Don't toggle if missing UI support or if it's audio
         if (this.supported.ui && !this.isAudio) {
@@ -7648,15 +7708,37 @@ typeof navigator === "object" && (function (global, factory) {
         }
         return false;
       });
+      /**
+       * Add event listeners
+       * @param {String} event - Event type
+       * @param {Function} callback - Callback for when event occurs
+       */
       _defineProperty$1(this, "on", (event, callback) => {
         on.call(this, this.elements.container, event, callback);
       });
+      /**
+       * Add event listeners once
+       * @param {String} event - Event type
+       * @param {Function} callback - Callback for when event occurs
+       */
       _defineProperty$1(this, "once", (event, callback) => {
         once.call(this, this.elements.container, event, callback);
       });
+      /**
+       * Remove event listeners
+       * @param {String} event - Event type
+       * @param {Function} callback - Callback for when event occurs
+       */
       _defineProperty$1(this, "off", (event, callback) => {
         off(this.elements.container, event, callback);
       });
+      /**
+       * Destroy an instance
+       * Event listeners are removed when elements are removed
+       * http://stackoverflow.com/questions/12528049/if-a-dom-element-is-removed-are-its-listeners-also-removed-from-memory
+       * @param {Function} callback - Callback for when destroy is complete
+       * @param {Boolean} soft - Whether it's a soft destroy (for source changes etc)
+       */
       _defineProperty$1(this, "destroy", (callback, soft = false) => {
         if (!this.ready) {
           return;
@@ -7755,6 +7837,10 @@ typeof navigator === "object" && (function (global, factory) {
           setTimeout(done, 200);
         }
       });
+      /**
+       * Check for support for a mime type (HTML5 only)
+       * @param {String} type - Mime type
+       */
       _defineProperty$1(this, "supports", type => support.mime.call(this, type));
       this.timers = {};
 
@@ -7952,7 +8038,7 @@ typeof navigator === "object" && (function (global, factory) {
       }
 
       // Check for support again but with type
-      this.supported = support.check(this.type, this.provider, this.config.playsinline);
+      this.supported = support.check(this.type, this.provider);
 
       // If no support for even API, bail
       if (!this.supported.api) {
@@ -7972,9 +8058,7 @@ typeof navigator === "object" && (function (global, factory) {
 
       // Wrap media
       if (!is.element(this.elements.container)) {
-        this.elements.container = createElement('div', {
-          tabindex: 0
-        });
+        this.elements.container = createElement('div');
         wrap(this.media, this.elements.container);
       }
 
@@ -8053,11 +8137,6 @@ typeof navigator === "object" && (function (global, factory) {
     get isAudio() {
       return this.type === types.audio;
     }
-
-    /**
-     * Play the media, or play the advertisement (if they are not blocked)
-     */
-
     /**
      * Get playing state
      */
@@ -8085,12 +8164,6 @@ typeof navigator === "object" && (function (global, factory) {
     get ended() {
       return Boolean(this.media.ended);
     }
-
-    /**
-     * Toggle playback based on current status
-     * @param {Boolean} input
-     */
-
     /**
      * Seek to a time
      * @param {Number} input - where to seek to in seconds. Defaults to 0 (the start)
@@ -8212,12 +8285,6 @@ typeof navigator === "object" && (function (global, factory) {
     get volume() {
       return Number(this.media.volume);
     }
-
-    /**
-     * Increase volume
-     * @param {Boolean} step - How much to decrease by (between 0 and 1)
-     */
-
     /**
      * Set muted state
      * @param {Boolean} mute
@@ -8631,7 +8698,7 @@ typeof navigator === "object" && (function (global, factory) {
     }
 
     /**
-     * Sets the preview thubmnails for the current source
+     * Sets the preview thumbnails for the current source
      */
     setPreviewThumbnails(thumbnailSource) {
       if (this.previewThumbnails && this.previewThumbnails.loaded) {
@@ -8645,20 +8712,13 @@ typeof navigator === "object" && (function (global, factory) {
         this.previewThumbnails = new PreviewThumbnails(this);
       }
     }
-
-    /**
-     * Trigger the airplay dialog
-     * TODO: update player with state, support, enabled
-     */
-
     /**
      * Check for support
      * @param {String} type - Player type (audio/video)
      * @param {String} provider - Provider (html5/youtube/vimeo)
-     * @param {Boolean} inline - Where player has `playsinline` sttribute
      */
-    static supported(type, provider, inline) {
-      return support.check(type, provider, inline);
+    static supported(type, provider) {
+      return support.check(type, provider);
     }
 
     /**