From 3de7d3b62ec46f0da09183bcd7e3606f77b69040 Mon Sep 17 00:00:00 2001
From: rzen <rzen@nhl.com>
Date: Thu, 10 Sep 2020 19:35:10 -0400
Subject: [PATCH] fix animation issues caused by window hiding

---
 assets/js/gallery.js | 16 +++++++++++-----
 1 file changed, 11 insertions(+), 5 deletions(-)

diff --git a/assets/js/gallery.js b/assets/js/gallery.js
index f09266b..b3becb5 100644
--- a/assets/js/gallery.js
+++ b/assets/js/gallery.js
@@ -1,11 +1,16 @@
 (function () {
+	var hidden = function () {
+		return document.hidden || document.msHidden || document.webkitHidden;
+	}
+
 	// "hydrate" div.gallery with play/pause and nav behaviors
 	var process_gallery = function (g) {
 		var
 			// milliseconds to wait before switch to next slide
-			NEXT_SLIDE_TIMEOUT = 3000;
+			NEXT_SLIDE_TIMEOUT = 5000;
 
 		var 
+			// will be resized to the height of currently selected image
 			images_container = g.querySelector('.images'),
 
 			// images in this gallery
@@ -45,18 +50,18 @@
 			if (selected_index === index) return;
 
 			var slide = function () {
-				images[selected_index].removeEventListener('transitionend', slide);
-
 				images[selected_index].classList.remove('transition');
 				images[index].classList.remove('transition');
 
-				navs[index].classList.add('selected');
 				navs[selected_index].classList.remove('selected');
 				
 				selected_index = index;
 			}
 
-			images[selected_index].addEventListener('transitionend', slide);
+			if (hidden()) return;
+			images[selected_index].addEventListener('transitionend', slide, {once: true});
+
+			navs[index].classList.add('selected');
 
 			if (index < selected_index) {
 				setTimeout(function () {
@@ -97,6 +102,7 @@
 
 		// show next image
 		var next_image = function () {
+			if (hidden()) return;
 			if (selected_index >= images.length-1) {
 				select_image(0);
 			} else {