scroll handling for gdpr prefs

src/components/AdSlot/AdScripts.svelte

@@ -2,6 +2,35 @@
   import { onMount } from 'svelte';
   import { loadBootstrap } from './adScripts/bootstrap';
   import { loadScript } from './adScripts/loadScript';
+  import { throttle } from 'lodash-es';
+
+  let lastScroll = 0;
+  let showManagePreferences = false;
+
+  const togglePrefs = (on = true) => {
+    const btn = document.getElementById('ot-sdk-btn-floating');
+    if (!btn) return;
+    if (on) {
+      btn.style.bottom = '';
+    } else {
+      btn.style.bottom = '-5rem';
+    }
+  };
+
+  const handleScroll = () => {
+    if (lastScroll > window.scrollY) {
+      if (!showManagePreferences) {
+        showManagePreferences = true;
+        togglePrefs(true);
+      }
+    } else {
+      if (showManagePreferences && window.scrollY > 250) {
+        showManagePreferences = false;
+        togglePrefs(false);
+      }
+    }
+    lastScroll = window.scrollY;
+  };
 
   onMount(() => {
     window.graphicsAdQueue = window.graphicsAdQueue || [];
@@ -9,6 +38,9 @@
       'https://graphics.thomsonreuters.com/cdn/js/bootstrap.static.js',
       loadBootstrap
     );
+    window.addEventListener('scroll', throttle(handleScroll, 250), {
+      passive: true,
+    });
   });
 </script>
 

src/components/Sharer/Sharer.svelte

@@ -60,7 +60,9 @@
     lastScroll = window.scrollY;
   }
   onMount(() => {
-    window.addEventListener('scroll', throttle(handleScroll, 250));
+    window.addEventListener('scroll', throttle(handleScroll, 250), {
+      passive: true,
+    });
   });
 </script>
 
@@ -91,7 +93,7 @@
     position: fixed;
     bottom: -5rem;
     right: 10px;
-    transition: all 0.2s;
+    transition: all 300ms ease;
     z-index: 9999;
   }
   .sharetool button {