Styling tweaks for demo

1 files changed, 81 insertions, 85 deletions

diff --git a/dist/plyr.polyfilled.js b/dist/plyr.polyfilled.js
index ce17ff75..18a9213d 100644
--- a/dist/plyr.polyfilled.js
+++ b/dist/plyr.polyfilled.js
@@ -1087,7 +1087,7 @@ typeof navigator === "object" && (function (global, factory) {
   var createIteratorConstructor = function (IteratorConstructor, NAME, next) {
     var TO_STRING_TAG = NAME + ' Iterator';
     IteratorConstructor.prototype = objectCreate(IteratorPrototype$1, { next: createPropertyDescriptor(1, next) });
-    setToStringTag(IteratorConstructor, TO_STRING_TAG, false, true);
+    setToStringTag(IteratorConstructor, TO_STRING_TAG, false);
     iterators[TO_STRING_TAG] = returnThis$1;
     return IteratorConstructor;
   };
@@ -1162,7 +1162,7 @@ typeof navigator === "object" && (function (global, factory) {
           }
         }
         // Set @@toStringTag to native iterators
-        setToStringTag(CurrentIteratorPrototype, TO_STRING_TAG, true, true);
+        setToStringTag(CurrentIteratorPrototype, TO_STRING_TAG, true);
       }
     }
 
@@ -2074,7 +2074,8 @@ typeof navigator === "object" && (function (global, factory) {
     var url = new URL('b?e=1', 'http://a');
     var searchParams = url.searchParams;
     url.pathname = 'c%20d';
-    return !searchParams.sort
+    return (isPure && !url.toJSON)
+      || !searchParams.sort
       || url.href !== 'http://a/c%20d?e=1'
       || searchParams.get('e') !== '1'
       || String(new URLSearchParams('?a=1')) !== 'a=1'
@@ -4312,6 +4313,8 @@ typeof navigator === "object" && (function (global, factory) {
     iteratorWithReturn[ITERATOR$7] = function () {
       return this;
     };
+    // eslint-disable-next-line no-throw-literal
+    Array.from(iteratorWithReturn, function () { throw 2; });
   } catch (error) { /* empty */ }
 
   var checkCorrectnessOfIteration = function (exec, SKIP_CLOSING) {
@@ -4332,6 +4335,7 @@ typeof navigator === "object" && (function (global, factory) {
   };
 
   var INCORRECT_ITERATION = !checkCorrectnessOfIteration(function (iterable) {
+    Array.from(iterable);
   });
 
   // `Array.from` method
@@ -5944,7 +5948,7 @@ typeof navigator === "object" && (function (global, factory) {
     Promise: PromiseConstructor
   });
 
-  setToStringTag(PromiseConstructor, PROMISE, false, true);
+  setToStringTag(PromiseConstructor, PROMISE, false);
   setSpecies(PROMISE);
 
   PromiseWrapper = path[PROMISE];
@@ -6156,6 +6160,48 @@ typeof navigator === "object" && (function (global, factory) {
     empty: isEmpty$1
   };
 
+  var transitionEndEvent = function () {
+    var element = document.createElement('span');
+    var events = {
+      WebkitTransition: 'webkitTransitionEnd',
+      MozTransition: 'transitionend',
+      OTransition: 'oTransitionEnd otransitionend',
+      transition: 'transitionend'
+    };
+    var type = Object.keys(events).find(function (event) {
+      return element.style[event] !== undefined;
+    });
+    return is$1.string(type) ? events[type] : false;
+  }(); // Force repaint of element
+
+  function repaint(element, delay) {
+    setTimeout(function () {
+      try {
+        // eslint-disable-next-line no-param-reassign
+        element.hidden = true; // eslint-disable-next-line no-unused-expressions
+
+        element.offsetHeight; // eslint-disable-next-line no-param-reassign
+
+        element.hidden = false;
+      } catch (e) {// Do nothing
+      }
+    }, delay);
+  }
+
+  // ==========================================================================
+  // Browser sniffing
+  // Unfortunately, due to mixed support, UA sniffing is required
+  // ==========================================================================
+  var browser = {
+    isIE:
+    /* @cc_on!@ */
+    !!document.documentMode,
+    isEdge: window.navigator.userAgent.includes('Edge'),
+    isWebkit: 'WebkitAppearance' in document.documentElement.style && !/Edge/.test(navigator.userAgent),
+    isIPhone: /(iPhone|iPod)/gi.test(navigator.platform),
+    isIos: /(iPad|iPhone|iPod)/gi.test(navigator.platform)
+  };
+
   // https://github.com/WICG/EventListenerOptions/blob/gh-pages/explainer.md
   // https://www.youtube.com/watch?v=NPM6172J22g
 
@@ -6518,13 +6564,10 @@ typeof navigator === "object" && (function (global, factory) {
 
     if (!is$1.boolean(hide)) {
       hide = !element.hidden;
-    }
+    } // eslint-disable-next-line no-param-reassign
 
-    if (hide) {
-      element.setAttribute('hidden', '');
-    } else {
-      element.removeAttribute('hidden');
-    }
+
+    element.hidden = hide;
   } // Mirror Element.classList.toggle, with IE compatibility for "force" argument
 
   function toggleClass(element, className, force) {
@@ -6623,46 +6666,6 @@ typeof navigator === "object" && (function (global, factory) {
     }
   }
 
-  var transitionEndEvent = function () {
-    var element = document.createElement('span');
-    var events = {
-      WebkitTransition: 'webkitTransitionEnd',
-      MozTransition: 'transitionend',
-      OTransition: 'oTransitionEnd otransitionend',
-      transition: 'transitionend'
-    };
-    var type = Object.keys(events).find(function (event) {
-      return element.style[event] !== undefined;
-    });
-    return is$1.string(type) ? events[type] : false;
-  }(); // Force repaint of element
-
-  function repaint(element) {
-    setTimeout(function () {
-      try {
-        toggleHidden(element, true);
-        element.offsetHeight; // eslint-disable-line
-
-        toggleHidden(element, false);
-      } catch (e) {// Do nothing
-      }
-    }, 0);
-  }
-
-  // ==========================================================================
-  // Browser sniffing
-  // Unfortunately, due to mixed support, UA sniffing is required
-  // ==========================================================================
-  var browser = {
-    isIE:
-    /* @cc_on!@ */
-    !!document.documentMode,
-    isEdge: window.navigator.userAgent.includes('Edge'),
-    isWebkit: 'WebkitAppearance' in document.documentElement.style && !/Edge/.test(navigator.userAgent),
-    isIPhone: /(iPhone|iPod)/gi.test(navigator.platform),
-    isIos: /(iPad|iPhone|iPod)/gi.test(navigator.platform)
-  };
-
   var defaultCodecs = {
     'audio/ogg': 'vorbis',
     'audio/wav': '1',
@@ -6786,12 +6789,8 @@ typeof navigator === "object" && (function (global, factory) {
   }
   function getAspectRatio(input) {
     var parse = function parse(ratio) {
-      if (!validateRatio(ratio)) {
-        return null;
-      }
-
-      return ratio.split(':').map(Number);
-    }; // Provided ratio
+      return validateRatio(ratio) ? ratio.split(':').map(Number) : null;
+    }; // Try provided ratio
 
 
     var ratio = parse(input); // Get from config
@@ -6877,9 +6876,12 @@ typeof navigator === "object" && (function (global, factory) {
         return;
       }
 
-      var player = this; // Set aspect ratio if set
+      var player = this; // Set aspect ratio if fixed
+
+      if (!is$1.empty(this.config.ratio)) {
+        setAspectRatio.call(player);
+      } // Quality
 
-      setAspectRatio.call(player); // Quality
 
       Object.defineProperty(player.media, 'quality', {
         get: function get() {
@@ -9379,7 +9381,8 @@ typeof navigator === "object" && (function (global, factory) {
     controls: ['play-large', // 'restart',
     // 'rewind',
     'play', // 'fast-forward',
-    'progress', 'current-time', 'mute', 'volume', 'captions', 'settings', 'pip', 'airplay', // 'download',
+    'progress', 'current-time', // 'duration',
+    'mute', 'volume', 'captions', 'settings', 'pip', 'airplay', // 'download',
     'fullscreen'],
     settings: ['captions', 'quality', 'speed'],
     // Localisation
@@ -9437,8 +9440,7 @@ typeof navigator === "object" && (function (global, factory) {
       },
       youtube: {
         sdk: 'https://www.youtube.com/iframe_api',
-        api: 'https://noembed.com/embed?url=https://www.youtube.com/watch?v={0}' // 'https://www.googleapis.com/youtube/v3/videos?id={0}&key={1}&fields=items(snippet(title),fileDetails)&part=snippet',
-
+        api: 'https://noembed.com/embed?url=https://www.youtube.com/watch?v={0}'
       },
       googleIMA: {
         sdk: 'https://imasdk.googleapis.com/js/sdkloader/ima3.js'
@@ -9723,8 +9725,6 @@ typeof navigator === "object" && (function (global, factory) {
   }
 
   function toggleFallback() {
-    var _this = this;
-
     var toggle = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
 
     // Store or restore scroll position
@@ -9764,12 +9764,7 @@ typeof navigator === "object" && (function (global, factory) {
         viewport.content = viewport.content.split(',').filter(function (part) {
           return part.trim() !== property;
         }).join(',');
-      } // Force a repaint as sometimes Safari doesn't want to fill the screen
-
-
-      setTimeout(function () {
-        return repaint(_this.target);
-      }, 100);
+      }
     } // Toggle button and fire events
 
 
@@ -9780,7 +9775,7 @@ typeof navigator === "object" && (function (global, factory) {
   /*#__PURE__*/
   function () {
     function Fullscreen(player) {
-      var _this2 = this;
+      var _this = this;
 
       _classCallCheck(this, Fullscreen);
 
@@ -9800,16 +9795,16 @@ typeof navigator === "object" && (function (global, factory) {
 
       on.call(this.player, document, this.prefix === 'ms' ? 'MSFullscreenChange' : "".concat(this.prefix, "fullscreenchange"), function () {
         // TODO: Filter for target??
-        onChange.call(_this2);
+        onChange.call(_this);
       }); // Fullscreen toggle on double click
 
       on.call(this.player, this.player.elements.container, 'dblclick', function (event) {
         // Ignore double click in controls
-        if (is$1.element(_this2.player.elements.controls) && _this2.player.elements.controls.contains(event.target)) {
+        if (is$1.element(_this.player.elements.controls) && _this.player.elements.controls.contains(event.target)) {
           return;
         }
 
-        _this2.toggle();
+        _this.toggle();
       }); // Update the UI
 
       this.update();
@@ -10495,15 +10490,7 @@ typeof navigator === "object" && (function (global, factory) {
           timers.controls = setTimeout(function () {
             return ui.toggleControls.call(player, false);
           }, delay);
-        }); // Force edge to repaint on exit fullscreen
-        // TODO: Fix weird bug where Edge doesn't re-draw when exiting fullscreen
-
-        /* if (browser.isEdge) {
-            on.call(player, elements.container, 'exitfullscreen', () => {
-                setTimeout(() => repaint(elements.container), 100);
-            });
-        } */
-        // Set a gutter for Vimeo
+        }); // Set a gutter for Vimeo
 
         var setGutter = function setGutter(ratio, padding, toggle) {
           if (!player.isVimeo) {
@@ -10545,9 +10532,14 @@ typeof navigator === "object" && (function (global, factory) {
         on.call(player, elements.container, 'enterfullscreen exitfullscreen', function (event) {
           var _player$fullscreen = player.fullscreen,
               target = _player$fullscreen.target,
-              usingNative = _player$fullscreen.usingNative; // Ignore for iOS native
+              usingNative = _player$fullscreen.usingNative; // Ignore events not from target
 
-          if (!player.isEmbed || target !== elements.container) {
+          if (target !== elements.container) {
+            return;
+          } // If it's not an embed and no ratio specified
+
+
+          if (!player.isEmbed && is$1.empty(player.config.ratio)) {
             return;
           }
 
@@ -12903,7 +12895,11 @@ typeof navigator === "object" && (function (global, factory) {
         }
 
         this.getThumbnails().then(function () {
-          // Render DOM elements
+          if (!_this.enabled) {
+            return;
+          } // Render DOM elements
+
+
           _this.render(); // Check to see if thumb container size was specified manually in CSS