Merge pull request #73774 from aireilly/add-footer-transition

OCPBUGS-17161 - Hide footer after a few seconds on docs.openshift.com

Author: aireilly

_templates/_page_openshift.html.erb

@@ -719,64 +719,6 @@
       })
   </script>
 
-  <!--adjust sidebar and toc when footer is displayed -->
-  <script type="text/javascript">
-    sidebar = document.querySelector('.sidebar')
-    toc = document.querySelector('#toc')
-    main = document.querySelector('.main')
-    okd_footer = document.querySelector('.footer-origin-docs')
-
-    //handle short pages
-    if (window.innerHeight === document.documentElement.scrollHeight) {
-      //sidebar
-      if (sidebar !== null && okd_footer == null) {
-        sidebar.style.marginBottom = "38px";
-        main.style.marginBottom = "35px";
-      };
-      //okd sidebar
-      if(sidebar !== null && okd_footer !== null) {
-        sidebar.style.marginBottom = "176px";
-        main.style.marginBottom = "135px";
-      }
-    };
-
-    //handle scrolling pages
-    document.addEventListener('scroll', () => {
-      //scroll to bottom
-      if ($(window).width() >= 1008) {
-        if(sidebar !== null) {
-          //pages with multiple toc entries
-          if(document.documentElement.scrollHeight === window.pageYOffset + window.innerHeight) {
-              //sidebar
-              if (sidebar !== null && okd_footer == null){
-                sidebar.style.marginBottom = "38px";
-                main.style.marginBottom = "35px";
-              };
-              //toc
-              if (toc !== null && okd_footer == null){
-                toc.style.bottom = "35px";
-              };
-              //okd sidebar
-              if(sidebar !== null && okd_footer !== null) {
-                sidebar.style.marginBottom = "176px";
-                main.style.marginBottom = "135px";
-              };
-              //okd toc
-              if (toc !== null && okd_footer !== null){
-                toc.style.bottom = "175px";
-              };
-            };
-          if(document.documentElement.scrollHeight != window.pageYOffset + window.innerHeight) {
-            sidebar.style.marginBottom = "0px";
-            if (toc !== null) {
-              toc.style.bottom = "0px";
-            }
-          }
-        }
-      }
-    })
-  </script>
-
   <!-- adjust alerts on mobile -->
   <script type="text/javascript">
     alert = document.querySelector('#support-alert')
@@ -805,5 +747,19 @@
     })
   </script>
 
+  <!-- hide footer after 3 seconds -->
+  <script type="text/javascript">
+    const hideFooter = () => {
+        document.querySelector('footer#rh').style.display = "none";
+      };
+
+    window.addEventListener('scroll', function() {
+      if (window.innerHeight + window.scrollY >= document.body.offsetHeight) {
+        setTimeout(hideFooter, 3000);
+      } else {
+        document.querySelector('footer#rh').style.display = "block";
+      }
+    })
+  </script>
 </body>
 </html>