add support for data-visibility=hidden

demo.html

@@ -77,6 +77,13 @@
 					</p>
 				</section>
 
+				<section data-visibility="hidden">
+					<h2>Hidden Slides</h2>
+					<p>
+						This slide is visible in the source, but hidden when the presentation is viewed. You can show all hidden slides by setting the `showHiddenSlides` config option to `true`.
+					</p>
+				</section>
+
 				<section data-auto-animate>
 					<h2 data-id="code-title">Pretty Code</h2>
 					<pre data-id="code-animation"><code class="hljs" data-trim data-line-numbers>

js/config.js

@@ -146,6 +146,9 @@ export default {
 	// Flags if speaker notes should be visible to all viewers
 	showNotes: false,
 
+	// Flags if slides with data-visibility="hidden" should be kep visible
+	showHiddenSlides: false,
+
 	// Global override for autolaying embedded media (video/audio/iframe)
 	// - null:   Media will only autoplay if data-autoplay is present
 	// - true:   All media will autoplay, regardless of individual setting

js/reveal.js

@@ -174,6 +174,9 @@ export default function( revealElement, options ) {
 
 		ready = true;
 
+		// Remove slides hidden with data-visibility
+		removeHiddenSlides();
+
 		// Make sure we've got all the DOM elements we need
 		setupDOM();
 
@@ -231,6 +234,24 @@ export default function( revealElement, options ) {
 
 	}
 
+	/**
+	 * Removes all slides with data-visibility="hidden". This
+	 * is done right before the rest of the presentation is
+	 * initialized.
+	 *
+	 * If you want to show all hidden slides, initialize
+	 * reveal.js with showHiddenSlides set to true.
+	 */
+	function removeHiddenSlides() {
+
+		if( !config.showHiddenSlides ) {
+			Util.queryAll( dom.wrapper, 'section[data-visibility="hidden"]' ).forEach( slide => {
+				slide.parentNode.removeChild( slide );
+			} );
+		}
+
+	}
+
 	/**
 	 * Finds and stores references to DOM elements which are
 	 * required by the presentation. If a required element is

test/test.html

@@ -20,6 +20,10 @@
 
 			<div class="slides">
 
+				<section data-visibility="hidden">
+					This should be remove by reveal.js before our tests run.
+				</section>
+
 				<section data-background-image="examples/assets/image1.png">
 					<h1>1</h1>
 					<img data-src="">
@@ -101,6 +105,7 @@
 				QUnit.test( 'Initial slides classes', function( assert ) {
 					var horizontalSlides = document.querySelectorAll( '.reveal .slides>section' )
 
+					assert.strictEqual( document.querySelectorAll( '.reveal .slides section[data-visibility="hidden"]' ).length, 0, 'no data-visibility="hidden" slides' );
 					assert.strictEqual( document.querySelectorAll( '.reveal .slides section.past' ).length, 0, 'no .past slides' );
 					assert.strictEqual( document.querySelectorAll( '.reveal .slides section.present' ).length, 1, 'one .present slide' );
 					assert.strictEqual( document.querySelectorAll( '.reveal .slides>section.future' ).length, horizontalSlides.length - 1, 'remaining horizontal slides are .future' );