diff --git a/src/js/config/defaults.js b/src/js/config/defaults.js index 90a74a23..aeff6efc 100644 --- a/src/js/config/defaults.js +++ b/src/js/config/defaults.js @@ -69,6 +69,7 @@ const defaults = { // Quality default quality: { default: 576, + // The options to display in the UI, if available for the source media options: [4320, 2880, 2160, 1440, 1080, 720, 576, 480, 360, 240], forced: false, onChange: null, @@ -84,7 +85,8 @@ const defaults = { // Speed default and options to display speed: { selected: 1, - options: [0.5, 0.75, 1, 1.25, 1.5, 1.75, 2], + // The options to display in the UI, if available for the source media (e.g. Vimeo does not support 4x) + options: [0.5, 0.75, 1, 1.25, 1.5, 1.75, 2, 4], }, // Keyboard shortcut settings diff --git a/src/js/controls.js b/src/js/controls.js index 0b66d8f6..f93cb8a3 100644 --- a/src/js/controls.js +++ b/src/js/controls.js @@ -9,7 +9,7 @@ import captions from './captions'; import html5 from './html5'; import support from './support'; import { repaint, transitionEndEvent } from './utils/animation'; -import { dedupe } from './utils/arrays'; +import { dedupe, fillRange } from './utils/arrays'; import browser from './utils/browser'; import { createElement, @@ -1044,7 +1044,7 @@ const controls = { }, // Set a list of available captions languages - setSpeedMenu(options) { + setSpeedMenu() { // Menu required if (!is.element(this.elements.settings.panels.speed)) { return; @@ -1053,18 +1053,14 @@ const controls = { const type = 'speed'; const list = this.elements.settings.panels.speed.querySelector('[role="menu"]'); - // Set the speed options - if (is.array(options)) { - this.options.speed = options; - } else if (is.array(this.config.speed.options)) { + // Determine options to display + // Vimeo and YouTube limit to 0.5x-2x + if (this.isVimeo || this.isYouTube) { + this.options.speed = fillRange(0.5, 2, 0.25).filter(s => this.config.speed.options.includes(s)); + } else { this.options.speed = this.config.speed.options; - } else if (this.isHTML5 || this.isVimeo) { - this.options.speed = [0.5, 0.75, 1, 1.25, 1.5, 1.75, 2]; } - // Set options if passed and filter based on config - this.options.speed = this.options.speed.filter(speed => this.config.speed.options.includes(speed)); - // Toggle the pane and tab const toggle = !is.empty(this.options.speed) && this.options.speed.length > 1; controls.toggleMenuButton.call(this, type, toggle); diff --git a/src/js/plugins/vimeo.js b/src/js/plugins/vimeo.js index 8df5ad15..9529f2cd 100644 --- a/src/js/plugins/vimeo.js +++ b/src/js/plugins/vimeo.js @@ -196,12 +196,6 @@ const vimeo = { .then(() => { speed = input; triggerEvent.call(player, player.media, 'ratechange'); - }) - .catch(error => { - // Hide menu item (and menu if empty) - if (error.name === 'Error') { - controls.setSpeedMenu.call(player, []); - } }); }, }); diff --git a/src/js/utils/arrays.js b/src/js/utils/arrays.js index 69ef242c..c0d69626 100644 --- a/src/js/utils/arrays.js +++ b/src/js/utils/arrays.js @@ -21,3 +21,11 @@ export function closest(array, value) { return array.reduce((prev, curr) => (Math.abs(curr - value) < Math.abs(prev - value) ? curr : prev)); } + +export function fillRange(start, end, step = 1) { + const len = Math.floor((end - start) / step) + 1; + + return Array(len) + .fill() + .map((_, idx) => start + idx * step); +}