Implement auto-animate id and restart
parent
0582f57517
commit
cec99c5261
|
@ -27,8 +27,16 @@ export default class AutoAnimate {
|
||||||
// Clean up after prior animations
|
// Clean up after prior animations
|
||||||
this.reset();
|
this.reset();
|
||||||
|
|
||||||
// Ensure that both slides are auto-animate targets
|
let allSlides = this.Reveal.getSlides();
|
||||||
if( fromSlide.hasAttribute( 'data-auto-animate' ) && toSlide.hasAttribute( 'data-auto-animate' ) ) {
|
let toSlideIndex = allSlides.indexOf( toSlide );
|
||||||
|
let fromSlideIndex = allSlides.indexOf( fromSlide );
|
||||||
|
|
||||||
|
// Ensure that both slides are auto-animate targets with the same data-auto-animate-id value
|
||||||
|
// (including null if absent on both) and that data-auto-animate-restart isn't set on the
|
||||||
|
// physically latter slide (independent of slide direction)
|
||||||
|
if( fromSlide.hasAttribute( 'data-auto-animate' ) && toSlide.hasAttribute( 'data-auto-animate' )
|
||||||
|
&& fromSlide.getAttribute( 'data-auto-animate-id' ) === toSlide.getAttribute( 'data-auto-animate-id' )
|
||||||
|
&& !( toSlideIndex > fromSlideIndex ? toSlide : fromSlide ).hasAttribute( 'data-auto-animate-restart' ) ) {
|
||||||
|
|
||||||
// Create a new auto-animate sheet
|
// Create a new auto-animate sheet
|
||||||
this.autoAnimateStyleSheet = this.autoAnimateStyleSheet || createStyleSheet();
|
this.autoAnimateStyleSheet = this.autoAnimateStyleSheet || createStyleSheet();
|
||||||
|
@ -40,8 +48,7 @@ export default class AutoAnimate {
|
||||||
toSlide.dataset.autoAnimate = 'pending';
|
toSlide.dataset.autoAnimate = 'pending';
|
||||||
|
|
||||||
// Flag the navigation direction, needed for fragment buildup
|
// Flag the navigation direction, needed for fragment buildup
|
||||||
let allSlides = this.Reveal.getSlides();
|
animationOptions.slideDirection = toSlideIndex > fromSlideIndex ? 'forward' : 'backward';
|
||||||
animationOptions.slideDirection = allSlides.indexOf( toSlide ) > allSlides.indexOf( fromSlide ) ? 'forward' : 'backward';
|
|
||||||
|
|
||||||
// Inject our auto-animate styles for this transition
|
// Inject our auto-animate styles for this transition
|
||||||
let css = this.getAutoAnimatableElements( fromSlide, toSlide ).map( elements => {
|
let css = this.getAutoAnimatableElements( fromSlide, toSlide ).map( elements => {
|
||||||
|
|
|
@ -1251,7 +1251,10 @@ export default function( revealElement, options ) {
|
||||||
// Note 20-03-2020:
|
// Note 20-03-2020:
|
||||||
// This needs to happen before we update slide visibility,
|
// This needs to happen before we update slide visibility,
|
||||||
// otherwise transitions will still run in Safari.
|
// otherwise transitions will still run in Safari.
|
||||||
if( previousSlide.hasAttribute( 'data-auto-animate' ) && currentSlide.hasAttribute( 'data-auto-animate' ) ) {
|
if( previousSlide.hasAttribute( 'data-auto-animate' ) && currentSlide.hasAttribute( 'data-auto-animate' )
|
||||||
|
&& previousSlide.getAttribute( 'data-auto-animate-id' ) === currentSlide.getAttribute( 'data-auto-animate-id' )
|
||||||
|
&& !( ( indexh > indexhBefore || indexv > indexvBefore ) ? currentSlide : previousSlide ).hasAttribute( 'data-auto-animate-restart' ) ) {
|
||||||
|
|
||||||
autoAnimateTransition = true;
|
autoAnimateTransition = true;
|
||||||
dom.slides.classList.add( 'disable-slide-transitions' );
|
dom.slides.classList.add( 'disable-slide-transitions' );
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue