From f633a18fdf184e0111aa079e53f8431585fede2e Mon Sep 17 00:00:00 2001
From: Hakim El Hattab <hakim.elhattab@gmail.com>
Date: Thu, 20 Feb 2020 20:15:41 +0100
Subject: [PATCH] auto-animate tweaks and new config options

---
 css/reveal.css  |  5 +----
 css/reveal.scss |  5 +----
 js/reveal.js    | 34 +++++++++++++++++++++++++++-------
 3 files changed, 29 insertions(+), 15 deletions(-)

diff --git a/css/reveal.css b/css/reveal.css
index 2ca3c6b..d4a8cce 100644
--- a/css/reveal.css
+++ b/css/reveal.css
@@ -1233,12 +1233,9 @@ body {
 /*********************************************
  * AUTO ANIMATE
  *********************************************/
-.reveal section[data-auto-animate] [data-auto-animate-target="unmatched"] {
+.reveal section[data-auto-animate]:not([data-auto-animate="running"]) [data-auto-animate-target="unmatched"] {
   opacity: 0; }
 
-.reveal section[data-auto-animate="running"] [data-auto-animate-target="unmatched"] {
-  opacity: 1; }
-
 /*********************************************
  * OVERVIEW
  *********************************************/
diff --git a/css/reveal.scss b/css/reveal.scss
index 101c6fb..442338c 100644
--- a/css/reveal.scss
+++ b/css/reveal.scss
@@ -1318,12 +1318,9 @@ $controlsArrowAngleActive: 36deg;
  * AUTO ANIMATE
  *********************************************/
 
-.reveal section[data-auto-animate] [data-auto-animate-target="unmatched"] {
+.reveal section[data-auto-animate]:not([data-auto-animate="running"]) [data-auto-animate-target="unmatched"] {
 	opacity: 0;
 }
-.reveal section[data-auto-animate="running"] [data-auto-animate-target="unmatched"] {
-	opacity: 1;
-}
 
 
 /*********************************************
diff --git a/js/reveal.js b/js/reveal.js
index b585ed6..cba1d28 100644
--- a/js/reveal.js
+++ b/js/reveal.js
@@ -198,10 +198,11 @@
 			// used to dictate which elements we can animate between.
 			autoAnimateMatcher: null,
 
-			// Default settings for or auto-animate transitions, can be
+			// Default settings for our auto-animate transitions, can be
 			// overridden per-slide or per-element via data arguments
 			autoAnimateEasing: 'ease',
 			autoAnimateDuration: 1.0,
+			autoAnimateUnmatched: true,
 
 			// CSS properties that can be auto-animated. Position & scale
 			// is matched separately so there's no need to include styles
@@ -3879,9 +3880,8 @@
 				return getAutoAnimateCSS( elements.from, elements.to, elements.options || {}, animationOptions, autoAnimateCounter++ );
 			} );
 
-			// If the slide is configured to animate unmatched elements we
-			// need to flag them
-			if( toSlide.dataset.autoAnimateUnmatched ) {
+			// Animate unmatched elements, if enabled
+			if( toSlide.dataset.autoAnimateUnmatched !== 'false' && config.autoAnimateUnmatched === true ) {
 				getUnmatchedAutoAnimateElements( toSlide ).forEach( function( unmatchedElement ) {
 					unmatchedElement.dataset.autoAnimateTarget = 'unmatched';
 				} );
@@ -3965,6 +3965,12 @@
 				scaleY: fromProps.height / toProps.height
 			};
 
+			// Limit decimal points to avoid 0.00001px blur and stutter
+			delta.x = Math.round( delta.x * 100000 ) / 100000;
+			delta.y = Math.round( delta.y * 100000 ) / 100000;
+			delta.scaleX = Math.round( delta.scaleX * 100000 ) / 100000;
+			delta.scaleX = Math.round( delta.scaleX * 100000 ) / 100000;
+
 			// No need to transform if nothing's changed
 			if( delta.x !== 0 || delta.y !== 0 || delta.scaleX !== 1 || delta.scaleY !== 1 ) {
 
@@ -3984,9 +3990,23 @@
 
 		// Delete all unchanged 'to' styles
 		for( var propertyName in toProps.styles ) {
-			if( toProps.styles[propertyName] === fromProps.styles[propertyName] ) {
+			var toValue = toProps.styles[propertyName];
+			var fromValue = fromProps.styles[propertyName];
+
+			if( toValue === fromValue ) {
 				delete toProps.styles[propertyName];
 			}
+			else {
+				// If these property values were set via a custom matcher providing
+				// an explicit 'from' and/or 'to' value, we always inject those values.
+				if( toValue.explicitValue === true ) {
+					toProps.styles[propertyName] = toValue.value;
+				}
+
+				if( fromValue.explicitValue === true ) {
+					fromProps.styles[propertyName] = fromValue.value;
+				}
+			}
 		}
 
 		var css = '';
@@ -4086,10 +4106,10 @@
 			if( typeof style === 'string' ) style = { property: style };
 
 			if( typeof style.from !== 'undefined' && direction === 'from' ) {
-				value = style.from;
+				value = { value: style.from, explicitValue: true };
 			}
 			else if( typeof style.to !== 'undefined' && direction === 'to' ) {
-				value = style.to;
+				value = { value: style.to, explicitValue: true };
 			}
 			else {
 				value = computedStyles[style.property];