aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--js/reveal.js22
-rw-r--r--test/test-grid-navigation.html74
2 files changed, 92 insertions, 4 deletions
diff --git a/js/reveal.js b/js/reveal.js
index 4cf43f7..16ff6df 100644
--- a/js/reveal.js
+++ b/js/reveal.js
@@ -104,6 +104,20 @@
// Change the presentation direction to be RTL
rtl: false,
+ // When this is enabled, stepping left/right from a vertical stack
+ // to an adjacent vertical stack will land you at the same vertical
+ // index.
+ //
+ // Consider a deck with six slides ordered in two stacks like this:
+ // 1.1 2.1
+ // 1.2 2.2
+ // 1.3 2.3
+ //
+ // If you're on slide 1.3 and navigate right, you will normally move
+ // from 1.3 -> 2.1. With "grid" enabled the same navigation takes you
+ // from 1.3 -> 2.3.
+ gridNavigation: false,
+
// Randomizes the order of slides each time the presentation loads
shuffle: false,
@@ -4678,12 +4692,12 @@
// Reverse for RTL
if( config.rtl ) {
if( ( isOverview() || nextFragment() === false ) && availableRoutes().left ) {
- slide( indexh + 1 );
+ slide( indexh + 1, config.gridNavigation ? indexv : undefined );
}
}
// Normal navigation
else if( ( isOverview() || previousFragment() === false ) && availableRoutes().left ) {
- slide( indexh - 1 );
+ slide( indexh - 1, config.gridNavigation ? indexv : undefined );
}
}
@@ -4695,12 +4709,12 @@
// Reverse for RTL
if( config.rtl ) {
if( ( isOverview() || previousFragment() === false ) && availableRoutes().right ) {
- slide( indexh - 1 );
+ slide( indexh - 1, config.gridNavigation ? indexv : undefined );
}
}
// Normal navigation
else if( ( isOverview() || nextFragment() === false ) && availableRoutes().right ) {
- slide( indexh + 1 );
+ slide( indexh + 1, config.gridNavigation ? indexv : undefined );
}
}
diff --git a/test/test-grid-navigation.html b/test/test-grid-navigation.html
new file mode 100644
index 0000000..2814ca3
--- /dev/null
+++ b/test/test-grid-navigation.html
@@ -0,0 +1,74 @@
+<!doctype html>
+<html lang="en">
+
+ <head>
+ <meta charset="utf-8">
+
+ <title>reveal.js - Test Grid</title>
+
+ <link rel="stylesheet" href="../css/reveal.css">
+ <link rel="stylesheet" href="qunit-2.5.0.css">
+ </head>
+
+ <body style="overflow: auto;">
+
+ <div id="qunit"></div>
+ <div id="qunit-fixture"></div>
+
+ <div class="reveal" style="display: none;">
+
+ <div class="slides">
+
+ <section>0</section>
+ <section>
+ <section>1.1</section>
+ <section>1.2</section>
+ <section>1.3</section>
+ <section>1.4</section>
+ </section>
+ <section>
+ <section>2.1</section>
+ <section>2.2</section>
+ <section>2.3</section>
+ <section>2.4</section>
+ </section>
+
+ </div>
+
+ </div>
+
+ <script src="../js/reveal.js"></script>
+ <script src="qunit-2.5.0.js"></script>
+
+ <script>
+ Reveal.addEventListener( 'ready', function() {
+
+ QUnit.module( 'Grid Navigation' );
+
+ QUnit.test( 'Disabled', function( assert ) {
+ Reveal.right();
+ Reveal.down();
+ Reveal.down();
+ assert.deepEqual( Reveal.getIndices(), { h: 1, v: 2, f: undefined }, 'Correct starting point' );
+ Reveal.right();
+ assert.deepEqual( Reveal.getIndices(), { h: 2, v: 0, f: undefined }, 'Moves to top when going to adjacent stack' );
+ });
+
+ QUnit.test( 'Enabled', function( assert ) {
+ Reveal.configure({ gridNavigation: true });
+ Reveal.slide( 0, 0 );
+ Reveal.right();
+ Reveal.down();
+ Reveal.down();
+ assert.deepEqual( Reveal.getIndices(), { h: 1, v: 2, f: undefined }, 'Correct starting point' );
+ Reveal.right();
+ assert.deepEqual( Reveal.getIndices(), { h: 2, v: 2, f: undefined }, 'Remains at same vertical index when going to adjacent stack' );
+ });
+
+ } );
+
+ Reveal.initialize();
+ </script>
+
+ </body>
+</html>