From b1da77dd73c978a751b4a993fbb9bfa10f5ab65b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Juraj=20Nyi=CC=81ri?= <jnyiri@sk.ibm.com>
Date: Wed, 5 May 2021 22:27:58 +0200
Subject: [PATCH] Fix: Animations for opening session not working in slim view

---
 dist/plex-meets-homeassistant.js | 16 +++++++++++++++-
 src/plex-meets-homeassistant.ts  | 20 ++++++++++++++++++--
 2 files changed, 33 insertions(+), 3 deletions(-)

diff --git a/dist/plex-meets-homeassistant.js b/dist/plex-meets-homeassistant.js
index e340d8f..01beb41 100644
--- a/dist/plex-meets-homeassistant.js
+++ b/dist/plex-meets-homeassistant.js
@@ -19651,7 +19651,7 @@ class PlexMeetsHomeAssistant extends HTMLElement {
                                     seasonElem.dataset.clicked = 'true';
                                     this.activeMovieElem.style.top = `${top - 1000}px`;
                                     this.scrollDownInactiveSeasons();
-                                    seasonElem.style.marginTop = `${-CSS_STYLE.expandedHeight - 16}px`;
+                                    seasonContainer.style.top = `${-CSS_STYLE.expandedHeight}px`;
                                     seasonElem.style.width = `${CSS_STYLE.expandedWidth}px`;
                                     seasonElem.style.height = `${CSS_STYLE.expandedHeight - 6}px`;
                                     seasonElem.style.zIndex = '3';
@@ -19725,6 +19725,7 @@ class PlexMeetsHomeAssistant extends HTMLElement {
                                     })();
                                 }
                                 else {
+                                    seasonContainer.style.top = `${seasonContainer.dataset.top}px`;
                                     this.minimizeSeasons();
                                     this.hideEpisodes();
                                     this.activeMovieElem.style.top = `${top + 16}px`;
@@ -19740,6 +19741,19 @@ class PlexMeetsHomeAssistant extends HTMLElement {
                         this.seasonsElem.append(seasonContainer);
                     }
                 });
+                lodash.forEach(this.seasonsElem.children, elem => {
+                    const seasonElem = elem;
+                    const left = seasonElem.offsetLeft;
+                    const topElem = seasonElem.offsetTop;
+                    seasonElem.style.left = `${left}px`;
+                    seasonElem.dataset.left = `${left}`;
+                    seasonElem.style.top = `${topElem}px`;
+                    seasonElem.dataset.top = `${topElem}`;
+                });
+                lodash.forEach(this.seasonsElem.children, elem => {
+                    const seasonElem = elem;
+                    seasonElem.style.position = 'absolute';
+                });
                 setTimeout(() => {
                     this.seasonElemFreshlyLoaded = false;
                 }, 700);
diff --git a/src/plex-meets-homeassistant.ts b/src/plex-meets-homeassistant.ts
index 086bda6..95ee378 100644
--- a/src/plex-meets-homeassistant.ts
+++ b/src/plex-meets-homeassistant.ts
@@ -461,8 +461,7 @@ class PlexMeetsHomeAssistant extends HTMLElement {
 
 								this.scrollDownInactiveSeasons();
 
-								seasonElem.style.marginTop = `${-CSS_STYLE.expandedHeight - 16}px`;
-
+								seasonContainer.style.top = `${-CSS_STYLE.expandedHeight}px`;
 								seasonElem.style.width = `${CSS_STYLE.expandedWidth}px`;
 								seasonElem.style.height = `${CSS_STYLE.expandedHeight - 6}px`;
 								seasonElem.style.zIndex = '3';
@@ -471,6 +470,7 @@ class PlexMeetsHomeAssistant extends HTMLElement {
 
 								seasonTitleElem.style.color = 'rgba(255,255,255,0)';
 								seasonEpisodesCount.style.color = 'rgba(255,255,255,0)';
+
 								if (this.detailElem) {
 									(this.detailElem.children[1] as HTMLElement).innerHTML = seasonData.title;
 								}
@@ -547,6 +547,7 @@ class PlexMeetsHomeAssistant extends HTMLElement {
 									}
 								})();
 							} else {
+								seasonContainer.style.top = `${seasonContainer.dataset.top}px`;
 								this.minimizeSeasons();
 								this.hideEpisodes();
 								this.activeMovieElem.style.top = `${top + 16}px`;
@@ -563,6 +564,21 @@ class PlexMeetsHomeAssistant extends HTMLElement {
 					this.seasonsElem.append(seasonContainer);
 				}
 			});
+
+			_.forEach((this.seasonsElem as HTMLElement).children, elem => {
+				const seasonElem = elem as HTMLElement;
+				const left = seasonElem.offsetLeft;
+				const topElem = seasonElem.offsetTop;
+				seasonElem.style.left = `${left}px`;
+				seasonElem.dataset.left = `${left}`;
+				seasonElem.style.top = `${topElem}px`;
+				seasonElem.dataset.top = `${topElem}`;
+			});
+			_.forEach((this.seasonsElem as HTMLElement).children, elem => {
+				const seasonElem = elem as HTMLElement;
+				seasonElem.style.position = 'absolute';
+			});
+
 			setTimeout(() => {
 				this.seasonElemFreshlyLoaded = false;
 			}, 700);