xobs/fa23-si
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Implement auto-animate id and restart

Browse Source
This commit is contained in:
Jan Katzer
2021-02-07 18:41:16 +01:00
parent 0582f57517
commit cec99c5261
2 changed files with 15 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
js/controllers/autoanimate.js
View File

@@ -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 => {

5
js/reveal.js
View File

@@ -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' );
} }