auto play/pause html5 media when entering/leaving slide (#388)

1 files changed, 36 insertions, 0 deletions

diff --git a/js/reveal.js b/js/reveal.js
index c2f3722..d321dde 100644
--- a/js/reveal.js
+++ b/js/reveal.js
@@ -1147,6 +1147,10 @@ var Reveal = (function(){
 			}
 		}
 
+		// Handle embedded content
+		stopEmbeddedContent( previousSlide );
+		startEmbeddedContent( currentSlide );
+
 		updateControls();
 		updateProgress();
 
@@ -1420,6 +1424,38 @@ var Reveal = (function(){
 	}
 
 	/**
+	 * Start playback of any embedded content inside of
+	 * the targeted slide.
+	 */
+	function startEmbeddedContent( slide ) {
+
+		if( slide ) {
+			toArray( slide.querySelectorAll( 'video, audio' ) ).forEach( function( el ) {
+				if( !el.hasAttribute( 'data-ignore' ) ) {
+					el.play();
+				}
+			} );
+		}
+
+	}
+
+	/**
+	 * Stop playback of any embedded content inside of
+	 * the targeted slide.
+	 */
+	function stopEmbeddedContent( slide ) {
+
+		if( slide ) {
+			toArray( slide.querySelectorAll( 'video, audio' ) ).forEach( function( el ) {
+				if( !el.hasAttribute( 'data-ignore' ) ) {
+					el.pause();
+				}
+			} );
+		}
+
+	}
+
+	/**
 	 * Reads the current URL (hash) and navigates accordingly.
 	 */
 	function readURL() {