fix edge case in background transitions (closes #604)
This commit is contained in:
parent
89cc3f3a29
commit
fcf91ec261
38
js/reveal.js
38
js/reveal.js
|
@ -122,7 +122,7 @@ var Reveal = (function(){
|
||||||
previousSlide,
|
previousSlide,
|
||||||
currentSlide,
|
currentSlide,
|
||||||
|
|
||||||
previousBackgroundHash,
|
previousBackground,
|
||||||
|
|
||||||
// Slides may hold a data-state attribute which we pick up and apply
|
// Slides may hold a data-state attribute which we pick up and apply
|
||||||
// as a class to the body. This list contains the combined state of
|
// as a class to the body. This list contains the combined state of
|
||||||
|
@ -309,6 +309,9 @@ var Reveal = (function(){
|
||||||
// Read the initial hash
|
// Read the initial hash
|
||||||
readURL();
|
readURL();
|
||||||
|
|
||||||
|
// Update all backgrounds
|
||||||
|
updateBackground( true );
|
||||||
|
|
||||||
// Notify listeners that the presentation is ready but use a 1ms
|
// Notify listeners that the presentation is ready but use a 1ms
|
||||||
// timeout to ensure it's not fired synchronously after #initialize()
|
// timeout to ensure it's not fired synchronously after #initialize()
|
||||||
setTimeout( function() {
|
setTimeout( function() {
|
||||||
|
@ -444,7 +447,6 @@ var Reveal = (function(){
|
||||||
};
|
};
|
||||||
|
|
||||||
var element = document.createElement( 'div' );
|
var element = document.createElement( 'div' );
|
||||||
element.setAttribute( 'data-background-hash', data.background + data.backgroundSize + data.backgroundImage + data.backgroundColor + data.backgroundRepeat + data.backgroundPosition + data.backgroundTransition );
|
|
||||||
element.className = 'slide-background';
|
element.className = 'slide-background';
|
||||||
|
|
||||||
if( data.background ) {
|
if( data.background ) {
|
||||||
|
@ -455,6 +457,8 @@ var Reveal = (function(){
|
||||||
else {
|
else {
|
||||||
element.style.background = data.background;
|
element.style.background = data.background;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
element.setAttribute( 'data-background-hash', data.background + data.backgroundSize + data.backgroundImage + data.backgroundColor + data.backgroundRepeat + data.backgroundPosition + data.backgroundTransition );
|
||||||
}
|
}
|
||||||
|
|
||||||
// Additional and optional background properties
|
// Additional and optional background properties
|
||||||
|
@ -1640,7 +1644,7 @@ var Reveal = (function(){
|
||||||
|
|
||||||
updateControls();
|
updateControls();
|
||||||
updateProgress();
|
updateProgress();
|
||||||
updateBackground();
|
updateBackground( true );
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -1891,8 +1895,11 @@ var Reveal = (function(){
|
||||||
/**
|
/**
|
||||||
* Updates the background elements to reflect the current
|
* Updates the background elements to reflect the current
|
||||||
* slide.
|
* slide.
|
||||||
|
*
|
||||||
|
* @param {Boolean} includeAll If true, the backgrounds of
|
||||||
|
* all vertical slides (not just the present) will be updated.
|
||||||
*/
|
*/
|
||||||
function updateBackground() {
|
function updateBackground( includeAll ) {
|
||||||
|
|
||||||
var currentBackground = null;
|
var currentBackground = null;
|
||||||
|
|
||||||
|
@ -1904,51 +1911,50 @@ var Reveal = (function(){
|
||||||
// states of their slides (past/present/future)
|
// states of their slides (past/present/future)
|
||||||
toArray( dom.background.childNodes ).forEach( function( backgroundh, h ) {
|
toArray( dom.background.childNodes ).forEach( function( backgroundh, h ) {
|
||||||
|
|
||||||
backgroundh.className = 'slide-background ';
|
|
||||||
|
|
||||||
if( h < indexh ) {
|
if( h < indexh ) {
|
||||||
backgroundh.className += horizontalPast;
|
backgroundh.className = 'slide-background ' + horizontalPast;
|
||||||
}
|
}
|
||||||
else if ( h > indexh ) {
|
else if ( h > indexh ) {
|
||||||
backgroundh.className += horizontalFuture;
|
backgroundh.className = 'slide-background ' + horizontalFuture;
|
||||||
}
|
}
|
||||||
else {
|
else {
|
||||||
backgroundh.className += 'present';
|
backgroundh.className = 'slide-background present';
|
||||||
|
|
||||||
// Store a reference to the current background element
|
// Store a reference to the current background element
|
||||||
currentBackground = backgroundh;
|
currentBackground = backgroundh;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
if( includeAll || h === indexh ) {
|
||||||
toArray( backgroundh.childNodes ).forEach( function( backgroundv, v ) {
|
toArray( backgroundh.childNodes ).forEach( function( backgroundv, v ) {
|
||||||
|
|
||||||
backgroundv.className = 'slide-background ';
|
|
||||||
|
|
||||||
if( v < indexv ) {
|
if( v < indexv ) {
|
||||||
backgroundv.className += 'past';
|
backgroundv.className = 'slide-background past';
|
||||||
}
|
}
|
||||||
else if ( v > indexv ) {
|
else if ( v > indexv ) {
|
||||||
backgroundv.className += 'future';
|
backgroundv.className = 'slide-background future';
|
||||||
}
|
}
|
||||||
else {
|
else {
|
||||||
backgroundv.className += 'present';
|
backgroundv.className = 'slide-background present';
|
||||||
|
|
||||||
// Only if this is the present horizontal and vertical slide
|
// Only if this is the present horizontal and vertical slide
|
||||||
if( h === indexh ) currentBackground = backgroundv;
|
if( h === indexh ) currentBackground = backgroundv;
|
||||||
}
|
}
|
||||||
|
|
||||||
} );
|
} );
|
||||||
|
}
|
||||||
|
|
||||||
} );
|
} );
|
||||||
|
|
||||||
// Don't transition between identical backgrounds. This
|
// Don't transition between identical backgrounds. This
|
||||||
// prevents unwanted flicker.
|
// prevents unwanted flicker.
|
||||||
if( currentBackground ) {
|
if( currentBackground ) {
|
||||||
|
var previousBackgroundHash = previousBackground ? previousBackground.getAttribute( 'data-background-hash' ) : null;
|
||||||
var currentBackgroundHash = currentBackground.getAttribute( 'data-background-hash' );
|
var currentBackgroundHash = currentBackground.getAttribute( 'data-background-hash' );
|
||||||
if( currentBackgroundHash === previousBackgroundHash ) {
|
if( currentBackgroundHash && currentBackgroundHash === previousBackgroundHash && currentBackground !== previousBackground ) {
|
||||||
dom.background.classList.add( 'no-transition' );
|
dom.background.classList.add( 'no-transition' );
|
||||||
}
|
}
|
||||||
|
|
||||||
previousBackgroundHash = currentBackgroundHash;
|
previousBackground = currentBackground;
|
||||||
}
|
}
|
||||||
|
|
||||||
// Allow the first background to apply without transition
|
// Allow the first background to apply without transition
|
||||||
|
|
File diff suppressed because one or more lines are too long
Loading…
Reference in New Issue