diff --git a/js/controllers/backgrounds.js b/js/controllers/backgrounds.js index f90626960a7..d41b6ceb44d 100644 --- a/js/controllers/backgrounds.js +++ b/js/controllers/backgrounds.js @@ -281,43 +281,47 @@ export default class Backgrounds { } ); - // Stop content inside of previous backgrounds - if( this.previousBackground ) { - - this.Reveal.slideContent.stopEmbeddedContent( this.previousBackground, { unloadIframes: !this.Reveal.slideContent.shouldPreload( this.previousBackground ) } ); + let previousBackgroundHash = this.previousBackground ? this.previousBackground.getAttribute( 'data-background-hash' ) : null; + let currentBackgroundHash = currentBackground.getAttribute( 'data-background-hash' ); - } + const backgroundNotChanged = currentBackgroundHash && currentBackgroundHash === previousBackgroundHash && currentBackground.classList.contains('present') && this.previousBackground.classList.contains('present') + // Stop content inside of previous backgrounds + // console.log(this.previousBackground, currentBackground, backgroundNotChanged, currentBackgroundHash) - // Start content in the current background - if( currentBackground ) { + if (!backgroundNotChanged) { + if(this.previousBackground) { + this.Reveal.slideContent.stopEmbeddedContent( this.previousBackground, { unloadIframes: !this.Reveal.slideContent.shouldPreload( this.previousBackground ) } ); + } - this.Reveal.slideContent.startEmbeddedContent( currentBackground ); - let currentBackgroundContent = currentBackground.querySelector( '.slide-background-content' ); - if( currentBackgroundContent ) { + // Start content in the current background + if(currentBackground) { + this.Reveal.slideContent.startEmbeddedContent( currentBackground ); - let backgroundImageURL = currentBackgroundContent.style.backgroundImage || ''; + let currentBackgroundContent = currentBackground.querySelector( '.slide-background-content' ); + if( currentBackgroundContent ) { - // Restart GIFs (doesn't work in Firefox) - if( /\.gif/i.test( backgroundImageURL ) ) { - currentBackgroundContent.style.backgroundImage = ''; - window.getComputedStyle( currentBackgroundContent ).opacity; - currentBackgroundContent.style.backgroundImage = backgroundImageURL; - } + let backgroundImageURL = currentBackgroundContent.style.backgroundImage || ''; - } + // Restart GIFs (doesn't work in Firefox) + if( /\.gif/i.test( backgroundImageURL ) ) { + currentBackgroundContent.style.backgroundImage = ''; + window.getComputedStyle( currentBackgroundContent ).opacity; + currentBackgroundContent.style.backgroundImage = backgroundImageURL; + } - // Don't transition between identical backgrounds. This - // prevents unwanted flicker. - let previousBackgroundHash = this.previousBackground ? this.previousBackground.getAttribute( 'data-background-hash' ) : null; - let currentBackgroundHash = currentBackground.getAttribute( 'data-background-hash' ); - if( currentBackgroundHash && currentBackgroundHash === previousBackgroundHash && currentBackground !== this.previousBackground ) { - this.element.classList.add( 'no-transition' ); - } + } - this.previousBackground = currentBackground; + // Don't transition between identical backgrounds. This + // prevents unwanted flicker. + if(backgroundNotChanged) { + this.element.classList.add( 'no-transition' ); + } + this.previousBackground = currentBackground + } + } - } + this.previousBackground = currentBackground // If there's a background brightness flag for this slide, // bubble it to the .reveal container diff --git a/js/controllers/slidecontent.js b/js/controllers/slidecontent.js index 5462dbfe44f..6c8d55e0110 100644 --- a/js/controllers/slidecontent.js +++ b/js/controllers/slidecontent.js @@ -301,7 +301,7 @@ export default class SlideContent { if( autoplay && typeof el.play === 'function' ) { // If the media is ready, start playback - if( el.readyState > 1 ) { + if( el.readyState > 1 && el.paused || el.ended || el.currentTime == 0) { this.startEmbeddedMedia( { target: el } ); } // Mobile devices never fire a loaded event so instead