1
0
mirror of https://github.com/hakimel/reveal.js.git synced 2025-08-05 06:07:37 +02:00

autoplay muted background videos in speaker view #1037

This commit is contained in:
Hakim El Hattab
2024-10-21 14:27:51 +02:00
parent 8d7b03c886
commit 95946b4ec6
5 changed files with 36 additions and 25 deletions

2
dist/reveal.esm.js vendored

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

2
dist/reveal.js vendored

File diff suppressed because one or more lines are too long

2
dist/reveal.js.map vendored

File diff suppressed because one or more lines are too long

View File

@@ -119,14 +119,14 @@ export default class SlideContent {
} }
} }
// Videos // Videos
else if ( backgroundVideo && !this.Reveal.isSpeakerNotes() ) { else if ( backgroundVideo ) {
let video = document.createElement( 'video' ); let video = document.createElement( 'video' );
if( backgroundVideoLoop ) { if( backgroundVideoLoop ) {
video.setAttribute( 'loop', '' ); video.setAttribute( 'loop', '' );
} }
if( backgroundVideoMuted ) { if( backgroundVideoMuted || this.Reveal.isSpeakerNotes() ) {
video.muted = true; video.muted = true;
} }
@@ -280,7 +280,9 @@ export default class SlideContent {
*/ */
startEmbeddedContent( element ) { startEmbeddedContent( element ) {
if( element && !this.Reveal.isSpeakerNotes() ) { if( element ) {
const isSpeakerNotesWindow = this.Reveal.isSpeakerNotes();
// Restart GIFs // Restart GIFs
queryAll( element, 'img[src$=".gif"]' ).forEach( el => { queryAll( element, 'img[src$=".gif"]' ).forEach( el => {
@@ -306,6 +308,9 @@ export default class SlideContent {
if( autoplay && typeof el.play === 'function' ) { if( autoplay && typeof el.play === 'function' ) {
// In teh speaker view we only auto-play muted media
if( isSpeakerNotesWindow && !el.muted ) return;
// If the media is ready, start playback // If the media is ready, start playback
if( el.readyState > 1 ) { if( el.readyState > 1 ) {
this.startEmbeddedMedia( { target: el } ); this.startEmbeddedMedia( { target: el } );
@@ -337,27 +342,33 @@ export default class SlideContent {
} }
} ); } );
// Normal iframes // Don't play iframe content in the speaker view since we can't
queryAll( element, 'iframe[src]' ).forEach( el => { // guarantee that it's muted
if( closest( el, '.fragment' ) && !closest( el, '.fragment.visible' ) ) { if( !isSpeakerNotesWindow ) {
return;
}
this.startEmbeddedIframe( { target: el } ); // Normal iframes
} ); queryAll( element, 'iframe[src]' ).forEach( el => {
if( closest( el, '.fragment' ) && !closest( el, '.fragment.visible' ) ) {
return;
}
// Lazy loading iframes this.startEmbeddedIframe( { target: el } );
queryAll( element, 'iframe[data-src]' ).forEach( el => { } );
if( closest( el, '.fragment' ) && !closest( el, '.fragment.visible' ) ) {
return;
}
if( el.getAttribute( 'src' ) !== el.getAttribute( 'data-src' ) ) { // Lazy loading iframes
el.removeEventListener( 'load', this.startEmbeddedIframe ); // remove first to avoid dupes queryAll( element, 'iframe[data-src]' ).forEach( el => {
el.addEventListener( 'load', this.startEmbeddedIframe ); if( closest( el, '.fragment' ) && !closest( el, '.fragment.visible' ) ) {
el.setAttribute( 'src', el.getAttribute( 'data-src' ) ); return;
} }
} );
if( el.getAttribute( 'src' ) !== el.getAttribute( 'data-src' ) ) {
el.removeEventListener( 'load', this.startEmbeddedIframe ); // remove first to avoid dupes
el.addEventListener( 'load', this.startEmbeddedIframe );
el.setAttribute( 'src', el.getAttribute( 'data-src' ) );
}
} );
}
} }