allow same background video to continue playing across multiple slides …

…#3189 #2882 Co-authored-by: Chi Vong <chivongv@gmail.com>
hakimel · Mar 8, 2024 · a29a9c7 · a29a9c7
1 parent 6ef138b
commit a29a9c7
Show file tree

Hide file tree

Showing 5 changed files with 24 additions and 5 deletions.
diff --git a/dist/reveal.esm.js b/dist/reveal.esm.js
diff --git a/dist/reveal.esm.js.map b/dist/reveal.esm.js.map
diff --git a/dist/reveal.js b/dist/reveal.js
diff --git a/dist/reveal.js.map b/dist/reveal.js.map
diff --git a/js/controllers/backgrounds.js b/js/controllers/backgrounds.js
@@ -353,6 +353,25 @@ export default class Backgrounds {
 			let currentBackgroundHash = currentBackground.getAttribute( 'data-background-hash' );
 			if( currentBackgroundHash && currentBackgroundHash === previousBackgroundHash && currentBackground !== this.previousBackground ) {
 				this.element.classList.add( 'no-transition' );
+
+				// If multiple slides have the same background video, we carry
+				// the <video> element forward so that it doesn't restart
+				const currentVideo = currentBackground.querySelector( 'video' );
+				if( currentVideo && this.previousBackground ) {
+					const previousVideo = this.previousBackground.querySelector( 'video' );
+
+					if( previousVideo ) {
+						const currentVideoParent = currentVideo.parentNode;
+						const previousVideoParent = previousVideo.parentNode;
+
+						// Swap the two videos
+						previousVideoParent.appendChild( currentVideo );
+						currentVideoParent.appendChild( previousVideo );
+
+						// Resume playing if the previous video was playing
+						previousVideo.play();
+					}
+				}
 			}
 
 			this.previousBackground = currentBackground;
@@ -368,7 +387,7 @@ export default class Backgrounds {
 		// Allow the first background to apply without transition
 		setTimeout( () => {
 			this.element.classList.remove( 'no-transition' );
-		}, 1 );
+		}, 10 );
 
 	}