aboutsummaryrefslogtreecommitdiffstats
path: root/src
diff options
context:
space:
mode:
Diffstat (limited to 'src')
-rw-r--r--src/js/captions.js6
-rw-r--r--src/js/console.js2
-rw-r--r--src/js/controls.js14
-rw-r--r--src/js/listeners.js11
-rw-r--r--src/js/plugins/ads.js14
-rw-r--r--src/js/plugins/vimeo.js20
-rw-r--r--src/js/plugins/youtube.js20
-rw-r--r--src/js/plyr.js14
-rw-r--r--src/js/plyr.polyfilled.js2
-rw-r--r--src/js/utils/loadSprite.js2
-rw-r--r--src/sass/components/controls.scss10
11 files changed, 72 insertions, 43 deletions
diff --git a/src/js/captions.js b/src/js/captions.js
index 732b2e38..9dca5505 100644
--- a/src/js/captions.js
+++ b/src/js/captions.js
@@ -191,8 +191,10 @@ const captions = {
return;
}
- // Toggle state
- this.elements.buttons.captions.pressed = active;
+ // Toggle button if it's enabled
+ if (this.elements.buttons.captions) {
+ this.elements.buttons.captions.pressed = active;
+ }
// Add class hook
toggleClass(this.elements.container, activeClass, active);
diff --git a/src/js/console.js b/src/js/console.js
index 7c5ec1b4..e8099569 100644
--- a/src/js/console.js
+++ b/src/js/console.js
@@ -17,10 +17,12 @@ export default class Console {
// eslint-disable-next-line no-console
return this.enabled ? Function.prototype.bind.call(console.log, console) : noop;
}
+
get warn() {
// eslint-disable-next-line no-console
return this.enabled ? Function.prototype.bind.call(console.warn, console) : noop;
}
+
get error() {
// eslint-disable-next-line no-console
return this.enabled ? Function.prototype.bind.call(console.error, console) : noop;
diff --git a/src/js/controls.js b/src/js/controls.js
index d79aaee7..2bc8b4de 100644
--- a/src/js/controls.js
+++ b/src/js/controls.js
@@ -16,11 +16,11 @@ import {
getElement,
getElements,
hasClass,
+ matches,
removeElement,
setAttributes,
toggleClass,
toggleHidden,
- matches,
} from './utils/elements';
import { off, on } from './utils/events';
import is from './utils/is';
@@ -187,7 +187,7 @@ const controls = {
}
if ('class' in attributes) {
- if (attributes.class.includes(this.config.classNames.control)) {
+ if (!attributes.class.includes(this.config.classNames.control)) {
attributes.class += ` ${this.config.classNames.control}`;
}
} else {
@@ -633,6 +633,16 @@ const controls = {
return;
}
+ // If duration is the 2**32 (shaka), Infinity (HLS), DASH-IF (Number.MAX_SAFE_INTEGER || Number.MAX_VALUE) indicating live we hide the currentTime and progressbar.
+ // https://github.com/video-dev/hls.js/blob/5820d29d3c4c8a46e8b75f1e3afa3e68c1a9a2db/src/controller/buffer-controller.js#L415
+ // https://github.com/google/shaka-player/blob/4d889054631f4e1cf0fbd80ddd2b71887c02e232/lib/media/streaming_engine.js#L1062
+ // https://github.com/Dash-Industry-Forum/dash.js/blob/69859f51b969645b234666800d4cb596d89c602d/src/dash/models/DashManifestModel.js#L338
+ if (this.duration >= 2**32) {
+ toggleHidden(this.elements.display.currentTime, true);
+ toggleHidden(this.elements.progress, true);
+ return;
+ }
+
// Update ARIA values
if (is.element(this.elements.inputs.seek)) {
this.elements.inputs.seek.setAttribute('aria-valuemax', this.duration);
diff --git a/src/js/listeners.js b/src/js/listeners.js
index d9811dd1..9583bd71 100644
--- a/src/js/listeners.js
+++ b/src/js/listeners.js
@@ -431,9 +431,11 @@ class Listeners {
};
// Play/pause toggle
- Array.from(this.player.elements.buttons.play).forEach(button => {
- bind(button, 'click', this.player.togglePlay, 'play');
- });
+ if (this.player.elements.buttons.play) {
+ Array.from(this.player.elements.buttons.play).forEach(button => {
+ bind(button, 'click', this.player.togglePlay, 'play');
+ });
+ }
// Pause
bind(this.player.elements.buttons.restart, 'click', this.player.restart, 'restart');
@@ -667,8 +669,7 @@ class Listeners {
const inverted = event.webkitDirectionInvertedFromDevice;
// Get delta from event. Invert if `inverted` is true
- const [x, y] = [event.deltaX, -event.deltaY]
- .map(value => inverted ? -value : value);
+ const [x, y] = [event.deltaX, -event.deltaY].map(value => (inverted ? -value : value));
// Using the biggest delta, normalize to 1 or -1 (or 0 if no delta)
const direction = Math.sign(Math.abs(x) > Math.abs(y) ? x : y);
diff --git a/src/js/plugins/ads.js b/src/js/plugins/ads.js
index 856772d5..f5727a1d 100644
--- a/src/js/plugins/ads.js
+++ b/src/js/plugins/ads.js
@@ -7,12 +7,12 @@
/* global google */
import i18n from '../i18n';
-import { createElement } from './../utils/elements';
-import { triggerEvent } from './../utils/events';
-import is from './../utils/is';
-import loadScript from './../utils/loadScript';
-import { formatTime } from './../utils/time';
-import { buildUrlParams } from './../utils/urls';
+import { createElement } from '../utils/elements';
+import { triggerEvent } from '../utils/events';
+import is from '../utils/is';
+import loadScript from '../utils/loadScript';
+import { formatTime } from '../utils/time';
+import { buildUrlParams } from '../utils/urls';
class Ads {
/**
@@ -100,7 +100,7 @@ class Ads {
const params = {
AV_PUBLISHERID: '58c25bb0073ef448b1087ad6',
AV_CHANNELID: '5a0458dc28a06145e4519d21',
- AV_URL: location.hostname,
+ AV_URL: window.location.hostname,
cb: Date.now(),
AV_WIDTH: 640,
AV_HEIGHT: 480,
diff --git a/src/js/plugins/vimeo.js b/src/js/plugins/vimeo.js
index 09339229..4cbdb5c4 100644
--- a/src/js/plugins/vimeo.js
+++ b/src/js/plugins/vimeo.js
@@ -2,16 +2,16 @@
// Vimeo plugin
// ==========================================================================
-import captions from './../captions';
-import controls from './../controls';
-import ui from './../ui';
-import { createElement, replaceElement, toggleClass } from './../utils/elements';
-import { triggerEvent } from './../utils/events';
-import fetch from './../utils/fetch';
-import is from './../utils/is';
-import loadScript from './../utils/loadScript';
-import { format, stripHTML } from './../utils/strings';
-import { buildUrlParams } from './../utils/urls';
+import captions from '../captions';
+import controls from '../controls';
+import ui from '../ui';
+import { createElement, replaceElement, toggleClass } from '../utils/elements';
+import { triggerEvent } from '../utils/events';
+import fetch from '../utils/fetch';
+import is from '../utils/is';
+import loadScript from '../utils/loadScript';
+import { format, stripHTML } from '../utils/strings';
+import { buildUrlParams } from '../utils/urls';
// Parse Vimeo ID from URL
function parseId(url) {
diff --git a/src/js/plugins/youtube.js b/src/js/plugins/youtube.js
index 94ab6dfa..b521be3c 100644
--- a/src/js/plugins/youtube.js
+++ b/src/js/plugins/youtube.js
@@ -2,16 +2,16 @@
// YouTube plugin
// ==========================================================================
-import controls from './../controls';
-import ui from './../ui';
-import { dedupe } from './../utils/arrays';
-import { createElement, replaceElement, toggleClass } from './../utils/elements';
-import { triggerEvent } from './../utils/events';
-import fetch from './../utils/fetch';
-import is from './../utils/is';
-import loadImage from './../utils/loadImage';
-import loadScript from './../utils/loadScript';
-import { format, generateId } from './../utils/strings';
+import controls from '../controls';
+import ui from '../ui';
+import { dedupe } from '../utils/arrays';
+import { createElement, replaceElement, toggleClass } from '../utils/elements';
+import { triggerEvent } from '../utils/events';
+import fetch from '../utils/fetch';
+import is from '../utils/is';
+import loadImage from '../utils/loadImage';
+import loadScript from '../utils/loadScript';
+import { format, generateId } from '../utils/strings';
// Parse YouTube ID from URL
function parseId(url) {
diff --git a/src/js/plyr.js b/src/js/plyr.js
index 37c2d3c2..d1f14881 100644
--- a/src/js/plyr.js
+++ b/src/js/plyr.js
@@ -1,6 +1,6 @@
// ==========================================================================
// Plyr
-// plyr.js v3.3.20
+// plyr.js v3.3.21
// https://github.com/sampotts/plyr
// License: The MIT License (MIT)
// ==========================================================================
@@ -310,18 +310,23 @@ class Plyr {
get isHTML5() {
return Boolean(this.provider === providers.html5);
}
+
get isEmbed() {
return Boolean(this.isYouTube || this.isVimeo);
}
+
get isYouTube() {
return Boolean(this.provider === providers.youtube);
}
+
get isVimeo() {
return Boolean(this.provider === providers.vimeo);
}
+
get isVideo() {
return Boolean(this.type === types.video);
}
+
get isAudio() {
return Boolean(this.type === types.audio);
}
@@ -489,8 +494,9 @@ class Plyr {
// Faux duration set via config
const fauxDuration = parseFloat(this.config.duration);
- // Media duration can be NaN before the media has loaded
- const duration = (this.media || {}).duration || 0;
+ // Media duration can be NaN or Infinity before the media has loaded
+ const realDuration = (this.media || {}).duration;
+ const duration = !is.number(realDuration) || realDuration === Infinity ? 0 : realDuration;
// If config duration is funky, use regular duration
return fauxDuration || duration;
@@ -944,6 +950,7 @@ class Plyr {
on(event, callback) {
on.call(this, this.elements.container, event, callback);
}
+
/**
* Add event listeners once
* @param {string} event - Event type
@@ -952,6 +959,7 @@ class Plyr {
once(event, callback) {
once.call(this, this.elements.container, event, callback);
}
+
/**
* Remove event listeners
* @param {string} event - Event type
diff --git a/src/js/plyr.polyfilled.js b/src/js/plyr.polyfilled.js
index 451fad8f..e5f8b42e 100644
--- a/src/js/plyr.polyfilled.js
+++ b/src/js/plyr.polyfilled.js
@@ -1,6 +1,6 @@
// ==========================================================================
// Plyr Polyfilled Build
-// plyr.js v3.3.20
+// plyr.js v3.3.21
// https://github.com/sampotts/plyr
// License: The MIT License (MIT)
// ==========================================================================
diff --git a/src/js/utils/loadSprite.js b/src/js/utils/loadSprite.js
index f05795f8..917bd6ac 100644
--- a/src/js/utils/loadSprite.js
+++ b/src/js/utils/loadSprite.js
@@ -2,7 +2,7 @@
// Sprite loader
// ==========================================================================
-import Storage from './../storage';
+import Storage from '../storage';
import fetch from './fetch';
import is from './is';
diff --git a/src/sass/components/controls.scss b/src/sass/components/controls.scss
index 91db1b20..9b203f43 100644
--- a/src/sass/components/controls.scss
+++ b/src/sass/components/controls.scss
@@ -11,6 +11,7 @@
.plyr__controls {
align-items: center;
display: flex;
+ justify-content: flex-end;
text-align: center;
// Spacing
@@ -23,6 +24,7 @@
&:first-child,
&:first-child + [data-plyr='pause'] {
margin-left: 0;
+ margin-right: auto;
}
}
@@ -48,13 +50,17 @@
// Video controls
.plyr--video .plyr__controls {
- background: linear-gradient(rgba($plyr-video-controls-bg, 0), rgba($plyr-video-controls-bg, 0.7));
+ background: linear-gradient(
+ rgba($plyr-video-controls-bg, 0),
+ rgba($plyr-video-controls-bg, 0.7)
+ );
border-bottom-left-radius: inherit;
border-bottom-right-radius: inherit;
bottom: 0;
color: $plyr-video-control-color;
left: 0;
- padding: ($plyr-control-spacing * 3.5) $plyr-control-spacing $plyr-control-spacing;
+ padding: ($plyr-control-spacing * 3.5) $plyr-control-spacing
+ $plyr-control-spacing;
position: absolute;
right: 0;
transition: opacity 0.4s ease-in-out, transform 0.4s ease-in-out;
generated by cgit v1.2.3 (git 2.25.1) at 2025-06-08 02:30:08 +0000