From 19e7a90045345b531a489289dc8d4e032fa15d6c Mon Sep 17 00:00:00 2001
From: Chocobozzz <me@florianbigard.com>
Date: Tue, 1 Mar 2022 11:11:12 +0100
Subject: Fix playlist element scrolling

---
 client/src/app/helpers/utils/dom.ts   | 43 +++++++++++++++++++++++++++++++++++
 client/src/app/helpers/utils/index.ts |  2 +-
 client/src/app/helpers/utils/ui.ts    | 33 ---------------------------
 3 files changed, 44 insertions(+), 34 deletions(-)
 create mode 100644 client/src/app/helpers/utils/dom.ts
 delete mode 100644 client/src/app/helpers/utils/ui.ts

(limited to 'client/src/app/helpers')

diff --git a/client/src/app/helpers/utils/dom.ts b/client/src/app/helpers/utils/dom.ts
new file mode 100644
index 000000000..f65e4d726
--- /dev/null
+++ b/client/src/app/helpers/utils/dom.ts
@@ -0,0 +1,43 @@
+function scrollToTop (behavior: 'auto' | 'smooth' = 'auto') {
+  window.scrollTo({
+    left: 0,
+    top: 0,
+    behavior
+  })
+}
+
+function isInViewport (el: HTMLElement, container: HTMLElement = document.documentElement) {
+  const boundingEl = el.getBoundingClientRect()
+  const boundingContainer = container.getBoundingClientRect()
+
+  const relativePos = {
+    top: 0,
+    left: 0,
+    bottom: 0,
+    right: 0
+  }
+
+  relativePos.top = boundingEl.top - boundingContainer.top
+  relativePos.left = boundingEl.left - boundingContainer.left
+
+  return relativePos.top >= 0 &&
+    relativePos.left >= 0 &&
+    boundingEl.bottom <= boundingContainer.bottom &&
+    boundingEl.right <= boundingContainer.right
+}
+
+function isXPercentInViewport (el: HTMLElement, percentVisible: number) {
+  const rect = el.getBoundingClientRect()
+  const windowHeight = (window.innerHeight || document.documentElement.clientHeight)
+
+  return !(
+    Math.floor(100 - (((rect.top >= 0 ? 0 : rect.top) / +-(rect.height / 1)) * 100)) < percentVisible ||
+    Math.floor(100 - ((rect.bottom - windowHeight) / rect.height) * 100) < percentVisible
+  )
+}
+
+export {
+  scrollToTop,
+  isInViewport,
+  isXPercentInViewport
+}
diff --git a/client/src/app/helpers/utils/index.ts b/client/src/app/helpers/utils/index.ts
index dc09c92ab..f821985c9 100644
--- a/client/src/app/helpers/utils/index.ts
+++ b/client/src/app/helpers/utils/index.ts
@@ -2,6 +2,6 @@ export * from './channel'
 export * from './date'
 export * from './html'
 export * from './object'
-export * from './ui'
+export * from './dom'
 export * from './upload'
 export * from './url'
diff --git a/client/src/app/helpers/utils/ui.ts b/client/src/app/helpers/utils/ui.ts
deleted file mode 100644
index ac8298926..000000000
--- a/client/src/app/helpers/utils/ui.ts
+++ /dev/null
@@ -1,33 +0,0 @@
-function scrollToTop (behavior: 'auto' | 'smooth' = 'auto') {
-  window.scrollTo({
-    left: 0,
-    top: 0,
-    behavior
-  })
-}
-
-function isInViewport (el: HTMLElement) {
-  const bounding = el.getBoundingClientRect()
-  return (
-    bounding.top >= 0 &&
-      bounding.left >= 0 &&
-      bounding.bottom <= (window.innerHeight || document.documentElement.clientHeight) &&
-      bounding.right <= (window.innerWidth || document.documentElement.clientWidth)
-  )
-}
-
-function isXPercentInViewport (el: HTMLElement, percentVisible: number) {
-  const rect = el.getBoundingClientRect()
-  const windowHeight = (window.innerHeight || document.documentElement.clientHeight)
-
-  return !(
-    Math.floor(100 - (((rect.top >= 0 ? 0 : rect.top) / +-(rect.height / 1)) * 100)) < percentVisible ||
-    Math.floor(100 - ((rect.bottom - windowHeight) / rect.height) * 100) < percentVisible
-  )
-}
-
-export {
-  scrollToTop,
-  isInViewport,
-  isXPercentInViewport
-}
-- 
cgit v1.2.3