diff options
| -rw-r--r-- | package.json | 1 | ||||
| -rw-r--r-- | src/js/plyr.d.ts | 2 | ||||
| -rw-r--r-- | src/js/plyr.js | 13 | ||||
| -rw-r--r-- | src/js/ui.js | 2 | ||||
| -rw-r--r-- | src/js/utils/style.js | 6 | ||||
| -rw-r--r-- | tasks/build.js | 3 |
6 files changed, 21 insertions, 6 deletions
diff --git a/package.json b/package.json index 07cf5ddf..d57fb583 100644 --- a/package.json +++ b/package.json @@ -60,6 +60,7 @@ "gulp-filter": "^6.0.0", "gulp-header": "^2.0.9", "gulp-hub": "^4.2.0", + "gulp-if": "^3.0.0", "gulp-imagemin": "^7.1.0", "gulp-open": "^3.0.1", "gulp-plumber": "^1.2.1", diff --git a/src/js/plyr.d.ts b/src/js/plyr.d.ts index 357bb687..572ed2da 100644 --- a/src/js/plyr.d.ts +++ b/src/js/plyr.d.ts @@ -566,7 +566,7 @@ declare namespace Plyr { interface PreviewThumbnailsOptions { enabled?: boolean; - src?: string; + src?: string | string[]; } interface SourceInfo { diff --git a/src/js/plyr.js b/src/js/plyr.js index e924ac78..f2eb3afb 100644 --- a/src/js/plyr.js +++ b/src/js/plyr.js @@ -12,6 +12,7 @@ import { getProviderByUrl, providers, types } from './config/types'; import Console from './console'; import controls from './controls'; import Fullscreen from './fullscreen'; +import html5 from './html5'; import Listeners from './listeners'; import media from './media'; import Ads from './plugins/ads'; @@ -308,7 +309,7 @@ class Plyr { // Autoplay if required if (this.isHTML5 && this.config.autoplay) { - setTimeout(() => silencePromise(this.play()), 10); + this.once('canplay', () => silencePromise(this.play())); } // Seek time will be recorded (in listeners.js) so we can prevent hiding controls for a few seconds after seek @@ -1054,7 +1055,12 @@ class Plyr { const hiding = toggleClass(this.elements.container, this.config.classNames.hideControls, force); // Close menu - if (hiding && is.array(this.config.controls) && this.config.controls.includes('settings') && !is.empty(this.config.settings)) { + if ( + hiding && + is.array(this.config.controls) && + this.config.controls.includes('settings') && + !is.empty(this.config.settings) + ) { controls.toggleMenu.call(this, false); } @@ -1140,6 +1146,9 @@ class Plyr { // Unbind listeners unbindListeners.call(this); + // Cancel current network requests + html5.cancelRequests.call(this); + // Replace the container with the original element provided replaceElement(this.elements.original, this.elements.container); diff --git a/src/js/ui.js b/src/js/ui.js index d3d6fd69..fd27e2bc 100644 --- a/src/js/ui.js +++ b/src/js/ui.js @@ -270,7 +270,7 @@ const ui = { // Loop through values (as they are the keys when the object is spread 🤔) Object.values({ ...this.media.style }) // We're only fussed about Plyr specific properties - .filter(key => !is.empty(key) && key.startsWith('--plyr')) + .filter(key => !is.empty(key) && is.string(key) && key.startsWith('--plyr')) .forEach(key => { // Set on the container this.elements.container.style.setProperty(key, this.media.style.getPropertyValue(key)); diff --git a/src/js/utils/style.js b/src/js/utils/style.js index c2004fcb..aa57505e 100644 --- a/src/js/utils/style.js +++ b/src/js/utils/style.js @@ -68,7 +68,11 @@ export function setAspectRatio(input) { const height = (100 / this.media.offsetWidth) * parseInt(window.getComputedStyle(this.media).paddingBottom, 10); const offset = (height - padding) / (height / 50); - this.media.style.transform = `translateY(-${offset}%)`; + if(this.fullscreen.active) { + wrapper.style.paddingBottom = null; + } else { + this.media.style.transform = `translateY(-${offset}%)`; + } } else if (this.isHTML5) { wrapper.classList.toggle(this.config.classNames.videoFixedRatio, ratio !== null); } diff --git a/tasks/build.js b/tasks/build.js index 9f1efd4f..c9709060 100644 --- a/tasks/build.js +++ b/tasks/build.js @@ -30,6 +30,7 @@ const plumber = require('gulp-plumber'); const size = require('gulp-size'); const sourcemaps = require('gulp-sourcemaps'); const browserSync = require('browser-sync').create(); +const gulpIf = require('gulp-if'); // Configs const build = require('../build.json'); // Info from package @@ -128,7 +129,7 @@ Object.entries(build.js).forEach(([filename, entry]) => { }, ), ) - .pipe(header('typeof navigator === "object" && ')) // "Support" SSR (#935) + .pipe(gulpIf(() => extension !== 'mjs', header('typeof navigator === "object" && '))) // "Support" SSR (#935) .pipe( rename({ extname: `.${extension}`, |