diff options
Diffstat (limited to 'src/js')
| -rw-r--r-- | src/js/config/defaults.js | 12 | ||||
| -rw-r--r-- | src/js/plugins/previewThumbnails.js | 4 | ||||
| -rw-r--r-- | src/js/plugins/vimeo.js | 28 | ||||
| -rw-r--r-- | src/js/plugins/youtube.js | 40 | ||||
| -rw-r--r-- | src/js/plyr.js | 2 | ||||
| -rw-r--r-- | src/js/utils/events.js | 8 |
6 files changed, 51 insertions, 43 deletions
diff --git a/src/js/config/defaults.js b/src/js/config/defaults.js index 650bcd2a..0044d409 100644 --- a/src/js/config/defaults.js +++ b/src/js/config/defaults.js @@ -407,9 +407,6 @@ const defaults = { tagUrl: '', }, - // YouTube nocookies mode - noCookie: false, - // Preview Thumbnails plugin previewThumbnails: { enabled: false, @@ -424,6 +421,15 @@ const defaults = { speed: true, transparent: false, }, + + // YouTube plugin + youtube: { + noCookie: false, // Whether to use an alternative version of YouTube without cookies + rel: 0, // No related vids + showinfo: 0, // Hide info + iv_load_policy: 3, // Hide annotations + modestbranding: 1, // Hide logos as much as possible (they still show one in the corner when paused) + }, }; export default defaults; diff --git a/src/js/plugins/previewThumbnails.js b/src/js/plugins/previewThumbnails.js index 3832be5c..2bb9cedc 100644 --- a/src/js/plugins/previewThumbnails.js +++ b/src/js/plugins/previewThumbnails.js @@ -223,8 +223,8 @@ class PreviewThumbnails { // Show scrubbing preview on.call(this.player, this.player.elements.progress, 'mousedown touchstart', event => { - // Only act on left mouse button (0), or touch device (!event.button) - if (!event.button || event.button === 0) { + // Only act on left mouse button (0), or touch device (event.button is false) + if (event.button === false || event.button === 0) { this.mouseDown = true; // Wait until media has a duration if (this.player.media.duration) { diff --git a/src/js/plugins/vimeo.js b/src/js/plugins/vimeo.js index 5fcd9ac8..a7664e73 100644 --- a/src/js/plugins/vimeo.js +++ b/src/js/plugins/vimeo.js @@ -10,6 +10,7 @@ import { triggerEvent } from '../utils/events'; import fetch from '../utils/fetch'; import is from '../utils/is'; import loadScript from '../utils/loadScript'; +import { extend } from '../utils/objects'; import { format, stripHTML } from '../utils/strings'; import { setAspectRatio } from '../utils/style'; import { buildUrlParams } from '../utils/urls'; @@ -64,21 +65,22 @@ const vimeo = { // API Ready ready() { const player = this; + const config = player.config.vimeo; // Get Vimeo params for the iframe - const options = { - loop: player.config.loop.active, - autoplay: player.autoplay, - muted: player.muted, - byline: player.config.vimeo.byline, - portrait: player.config.vimeo.portrait, - title: player.config.vimeo.title, - speed: player.config.vimeo.speed, - transparent: player.config.vimeo.transparent === true ? 1 : 0, - gesture: 'media', - playsinline: !this.config.fullscreen.iosNative, - }; - const params = buildUrlParams(options); + const params = buildUrlParams( + extend( + {}, + { + loop: player.config.loop.active, + autoplay: player.autoplay, + muted: player.muted, + gesture: 'media', + playsinline: !this.config.fullscreen.iosNative, + }, + config, + ), + ); // Get the source URL or ID let source = player.media.getAttribute('src'); diff --git a/src/js/plugins/youtube.js b/src/js/plugins/youtube.js index 9d47aa53..0bd232e0 100644 --- a/src/js/plugins/youtube.js +++ b/src/js/plugins/youtube.js @@ -9,6 +9,7 @@ import fetch from '../utils/fetch'; import is from '../utils/is'; import loadImage from '../utils/loadImage'; import loadScript from '../utils/loadScript'; +import { extend } from '../utils/objects'; import { format, generateId } from '../utils/strings'; import { setAspectRatio } from '../utils/style'; @@ -144,30 +145,29 @@ const youtube = { }) .catch(() => {}); + const config = player.config.youtube; + // Setup instance // https://developers.google.com/youtube/iframe_api_reference player.embed = new window.YT.Player(id, { videoId, - host: player.config.noCookie ? 'https://www.youtube-nocookie.com' : undefined, - playerVars: { - autoplay: player.config.autoplay ? 1 : 0, // Autoplay - hl: player.config.hl, // iframe interface language - controls: player.supported.ui ? 0 : 1, // Only show controls if not fully supported - rel: 0, // No related vids - showinfo: 0, // Hide info - iv_load_policy: 3, // Hide annotations - modestbranding: 1, // Hide logos as much as possible (they still show one in the corner when paused) - disablekb: 1, // Disable keyboard as we handle it - playsinline: 1, // Allow iOS inline playback - - // Tracking for stats - // origin: window ? `${window.location.protocol}//${window.location.host}` : null, - widget_referrer: window ? window.location.href : null, - - // Captions are flaky on YouTube - cc_load_policy: player.captions.active ? 1 : 0, - cc_lang_pref: player.config.captions.language, - }, + host: config.noCookie ? 'https://www.youtube-nocookie.com' : undefined, + playerVars: extend( + {}, + { + autoplay: player.config.autoplay ? 1 : 0, // Autoplay + hl: player.config.hl, // iframe interface language + controls: player.supported.ui ? 0 : 1, // Only show controls if not fully supported + disablekb: 1, // Disable keyboard as we handle it + playsinline: !player.config.fullscreen.iosNative ? 1 : 0, // Allow iOS inline playback + // Captions are flaky on YouTube + cc_load_policy: player.captions.active ? 1 : 0, + cc_lang_pref: player.config.captions.language, + // Tracking for stats + widget_referrer: window ? window.location.href : null, + }, + config, + ), events: { onError(event) { // YouTube may fire onError twice, so only handle it once diff --git a/src/js/plyr.js b/src/js/plyr.js index 674ffb3c..927eb33d 100644 --- a/src/js/plyr.js +++ b/src/js/plyr.js @@ -188,7 +188,7 @@ class Plyr { // YouTube requires the playsinline in the URL if (this.isYouTube) { this.config.playsinline = truthy.includes(url.searchParams.get('playsinline')); - this.config.hl = url.searchParams.get('hl'); // TODO: Should this be setting language? + this.config.youtube.hl = url.searchParams.get('hl'); // TODO: Should this be setting language? } else { this.config.playsinline = true; } diff --git a/src/js/utils/events.js b/src/js/utils/events.js index 9f734f04..d304c312 100644 --- a/src/js/utils/events.js +++ b/src/js/utils/events.js @@ -73,10 +73,10 @@ export function off(element, events = '', callback, passive = true, capture = fa // Bind once-only event handler export function once(element, events = '', callback, passive = true, capture = false) { - function onceCallback(...args) { + const onceCallback = (...args) => { off(element, events, onceCallback, passive, capture); callback.apply(this, args); - } + }; toggleListener.call(this, element, events, onceCallback, true, passive, capture); } @@ -114,7 +114,7 @@ export function unbindListeners() { // Run method when / if player is ready export function ready() { - return new Promise( - resolve => (this.ready ? setTimeout(resolve, 0) : on.call(this, this.elements.container, 'ready', resolve)), + return new Promise(resolve => + this.ready ? setTimeout(resolve, 0) : on.call(this, this.elements.container, 'ready', resolve), ).then(() => {}); } |