|
@@ -59,6 +59,10 @@ var Reveal = (function(){
|
|
|
|
|
|
fragments: true,
|
|
fragments: true,
|
|
|
|
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+ embedded: false,
|
|
|
|
+
|
|
|
|
|
|
|
|
|
|
|
|
|
|
@@ -68,7 +72,7 @@ var Reveal = (function(){
|
|
mouseWheel: false,
|
|
mouseWheel: false,
|
|
|
|
|
|
|
|
|
|
- rollingLinks: true,
|
|
+ rollingLinks: false,
|
|
|
|
|
|
|
|
|
|
previewLinks: false,
|
|
previewLinks: false,
|
|
@@ -83,18 +87,24 @@ var Reveal = (function(){
|
|
transitionSpeed: 'default',
|
|
transitionSpeed: 'default',
|
|
|
|
|
|
|
|
|
|
- backgroundTransition: 'default',
|
|
+ backgroundTransition: 'default',
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+ viewDistance: 3,
|
|
|
|
|
|
|
|
|
|
dependencies: []
|
|
dependencies: []
|
|
},
|
|
},
|
|
|
|
|
|
|
|
+
|
|
|
|
+ loaded = false,
|
|
|
|
+
|
|
|
|
|
|
autoSlide = 0,
|
|
autoSlide = 0,
|
|
|
|
|
|
|
|
|
|
- indexh = 0,
|
|
+ indexh,
|
|
- indexv = 0,
|
|
+ indexv,
|
|
|
|
|
|
|
|
|
|
previousSlide,
|
|
previousSlide,
|
|
@@ -111,19 +121,14 @@ var Reveal = (function(){
|
|
|
|
|
|
dom = {},
|
|
dom = {},
|
|
|
|
|
|
-
|
|
+
|
|
- supports3DTransforms = 'WebkitPerspective' in document.body.style ||
|
|
+ supports3DTransforms,
|
|
- 'MozPerspective' in document.body.style ||
|
|
|
|
- 'msPerspective' in document.body.style ||
|
|
|
|
- 'OPerspective' in document.body.style ||
|
|
|
|
- 'perspective' in document.body.style,
|
|
|
|
|
|
|
|
-
|
|
+
|
|
- supports2DTransforms = 'WebkitTransform' in document.body.style ||
|
|
+ supports2DTransforms,
|
|
- 'MozTransform' in document.body.style ||
|
|
+
|
|
- 'msTransform' in document.body.style ||
|
|
+
|
|
- 'OTransform' in document.body.style ||
|
|
+ isMobileDevice,
|
|
- 'transform' in document.body.style,
|
|
|
|
|
|
|
|
|
|
|
|
lastMouseWheelStep = 0,
|
|
lastMouseWheelStep = 0,
|
|
@@ -149,8 +154,8 @@ var Reveal = (function(){
|
|
startY: 0,
|
|
startY: 0,
|
|
startSpan: 0,
|
|
startSpan: 0,
|
|
startCount: 0,
|
|
startCount: 0,
|
|
- handled: false,
|
|
+ captured: false,
|
|
- threshold: 80
|
|
+ threshold: 40
|
|
};
|
|
};
|
|
|
|
|
|
|
|
|
|
@@ -158,6 +163,8 @@ var Reveal = (function(){
|
|
*/
|
|
*/
|
|
function initialize( options ) {
|
|
function initialize( options ) {
|
|
|
|
|
|
|
|
+ checkCapabilities();
|
|
|
|
+
|
|
if( !supports2DTransforms && !supports3DTransforms ) {
|
|
if( !supports2DTransforms && !supports3DTransforms ) {
|
|
document.body.setAttribute( 'class', 'no-transforms' );
|
|
document.body.setAttribute( 'class', 'no-transforms' );
|
|
|
|
|
|
@@ -180,6 +187,136 @@ var Reveal = (function(){
|
|
|
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
+
|
|
|
|
+ * Inspect the client to see what it's capable of, this
|
|
|
|
+ * should only happens once per runtime.
|
|
|
|
+ */
|
|
|
|
+ function checkCapabilities() {
|
|
|
|
+
|
|
|
|
+ supports3DTransforms = 'WebkitPerspective' in document.body.style ||
|
|
|
|
+ 'MozPerspective' in document.body.style ||
|
|
|
|
+ 'msPerspective' in document.body.style ||
|
|
|
|
+ 'OPerspective' in document.body.style ||
|
|
|
|
+ 'perspective' in document.body.style;
|
|
|
|
+
|
|
|
|
+ supports2DTransforms = 'WebkitTransform' in document.body.style ||
|
|
|
|
+ 'MozTransform' in document.body.style ||
|
|
|
|
+ 'msTransform' in document.body.style ||
|
|
|
|
+ 'OTransform' in document.body.style ||
|
|
|
|
+ 'transform' in document.body.style;
|
|
|
|
+
|
|
|
|
+ isMobileDevice = navigator.userAgent.match( /(iphone|ipod|android)/gi );
|
|
|
|
+
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+ * Loads the dependencies of reveal.js. Dependencies are
|
|
|
|
+ * defined via the configuration option 'dependencies'
|
|
|
|
+ * and will be loaded prior to starting/binding reveal.js.
|
|
|
|
+ * Some dependencies may have an 'async' flag, if so they
|
|
|
|
+ * will load after reveal.js has been started up.
|
|
|
|
+ */
|
|
|
|
+ function load() {
|
|
|
|
+
|
|
|
|
+ var scripts = [],
|
|
|
|
+ scriptsAsync = [];
|
|
|
|
+
|
|
|
|
+ for( var i = 0, len = config.dependencies.length; i < len; i++ ) {
|
|
|
|
+ var s = config.dependencies[i];
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+ if( !s.condition || s.condition() ) {
|
|
|
|
+ if( s.async ) {
|
|
|
|
+ scriptsAsync.push( s.src );
|
|
|
|
+ }
|
|
|
|
+ else {
|
|
|
|
+ scripts.push( s.src );
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+ if( typeof s.callback === 'function' ) {
|
|
|
|
+ head.ready( s.src.match( /([\w\d_\-]*)\.?js$|[^\\\/]*$/i )[0], s.callback );
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+ function proceed() {
|
|
|
|
+ if( scriptsAsync.length ) {
|
|
|
|
+
|
|
|
|
+ head.js.apply( null, scriptsAsync );
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ start();
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ if( scripts.length ) {
|
|
|
|
+ head.ready( proceed );
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+ head.js.apply( null, scripts );
|
|
|
|
+ }
|
|
|
|
+ else {
|
|
|
|
+ proceed();
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+ * Starts up reveal.js by binding input events and navigating
|
|
|
|
+ * to the current URL deeplink if there is one.
|
|
|
|
+ */
|
|
|
|
+ function start() {
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+ setupDOM();
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+ setupSlides();
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+ configure();
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+ readURL();
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+ setTimeout( function() {
|
|
|
|
+
|
|
|
|
+ dom.slides.classList.remove( 'no-transition' );
|
|
|
|
+
|
|
|
|
+ loaded = true;
|
|
|
|
+
|
|
|
|
+ dispatchEvent( 'ready', {
|
|
|
|
+ 'indexh': indexh,
|
|
|
|
+ 'indexv': indexv,
|
|
|
|
+ 'currentSlide': currentSlide
|
|
|
|
+ } );
|
|
|
|
+ }, 1 );
|
|
|
|
+
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+ * Iterates through and decorates slides DOM elements with
|
|
|
|
+ * appropriate classes.
|
|
|
|
+ */
|
|
|
|
+ function setupSlides() {
|
|
|
|
+
|
|
|
|
+ var horizontalSlides = toArray( document.querySelectorAll( HORIZONTAL_SLIDES_SELECTOR ) );
|
|
|
|
+ horizontalSlides.forEach( function( horizontalSlide ) {
|
|
|
|
+
|
|
|
|
+ var verticalSlides = toArray( horizontalSlide.querySelectorAll( 'section' ) );
|
|
|
|
+ verticalSlides.forEach( function( verticalSlide, y ) {
|
|
|
|
+
|
|
|
|
+ if( y > 0 ) verticalSlide.classList.add( 'future' );
|
|
|
|
+
|
|
|
|
+ } );
|
|
|
|
+
|
|
|
|
+ } );
|
|
|
|
+
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
|
|
* Finds and stores references to DOM elements which are
|
|
* Finds and stores references to DOM elements which are
|
|
* required by the presentation. If a required element is
|
|
* required by the presentation. If a required element is
|
|
@@ -192,50 +329,30 @@ var Reveal = (function(){
|
|
dom.wrapper = document.querySelector( '.reveal' );
|
|
dom.wrapper = document.querySelector( '.reveal' );
|
|
dom.slides = document.querySelector( '.reveal .slides' );
|
|
dom.slides = document.querySelector( '.reveal .slides' );
|
|
|
|
|
|
|
|
+
|
|
|
|
+ dom.slides.classList.add( 'no-transition' );
|
|
|
|
+
|
|
|
|
|
|
- if( !document.querySelector( '.reveal .backgrounds' ) ) {
|
|
+ dom.background = createSingletonNode( dom.wrapper, 'div', 'backgrounds', null );
|
|
- dom.background = document.createElement( 'div' );
|
|
|
|
- dom.background.classList.add( 'backgrounds' );
|
|
|
|
- dom.wrapper.appendChild( dom.background );
|
|
|
|
- }
|
|
|
|
|
|
|
|
|
|
|
|
- if( !dom.wrapper.querySelector( '.progress' ) ) {
|
|
+ dom.progress = createSingletonNode( dom.wrapper, 'div', 'progress', '<span></span>' );
|
|
- var progressElement = document.createElement( 'div' );
|
|
+ dom.progressbar = dom.progress.querySelector( 'span' );
|
|
- progressElement.classList.add( 'progress' );
|
|
|
|
- progressElement.innerHTML = '<span></span>';
|
|
|
|
- dom.wrapper.appendChild( progressElement );
|
|
|
|
- }
|
|
|
|
|
|
|
|
|
|
|
|
- if( !dom.wrapper.querySelector( '.controls' ) ) {
|
|
+ createSingletonNode( dom.wrapper, 'aside', 'controls',
|
|
- var controlsElement = document.createElement( 'aside' );
|
|
+ '<div class="navigate-left"></div>' +
|
|
- controlsElement.classList.add( 'controls' );
|
|
+ '<div class="navigate-right"></div>' +
|
|
- controlsElement.innerHTML = '<div class="navigate-left"></div>' +
|
|
+ '<div class="navigate-up"></div>' +
|
|
- '<div class="navigate-right"></div>' +
|
|
+ '<div class="navigate-down"></div>' );
|
|
- '<div class="navigate-up"></div>' +
|
|
|
|
- '<div class="navigate-down"></div>';
|
|
|
|
- dom.wrapper.appendChild( controlsElement );
|
|
|
|
- }
|
|
|
|
|
|
|
|
|
|
|
|
- if( !dom.wrapper.querySelector( '.state-background' ) ) {
|
|
+ createSingletonNode( dom.wrapper, 'div', 'state-background', null );
|
|
- var stateBackgroundElement = document.createElement( 'div' );
|
|
|
|
- stateBackgroundElement.classList.add( 'state-background' );
|
|
|
|
- dom.wrapper.appendChild( stateBackgroundElement );
|
|
|
|
- }
|
|
|
|
|
|
|
|
|
|
|
|
- if( !dom.wrapper.querySelector( '.pause-overlay' ) ) {
|
|
+ createSingletonNode( dom.wrapper, 'div', 'pause-overlay', null );
|
|
- var pausedElement = document.createElement( 'div' );
|
|
|
|
- pausedElement.classList.add( 'pause-overlay' );
|
|
|
|
- dom.wrapper.appendChild( pausedElement );
|
|
|
|
- }
|
|
|
|
|
|
|
|
|
|
|
|
- dom.progress = document.querySelector( '.reveal .progress' );
|
|
|
|
- dom.progressbar = document.querySelector( '.reveal .progress span' );
|
|
|
|
-
|
|
|
|
if ( config.controls ) {
|
|
if ( config.controls ) {
|
|
dom.controls = document.querySelector( '.reveal .controls' );
|
|
dom.controls = document.querySelector( '.reveal .controls' );
|
|
|
|
|
|
@@ -250,6 +367,26 @@ var Reveal = (function(){
|
|
|
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
+
|
|
|
|
+ * Creates an HTML element and returns a reference to it.
|
|
|
|
+ * If the element already exists the existing instance will
|
|
|
|
+ * be returned.
|
|
|
|
+ */
|
|
|
|
+ function createSingletonNode( container, tagname, classname, innerHTML ) {
|
|
|
|
+
|
|
|
|
+ var node = container.querySelector( '.' + classname );
|
|
|
|
+ if( !node ) {
|
|
|
|
+ node = document.createElement( tagname );
|
|
|
|
+ node.classList.add( classname );
|
|
|
|
+ if( innerHTML !== null ) {
|
|
|
|
+ node.innerHTML = innerHTML;
|
|
|
|
+ }
|
|
|
|
+ container.appendChild( node );
|
|
|
|
+ }
|
|
|
|
+ return node;
|
|
|
|
+
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
|
|
* Creates the slide background elements and appends them
|
|
* Creates the slide background elements and appends them
|
|
* to the background container. One element is created per
|
|
* to the background container. One element is created per
|
|
@@ -334,99 +471,6 @@ var Reveal = (function(){
|
|
|
|
|
|
}
|
|
}
|
|
|
|
|
|
-
|
|
|
|
- * Hides the address bar if we're on a mobile device.
|
|
|
|
- */
|
|
|
|
- function hideAddressBar() {
|
|
|
|
-
|
|
|
|
- if( /iphone|ipod|android/gi.test( navigator.userAgent ) && !/crios/gi.test( navigator.userAgent ) ) {
|
|
|
|
-
|
|
|
|
- window.addEventListener( 'load', removeAddressBar, false );
|
|
|
|
- window.addEventListener( 'orientationchange', removeAddressBar, false );
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
-
|
|
|
|
- * Loads the dependencies of reveal.js. Dependencies are
|
|
|
|
- * defined via the configuration option 'dependencies'
|
|
|
|
- * and will be loaded prior to starting/binding reveal.js.
|
|
|
|
- * Some dependencies may have an 'async' flag, if so they
|
|
|
|
- * will load after reveal.js has been started up.
|
|
|
|
- */
|
|
|
|
- function load() {
|
|
|
|
-
|
|
|
|
- var scripts = [],
|
|
|
|
- scriptsAsync = [];
|
|
|
|
-
|
|
|
|
- for( var i = 0, len = config.dependencies.length; i < len; i++ ) {
|
|
|
|
- var s = config.dependencies[i];
|
|
|
|
-
|
|
|
|
-
|
|
|
|
- if( !s.condition || s.condition() ) {
|
|
|
|
- if( s.async ) {
|
|
|
|
- scriptsAsync.push( s.src );
|
|
|
|
- }
|
|
|
|
- else {
|
|
|
|
- scripts.push( s.src );
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
-
|
|
|
|
- if( typeof s.callback === 'function' ) {
|
|
|
|
- head.ready( s.src.match( /([\w\d_\-]*)\.?js$|[^\\\/]*$/i )[0], s.callback );
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
-
|
|
|
|
- function proceed() {
|
|
|
|
- if( scriptsAsync.length ) {
|
|
|
|
-
|
|
|
|
- head.js.apply( null, scriptsAsync );
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- start();
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- if( scripts.length ) {
|
|
|
|
- head.ready( proceed );
|
|
|
|
-
|
|
|
|
-
|
|
|
|
- head.js.apply( null, scripts );
|
|
|
|
- }
|
|
|
|
- else {
|
|
|
|
- proceed();
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
-
|
|
|
|
- * Starts up reveal.js by binding input events and navigating
|
|
|
|
- * to the current URL deeplink if there is one.
|
|
|
|
- */
|
|
|
|
- function start() {
|
|
|
|
-
|
|
|
|
-
|
|
|
|
- setupDOM();
|
|
|
|
-
|
|
|
|
-
|
|
|
|
- configure();
|
|
|
|
-
|
|
|
|
-
|
|
|
|
- readURL();
|
|
|
|
-
|
|
|
|
-
|
|
|
|
-
|
|
|
|
- setTimeout( function() {
|
|
|
|
- dispatchEvent( 'ready', {
|
|
|
|
- 'indexh': indexh,
|
|
|
|
- 'indexv': indexv,
|
|
|
|
- 'currentSlide': currentSlide
|
|
|
|
- } );
|
|
|
|
- }, 1 );
|
|
|
|
-
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
|
|
|
|
* Applies the configuration settings from the config
|
|
* Applies the configuration settings from the config
|
|
* object. May be called multiple times.
|
|
* object. May be called multiple times.
|
|
@@ -630,6 +674,19 @@ var Reveal = (function(){
|
|
|
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
+
|
|
|
|
+ * Applies a CSS transform to the target element.
|
|
|
|
+ */
|
|
|
|
+ function transformElement( element, transform ) {
|
|
|
|
+
|
|
|
|
+ element.style.WebkitTransform = transform;
|
|
|
|
+ element.style.MozTransform = transform;
|
|
|
|
+ element.style.msTransform = transform;
|
|
|
|
+ element.style.OTransform = transform;
|
|
|
|
+ element.style.transform = transform;
|
|
|
|
+
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
|
|
* Retrieves the height of the given element by looking
|
|
* Retrieves the height of the given element by looking
|
|
* at the position and height of its immediate children.
|
|
* at the position and height of its immediate children.
|
|
@@ -665,6 +722,48 @@ var Reveal = (function(){
|
|
|
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
+
|
|
|
|
+ * Returns the remaining height within the parent of the
|
|
|
|
+ * target element after subtracting the height of all
|
|
|
|
+ * siblings.
|
|
|
|
+ *
|
|
|
|
+ * remaining height = [parent height] - [ siblings height]
|
|
|
|
+ */
|
|
|
|
+ function getRemainingHeight( element, height ) {
|
|
|
|
+
|
|
|
|
+ height = height || 0;
|
|
|
|
+
|
|
|
|
+ if( element ) {
|
|
|
|
+ var parent = element.parentNode;
|
|
|
|
+ var siblings = parent.childNodes;
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+ toArray( siblings ).forEach( function( sibling ) {
|
|
|
|
+
|
|
|
|
+ if( typeof sibling.offsetHeight === 'number' && sibling !== element ) {
|
|
|
|
+
|
|
|
|
+ var styles = window.getComputedStyle( sibling ),
|
|
|
|
+ marginTop = parseInt( styles.marginTop, 10 ),
|
|
|
|
+ marginBottom = parseInt( styles.marginBottom, 10 );
|
|
|
|
+
|
|
|
|
+ height -= sibling.offsetHeight + marginTop + marginBottom;
|
|
|
|
+
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ } );
|
|
|
|
+
|
|
|
|
+ var elementStyles = window.getComputedStyle( element );
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+ height -= parseInt( elementStyles.marginTop, 10 ) +
|
|
|
|
+ parseInt( elementStyles.marginBottom, 10 );
|
|
|
|
+
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ return height;
|
|
|
|
+
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
|
|
* Checks if this instance is being used to print a PDF.
|
|
* Checks if this instance is being used to print a PDF.
|
|
*/
|
|
*/
|
|
@@ -674,6 +773,19 @@ var Reveal = (function(){
|
|
|
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
+
|
|
|
|
+ * Hides the address bar if we're on a mobile device.
|
|
|
|
+ */
|
|
|
|
+ function hideAddressBar() {
|
|
|
|
+
|
|
|
|
+ if( /iphone|ipod|android/gi.test( navigator.userAgent ) && !/crios/gi.test( navigator.userAgent ) ) {
|
|
|
|
+
|
|
|
|
+ window.addEventListener( 'load', removeAddressBar, false );
|
|
|
|
+ window.addEventListener( 'orientationchange', removeAddressBar, false );
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
|
|
* Causes the address bar to hide on mobile devices,
|
|
* Causes the address bar to hide on mobile devices,
|
|
* more vertical space ftw.
|
|
* more vertical space ftw.
|
|
@@ -886,7 +998,11 @@ var Reveal = (function(){
|
|
|
|
|
|
|
|
|
|
var slideWidth = config.width,
|
|
var slideWidth = config.width,
|
|
- slideHeight = config.height;
|
|
+ slideHeight = config.height,
|
|
|
|
+ slidePadding = 20;
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+ layoutSlideContents( config.width, config.height, slidePadding );
|
|
|
|
|
|
|
|
|
|
if( typeof slideWidth === 'string' && /%$/.test( slideWidth ) ) {
|
|
if( typeof slideWidth === 'string' && /%$/.test( slideWidth ) ) {
|
|
@@ -915,13 +1031,7 @@ var Reveal = (function(){
|
|
}
|
|
}
|
|
|
|
|
|
else {
|
|
else {
|
|
- var transform = 'translate(-50%, -50%) scale('+ scale +') translate(50%, 50%)';
|
|
+ transformElement( dom.slides, 'translate(-50%, -50%) scale('+ scale +') translate(50%, 50%)' );
|
|
-
|
|
|
|
- dom.slides.style.WebkitTransform = transform;
|
|
|
|
- dom.slides.style.MozTransform = transform;
|
|
|
|
- dom.slides.style.msTransform = transform;
|
|
|
|
- dom.slides.style.OTransform = transform;
|
|
|
|
- dom.slides.style.transform = transform;
|
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
|
|
@@ -942,7 +1052,7 @@ var Reveal = (function(){
|
|
slide.style.top = 0;
|
|
slide.style.top = 0;
|
|
}
|
|
}
|
|
else {
|
|
else {
|
|
- slide.style.top = Math.max( - ( getAbsoluteHeight( slide ) / 2 ) - 20, -slideHeight / 2 ) + 'px';
|
|
+ slide.style.top = Math.max( - ( getAbsoluteHeight( slide ) / 2 ) - slidePadding, -slideHeight / 2 ) + 'px';
|
|
}
|
|
}
|
|
}
|
|
}
|
|
else {
|
|
else {
|
|
@@ -957,6 +1067,38 @@ var Reveal = (function(){
|
|
|
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
+
|
|
|
|
+ * Applies layout logic to the contents of all slides in
|
|
|
|
+ * the presentation.
|
|
|
|
+ */
|
|
|
|
+ function layoutSlideContents( width, height, padding ) {
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+ toArray( dom.slides.querySelectorAll( 'section > .stretch' ) ).forEach( function( element ) {
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+ var remainingHeight = getRemainingHeight( element, ( height - ( padding * 2 ) ) );
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+ if( /(img|video)/gi.test( element.nodeName ) ) {
|
|
|
|
+ var nw = element.naturalWidth || element.videoWidth,
|
|
|
|
+ nh = element.naturalHeight || element.videoHeight;
|
|
|
|
+
|
|
|
|
+ var es = Math.min( width / nw, remainingHeight / nh );
|
|
|
|
+
|
|
|
|
+ element.style.width = ( nw * es ) + 'px';
|
|
|
|
+ element.style.height = ( nh * es ) + 'px';
|
|
|
|
+
|
|
|
|
+ }
|
|
|
|
+ else {
|
|
|
|
+ element.style.width = width + 'px';
|
|
|
|
+ element.style.height = remainingHeight + 'px';
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ } );
|
|
|
|
+
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
|
|
* Stores the vertical index of a stack so that the same
|
|
* Stores the vertical index of a stack so that the same
|
|
* vertical slide can be selected when navigating to and
|
|
* vertical slide can be selected when navigating to and
|
|
@@ -1010,6 +1152,9 @@ var Reveal = (function(){
|
|
|
|
|
|
var wasActive = dom.wrapper.classList.contains( 'overview' );
|
|
var wasActive = dom.wrapper.classList.contains( 'overview' );
|
|
|
|
|
|
|
|
+
|
|
|
|
+ var depth = window.innerWidth < 400 ? 1000 : 2500;
|
|
|
|
+
|
|
dom.wrapper.classList.add( 'overview' );
|
|
dom.wrapper.classList.add( 'overview' );
|
|
dom.wrapper.classList.remove( 'exit-overview' );
|
|
dom.wrapper.classList.remove( 'exit-overview' );
|
|
|
|
|
|
@@ -1025,16 +1170,12 @@ var Reveal = (function(){
|
|
|
|
|
|
for( var i = 0, len1 = horizontalSlides.length; i < len1; i++ ) {
|
|
for( var i = 0, len1 = horizontalSlides.length; i < len1; i++ ) {
|
|
var hslide = horizontalSlides[i],
|
|
var hslide = horizontalSlides[i],
|
|
- hoffset = config.rtl ? -105 : 105,
|
|
+ hoffset = config.rtl ? -105 : 105;
|
|
- htransform = 'translateZ(-2500px) translate(' + ( ( i - indexh ) * hoffset ) + '%, 0%)';
|
|
|
|
|
|
|
|
hslide.setAttribute( 'data-index-h', i );
|
|
hslide.setAttribute( 'data-index-h', i );
|
|
- hslide.style.display = 'block';
|
|
+
|
|
- hslide.style.WebkitTransform = htransform;
|
|
+
|
|
- hslide.style.MozTransform = htransform;
|
|
+ transformElement( hslide, 'translateZ(-'+ depth +'px) translate(' + ( ( i - indexh ) * hoffset ) + '%, 0%)' );
|
|
- hslide.style.msTransform = htransform;
|
|
|
|
- hslide.style.OTransform = htransform;
|
|
|
|
- hslide.style.transform = htransform;
|
|
|
|
|
|
|
|
if( hslide.classList.contains( 'stack' ) ) {
|
|
if( hslide.classList.contains( 'stack' ) ) {
|
|
|
|
|
|
@@ -1043,17 +1184,13 @@ var Reveal = (function(){
|
|
for( var j = 0, len2 = verticalSlides.length; j < len2; j++ ) {
|
|
for( var j = 0, len2 = verticalSlides.length; j < len2; j++ ) {
|
|
var verticalIndex = i === indexh ? indexv : getPreviousVerticalIndex( hslide );
|
|
var verticalIndex = i === indexh ? indexv : getPreviousVerticalIndex( hslide );
|
|
|
|
|
|
- var vslide = verticalSlides[j],
|
|
+ var vslide = verticalSlides[j];
|
|
- vtransform = 'translate(0%, ' + ( ( j - verticalIndex ) * 105 ) + '%)';
|
|
|
|
|
|
|
|
vslide.setAttribute( 'data-index-h', i );
|
|
vslide.setAttribute( 'data-index-h', i );
|
|
vslide.setAttribute( 'data-index-v', j );
|
|
vslide.setAttribute( 'data-index-v', j );
|
|
- vslide.style.display = 'block';
|
|
+
|
|
- vslide.style.WebkitTransform = vtransform;
|
|
+
|
|
- vslide.style.MozTransform = vtransform;
|
|
+ transformElement( vslide, 'translate(0%, ' + ( ( j - verticalIndex ) * 105 ) + '%)' );
|
|
- vslide.style.msTransform = vtransform;
|
|
|
|
- vslide.style.OTransform = vtransform;
|
|
|
|
- vslide.style.transform = vtransform;
|
|
|
|
|
|
|
|
|
|
|
|
vslide.addEventListener( 'click', onOverviewSlideClicked, true );
|
|
vslide.addEventListener( 'click', onOverviewSlideClicked, true );
|
|
@@ -1068,6 +1205,8 @@ var Reveal = (function(){
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
|
|
|
|
+ updateSlidesVisibility();
|
|
|
|
+
|
|
layout();
|
|
layout();
|
|
|
|
|
|
if( !wasActive ) {
|
|
if( !wasActive ) {
|
|
@@ -1117,11 +1256,7 @@ var Reveal = (function(){
|
|
element.style.display = '';
|
|
element.style.display = '';
|
|
|
|
|
|
|
|
|
|
- element.style.WebkitTransform = '';
|
|
+ transformElement( element, '' );
|
|
- element.style.MozTransform = '';
|
|
|
|
- element.style.msTransform = '';
|
|
|
|
- element.style.OTransform = '';
|
|
|
|
- element.style.transform = '';
|
|
|
|
|
|
|
|
element.removeEventListener( 'click', onOverviewSlideClicked, true );
|
|
element.removeEventListener( 'click', onOverviewSlideClicked, true );
|
|
}
|
|
}
|
|
@@ -1302,13 +1437,16 @@ var Reveal = (function(){
|
|
|
|
|
|
state.length = 0;
|
|
state.length = 0;
|
|
|
|
|
|
- var indexhBefore = indexh,
|
|
+ var indexhBefore = indexh || 0,
|
|
- indexvBefore = indexv;
|
|
+ indexvBefore = indexv || 0;
|
|
|
|
|
|
|
|
|
|
indexh = updateSlides( HORIZONTAL_SLIDES_SELECTOR, h === undefined ? indexh : h );
|
|
indexh = updateSlides( HORIZONTAL_SLIDES_SELECTOR, h === undefined ? indexh : h );
|
|
indexv = updateSlides( VERTICAL_SLIDES_SELECTOR, v === undefined ? indexv : v );
|
|
indexv = updateSlides( VERTICAL_SLIDES_SELECTOR, v === undefined ? indexv : v );
|
|
|
|
|
|
|
|
+
|
|
|
|
+ updateSlidesVisibility();
|
|
|
|
+
|
|
layout();
|
|
layout();
|
|
|
|
|
|
|
|
|
|
@@ -1338,10 +1476,6 @@ var Reveal = (function(){
|
|
activateOverview();
|
|
activateOverview();
|
|
}
|
|
}
|
|
|
|
|
|
-
|
|
|
|
-
|
|
|
|
- writeURL( 1500 );
|
|
|
|
-
|
|
|
|
|
|
|
|
|
|
|
|
var currentHorizontalSlide = horizontalSlides[ indexh ],
|
|
var currentHorizontalSlide = horizontalSlides[ indexh ],
|
|
@@ -1413,6 +1547,9 @@ var Reveal = (function(){
|
|
updateProgress();
|
|
updateProgress();
|
|
updateBackground();
|
|
updateBackground();
|
|
|
|
|
|
|
|
+
|
|
|
|
+ writeURL();
|
|
|
|
+
|
|
}
|
|
}
|
|
|
|
|
|
|
|
|
|
@@ -1481,16 +1618,6 @@ var Reveal = (function(){
|
|
for( var i = 0; i < slidesLength; i++ ) {
|
|
for( var i = 0; i < slidesLength; i++ ) {
|
|
var element = slides[i];
|
|
var element = slides[i];
|
|
|
|
|
|
-
|
|
|
|
-
|
|
|
|
- if( isOverview() === false ) {
|
|
|
|
-
|
|
|
|
-
|
|
|
|
- var distance = Math.abs( ( index - i ) % ( slidesLength - 3 ) ) || 0;
|
|
|
|
-
|
|
|
|
- element.style.display = distance > 3 ? 'none' : 'block';
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
var reverse = config.rtl && !isVerticalSlide( element );
|
|
var reverse = config.rtl && !isVerticalSlide( element );
|
|
|
|
|
|
element.classList.remove( 'past' );
|
|
element.classList.remove( 'past' );
|
|
@@ -1507,6 +1634,13 @@ var Reveal = (function(){
|
|
else if( i > index ) {
|
|
else if( i > index ) {
|
|
|
|
|
|
element.classList.add( reverse ? 'past' : 'future' );
|
|
element.classList.add( reverse ? 'past' : 'future' );
|
|
|
|
+
|
|
|
|
+ var fragments = toArray( element.querySelectorAll( '.fragment.visible' ) );
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+ while( fragments.length ) {
|
|
|
|
+ fragments.pop().classList.remove( 'visible' );
|
|
|
|
+ }
|
|
}
|
|
}
|
|
|
|
|
|
|
|
|
|
@@ -1526,7 +1660,7 @@ var Reveal = (function(){
|
|
state = state.concat( slideState.split( ' ' ) );
|
|
state = state.concat( slideState.split( ' ' ) );
|
|
}
|
|
}
|
|
|
|
|
|
-
|
|
+
|
|
|
|
|
|
var slideAutoSlide = slides[index].getAttribute( 'data-autoslide' );
|
|
var slideAutoSlide = slides[index].getAttribute( 'data-autoslide' );
|
|
if( slideAutoSlide ) {
|
|
if( slideAutoSlide ) {
|
|
@@ -1536,6 +1670,8 @@ var Reveal = (function(){
|
|
autoSlide = config.autoSlide;
|
|
autoSlide = config.autoSlide;
|
|
}
|
|
}
|
|
|
|
|
|
|
|
+ cueAutoSlide();
|
|
|
|
+
|
|
}
|
|
}
|
|
else {
|
|
else {
|
|
|
|
|
|
@@ -1547,6 +1683,61 @@ var Reveal = (function(){
|
|
|
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
+
|
|
|
|
+ * Optimization method; hide all slides that are far away
|
|
|
|
+ * from the present slide.
|
|
|
|
+ */
|
|
|
|
+ function updateSlidesVisibility() {
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+ var horizontalSlides = toArray( document.querySelectorAll( HORIZONTAL_SLIDES_SELECTOR ) ),
|
|
|
|
+ horizontalSlidesLength = horizontalSlides.length,
|
|
|
|
+ distanceX,
|
|
|
|
+ distanceY;
|
|
|
|
+
|
|
|
|
+ if( horizontalSlidesLength ) {
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+ var viewDistance = isOverview() ? 10 : config.viewDistance;
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+ if( isMobileDevice ) {
|
|
|
|
+ viewDistance = isOverview() ? 6 : 1;
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ for( var x = 0; x < horizontalSlidesLength; x++ ) {
|
|
|
|
+ var horizontalSlide = horizontalSlides[x];
|
|
|
|
+
|
|
|
|
+ var verticalSlides = toArray( horizontalSlide.querySelectorAll( 'section' ) ),
|
|
|
|
+ verticalSlidesLength = verticalSlides.length;
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+ distanceX = Math.abs( ( indexh - x ) % ( horizontalSlidesLength - viewDistance ) ) || 0;
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+ horizontalSlide.style.display = distanceX > viewDistance ? 'none' : 'block';
|
|
|
|
+
|
|
|
|
+ if( verticalSlidesLength ) {
|
|
|
|
+
|
|
|
|
+ var oy = getPreviousVerticalIndex( horizontalSlide );
|
|
|
|
+
|
|
|
|
+ for( var y = 0; y < verticalSlidesLength; y++ ) {
|
|
|
|
+ var verticalSlide = verticalSlides[y];
|
|
|
|
+
|
|
|
|
+ distanceY = x === indexh ? Math.abs( indexv - y ) : Math.abs( y - oy );
|
|
|
|
+
|
|
|
|
+ verticalSlide.style.display = ( distanceX + distanceY ) > viewDistance ? 'none' : 'block';
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
|
|
* Updates the progress bar to reflect the current slide.
|
|
* Updates the progress bar to reflect the current slide.
|
|
*/
|
|
*/
|
|
@@ -1803,7 +1994,7 @@ var Reveal = (function(){
|
|
}
|
|
}
|
|
|
|
|
|
else {
|
|
else {
|
|
- slide( indexh, indexv );
|
|
+ slide( indexh || 0, indexv || 0 );
|
|
}
|
|
}
|
|
}
|
|
}
|
|
else {
|
|
else {
|
|
@@ -1811,7 +2002,9 @@ var Reveal = (function(){
|
|
var h = parseInt( bits[0], 10 ) || 0,
|
|
var h = parseInt( bits[0], 10 ) || 0,
|
|
v = parseInt( bits[1], 10 ) || 0;
|
|
v = parseInt( bits[1], 10 ) || 0;
|
|
|
|
|
|
- slide( h, v );
|
|
+ if( h !== indexh || v !== indexv ) {
|
|
|
|
+ slide( h, v );
|
|
|
|
+ }
|
|
}
|
|
}
|
|
|
|
|
|
}
|
|
}
|
|
@@ -1888,8 +2081,9 @@ var Reveal = (function(){
|
|
}
|
|
}
|
|
|
|
|
|
if( !slide && currentSlide ) {
|
|
if( !slide && currentSlide ) {
|
|
- var visibleFragments = currentSlide.querySelectorAll( '.fragment.visible' );
|
|
+ var hasFragments = currentSlide.querySelectorAll( '.fragment' ).length > 0;
|
|
- if( visibleFragments.length ) {
|
|
+ if( hasFragments ) {
|
|
|
|
+ var visibleFragments = currentSlide.querySelectorAll( '.fragment.visible' );
|
|
f = visibleFragments.length;
|
|
f = visibleFragments.length;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
@@ -2119,7 +2313,7 @@ var Reveal = (function(){
|
|
|
|
|
|
var value = config.keyboard[ key ];
|
|
var value = config.keyboard[ key ];
|
|
|
|
|
|
-
|
|
+
|
|
if( typeof value === 'function' ) {
|
|
if( typeof value === 'function' ) {
|
|
value.apply( null, [ event ] );
|
|
value.apply( null, [ event ] );
|
|
}
|
|
}
|
|
@@ -2178,7 +2372,8 @@ var Reveal = (function(){
|
|
if( triggered ) {
|
|
if( triggered ) {
|
|
event.preventDefault();
|
|
event.preventDefault();
|
|
}
|
|
}
|
|
- else if ( event.keyCode === 27 && supports3DTransforms ) {
|
|
+
|
|
|
|
+ else if ( ( event.keyCode === 27 || event.keyCode === 79 ) && supports3DTransforms ) {
|
|
toggleOverview();
|
|
toggleOverview();
|
|
|
|
|
|
event.preventDefault();
|
|
event.preventDefault();
|
|
@@ -2220,11 +2415,11 @@ var Reveal = (function(){
|
|
function onTouchMove( event ) {
|
|
function onTouchMove( event ) {
|
|
|
|
|
|
|
|
|
|
- if( !touch.handled ) {
|
|
+ if( !touch.captured ) {
|
|
var currentX = event.touches[0].clientX;
|
|
var currentX = event.touches[0].clientX;
|
|
var currentY = event.touches[0].clientY;
|
|
var currentY = event.touches[0].clientY;
|
|
|
|
|
|
-
|
|
+
|
|
|
|
|
|
if( event.touches.length === 2 && touch.startCount === 2 && config.overview ) {
|
|
if( event.touches.length === 2 && touch.startCount === 2 && config.overview ) {
|
|
|
|
|
|
@@ -2240,7 +2435,7 @@ var Reveal = (function(){
|
|
|
|
|
|
|
|
|
|
if( Math.abs( touch.startSpan - currentSpan ) > touch.threshold ) {
|
|
if( Math.abs( touch.startSpan - currentSpan ) > touch.threshold ) {
|
|
- touch.handled = true;
|
|
+ touch.captured = true;
|
|
|
|
|
|
if( currentSpan < touch.startSpan ) {
|
|
if( currentSpan < touch.startSpan ) {
|
|
activateOverview();
|
|
activateOverview();
|
|
@@ -2260,23 +2455,34 @@ var Reveal = (function(){
|
|
deltaY = currentY - touch.startY;
|
|
deltaY = currentY - touch.startY;
|
|
|
|
|
|
if( deltaX > touch.threshold && Math.abs( deltaX ) > Math.abs( deltaY ) ) {
|
|
if( deltaX > touch.threshold && Math.abs( deltaX ) > Math.abs( deltaY ) ) {
|
|
- touch.handled = true;
|
|
+ touch.captured = true;
|
|
navigateLeft();
|
|
navigateLeft();
|
|
}
|
|
}
|
|
else if( deltaX < -touch.threshold && Math.abs( deltaX ) > Math.abs( deltaY ) ) {
|
|
else if( deltaX < -touch.threshold && Math.abs( deltaX ) > Math.abs( deltaY ) ) {
|
|
- touch.handled = true;
|
|
+ touch.captured = true;
|
|
navigateRight();
|
|
navigateRight();
|
|
}
|
|
}
|
|
else if( deltaY > touch.threshold ) {
|
|
else if( deltaY > touch.threshold ) {
|
|
- touch.handled = true;
|
|
+ touch.captured = true;
|
|
navigateUp();
|
|
navigateUp();
|
|
}
|
|
}
|
|
else if( deltaY < -touch.threshold ) {
|
|
else if( deltaY < -touch.threshold ) {
|
|
- touch.handled = true;
|
|
+ touch.captured = true;
|
|
navigateDown();
|
|
navigateDown();
|
|
}
|
|
}
|
|
|
|
|
|
- event.preventDefault();
|
|
+
|
|
|
|
+
|
|
|
|
+ if( config.embedded ) {
|
|
|
|
+ if( touch.captured || isVerticalSlide( currentSlide ) ) {
|
|
|
|
+ event.preventDefault();
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+ else {
|
|
|
|
+ event.preventDefault();
|
|
|
|
+ }
|
|
|
|
|
|
}
|
|
}
|
|
}
|
|
}
|
|
@@ -2293,7 +2499,7 @@ var Reveal = (function(){
|
|
*/
|
|
*/
|
|
function onTouchEnd( event ) {
|
|
function onTouchEnd( event ) {
|
|
|
|
|
|
- touch.handled = false;
|
|
+ touch.captured = false;
|
|
|
|
|
|
}
|
|
}
|
|
|
|
|
|
@@ -2561,6 +2767,11 @@ var Reveal = (function(){
|
|
}
|
|
}
|
|
},
|
|
},
|
|
|
|
|
|
|
|
+
|
|
|
|
+ isReady: function() {
|
|
|
|
+ return loaded;
|
|
|
|
+ },
|
|
|
|
+
|
|
|
|
|
|
addEventListener: function( type, listener, useCapture ) {
|
|
addEventListener: function( type, listener, useCapture ) {
|
|
if( 'addEventListener' in window ) {
|
|
if( 'addEventListener' in window ) {
|