5 files changed, 35 insertions, 20 deletions
diff --git a/src/js/listeners.js b/src/js/listeners.js
index f8ea997f..dd6e2adb 100644
--- a/src/js/listeners.js
+++ b/src/js/listeners.js
@@ -317,7 +317,7 @@ class Listeners {
 
         // Check for audio tracks on load
         // We can't use `loadedmetadata` as it doesn't seem to have audio tracks at that point
-        on.call(player, player.media, 'canplay', () => {
+        on.call(player, player.media, 'canplay loadeddata', () => {
             toggleHidden(elements.volume, !player.hasAudio);
             toggleHidden(elements.buttons.mute, !player.hasAudio);
         });
diff --git a/src/js/plugins/vimeo.js b/src/js/plugins/vimeo.js
index 3c3dee20..2d9ba6e2 100644
--- a/src/js/plugins/vimeo.js
+++ b/src/js/plugins/vimeo.js
@@ -70,8 +70,9 @@ const vimeo = {
     // Set aspect ratio
     // For Vimeo we have an extra 300% height <div> to hide the standard controls and UI
     setAspectRatio(input) {
-        const [x, y] = (is.string(input) ? input : this.config.ratio).split(':');
+        const [x, y] = (is.string(input) ? input : this.config.ratio).split(':').map(Number);
         const padding = (100 / x) * y;
+        vimeo.padding = padding;
         this.elements.wrapper.style.paddingBottom = `${padding}%`;
 
         if (this.supported.ui) {
@@ -299,8 +300,8 @@ const vimeo = {
 
         // Set aspect ratio based on video size
         Promise.all([player.embed.getVideoWidth(), player.embed.getVideoHeight()]).then(dimensions => {
-            const ratio = getAspectRatio(dimensions[0], dimensions[1]);
-            vimeo.setAspectRatio.call(this, ratio);
+            vimeo.ratio = getAspectRatio(dimensions[0], dimensions[1]);
+            vimeo.setAspectRatio.call(this, vimeo.ratio);
         });
 
         // Set autopause
@@ -404,6 +405,22 @@ const vimeo = {
             triggerEvent.call(player, player.media, 'error');
         });
 
+        // Set height/width on fullscreen
+        player.on('enterfullscreen exitfullscreen', event => {
+            const { target } = player.fullscreen;
+
+            // Ignore for iOS native
+            if (target !== player.elements.container) {
+                return;
+            }
+
+            const toggle = event.type === 'enterfullscreen';
+            const [x, y] = vimeo.ratio.split(':').map(Number);
+            const dimension = x > y ? 'width' : 'height';
+
+            target.style[dimension] = toggle ? `${vimeo.padding}%` : null;
+        });
+
         // Rebuild UI
         setTimeout(() => ui.build.call(player), 0);
     },
diff --git a/src/js/source.js b/src/js/source.js
index 8c9fdf44..337c949c 100644
--- a/src/js/source.js
+++ b/src/js/source.js
@@ -114,12 +114,9 @@ const source = {
                 // HTML5 stuff
                 if (this.isHTML5) {
                     // Setup captions
-                    if ('tracks' in input) {
+                    if (Object.keys(input).includes('tracks')) {
                         source.insertElements.call(this, 'track', input.tracks);
                     }
-
-                    // Load HTML5 sources
-                    this.media.load();
                 }
 
                 // If HTML5 or embed but not fully supported, setupInterface and call ready now
@@ -128,6 +125,11 @@ const source = {
                     ui.build.call(this);
                 }
 
+                if (this.isHTML5) {
+                    // Load HTML5 sources
+                    this.media.load();
+                }
+
                 // Update the fullscreen support
                 this.fullscreen.update();
             },
diff --git a/src/js/support.js b/src/js/support.js
index 59f27c3b..9257df13 100644
--- a/src/js/support.js
+++ b/src/js/support.js
@@ -70,25 +70,21 @@ const support = {
     // Related: http://www.leanbackplayer.com/test/h5mt.html
     mime(inputType) {
         const [mediaType] = inputType.split('/');
+        let type = inputType;
+
+        // Verify we're using HTML5 and there's no media type mismatch
         if (!this.isHTML5 || mediaType !== this.type) {
             return false;
         }
 
-        let type;
-        if (inputType && inputType.includes('codecs=')) {
-            // Use input directly
-            type = inputType;
-        } else if (inputType === 'audio/mpeg') {
-            // Skip codec
-            type = 'audio/mpeg;';
-        } else if (inputType in defaultCodecs) {
-            // Use codec
-            type = `${inputType}; codecs="${defaultCodecs[inputType]}"`;
+        // Add codec if required
+        if (Object.keys(defaultCodecs).includes(type)) {
+            type += `; codecs="${defaultCodecs[inputType]}"`;
         }
 
         try {
             return Boolean(type && this.media.canPlayType(type).replace(/no/, ''));
-        } catch (err) {
+        } catch (e) {
             return false;
         }
     },
diff --git a/src/js/utils/elements.js b/src/js/utils/elements.js
index a6722da2..6be634e5 100644
--- a/src/js/utils/elements.js
+++ b/src/js/utils/elements.js
@@ -293,7 +293,7 @@ export function setFocus(element = null, tabFocus = false) {
     }
 
     // Set regular focus
-    element.focus();
+    element.focus({ preventScroll: true });
 
     // If we want to mimic keyboard focus via tab
     if (tabFocus) {