Vimeo keyboard focus fix (Fixes #317), Fix for Vimeo on basic support devices

This commit is contained in:
Sam Potts 2016-07-23 11:11:17 +10:00
parent 0505e49038
commit d7cc29f2fb
5 changed files with 31 additions and 13 deletions

View File

@ -1,5 +1,9 @@
# Changelog # Changelog
## v1.8.12
- Vimeo keyboard focus fix (Fixes #317)
- Fix for Vimeo on basic support devices
## v1.8.11 ## v1.8.11
- Fix for keyboard navigation on Vimeo (Fixes #317) - Fix for keyboard navigation on Vimeo (Fixes #317)
- Fix for bug introduced in v1.8.9 related to additional controls - Fix for bug introduced in v1.8.9 related to additional controls

4
dist/plyr.js vendored

File diff suppressed because one or more lines are too long

View File

@ -1,6 +1,6 @@
{ {
"name": "plyr", "name": "plyr",
"version": "1.8.11", "version": "1.8.12",
"description": "A simple, accessible and customizable HTML5, YouTube and Vimeo media player", "description": "A simple, accessible and customizable HTML5, YouTube and Vimeo media player",
"homepage": "http://plyr.io", "homepage": "http://plyr.io",
"main": "src/js/plyr.js", "main": "src/js/plyr.js",

View File

@ -121,7 +121,7 @@ Include the `plyr.js` script before the closing `</body>` tag and then call `ply
If you want to use our CDN for the JavaScript, you can use the following: If you want to use our CDN for the JavaScript, you can use the following:
```html ```html
<script src="https://cdn.plyr.io/1.8.11/plyr.js"></script> <script src="https://cdn.plyr.io/1.8.12/plyr.js"></script>
``` ```
### CSS ### CSS
@ -134,11 +134,11 @@ Include the `plyr.css` stylsheet into your `<head>`
If you want to use our CDN for the default CSS, you can use the following: If you want to use our CDN for the default CSS, you can use the following:
```html ```html
<link rel="stylesheet" href="https://cdn.plyr.io/1.8.11/plyr.css"> <link rel="stylesheet" href="https://cdn.plyr.io/1.8.12/plyr.css">
``` ```
### SVG Sprite ### SVG Sprite
The SVG sprite is loaded automatically from our CDN. To change this, see the [#options](Options) below. For reference, the CDN hosted SVG sprite can be found at `https://cdn.plyr.io/1.8.11/plyr.svg`. The SVG sprite is loaded automatically from our CDN. To change this, see the [#options](Options) below. For reference, the CDN hosted SVG sprite can be found at `https://cdn.plyr.io/1.8.12/plyr.svg`.
## Advanced ## Advanced

View File

@ -1,6 +1,6 @@
// ========================================================================== // ==========================================================================
// Plyr // Plyr
// plyr.js v1.8.11 // plyr.js v1.8.12
// https://github.com/selz/plyr // https://github.com/selz/plyr
// License: The MIT License (MIT) // License: The MIT License (MIT)
// ========================================================================== // ==========================================================================
@ -43,7 +43,7 @@
displayDuration: true, displayDuration: true,
loadSprite: true, loadSprite: true,
iconPrefix: 'plyr', iconPrefix: 'plyr',
iconUrl: 'https://cdn.plyr.io/1.8.11/plyr.svg', iconUrl: 'https://cdn.plyr.io/1.8.12/plyr.svg',
clickToPlay: true, clickToPlay: true,
hideControls: true, hideControls: true,
showPosterOnEnd: false, showPosterOnEnd: false,
@ -1494,8 +1494,13 @@
} }
// Vimeo // Vimeo
else if (plyr.type === 'vimeo') { else if (plyr.type === 'vimeo') {
// Create the YouTube container // Vimeo needs an extra div to hide controls on desktop (which has full support)
plyr.media.appendChild(container); if (plyr.supported.full) {
plyr.media.appendChild(container);
}
else {
container = plyr.media;
}
// Set ID // Set ID
container.setAttribute('id', id); container.setAttribute('id', id);
@ -1517,6 +1522,7 @@
} }
} }
// Soundcloud // Soundcloud
// TODO: Currently unsupported and undocumented
else if (plyr.type === 'soundcloud') { else if (plyr.type === 'soundcloud') {
// Inject the iframe // Inject the iframe
var soundCloud = document.createElement('iframe'); var soundCloud = document.createElement('iframe');
@ -1744,10 +1750,18 @@
_displayDuration(); _displayDuration();
}); });
// Captions // TODO: Captions
if (config.captions.defaultActive) { /*if (config.captions.defaultActive) {
plyr.embed.enableTextTrack('en'); plyr.embed.enableTextTrack('en');
} }*/
// Fix keyboard focus issues
// https://github.com/Selz/plyr/issues/317
plyr.embed.on('loaded', function() {
if(_is.htmlElement(plyr.embed.element)) {
plyr.embed.element.setAttribute('tabindex', '-1');
}
});
plyr.embed.on('play', function() { plyr.embed.on('play', function() {
plyr.media.paused = false; plyr.media.paused = false;