[TASK] Inline JS

t3brightside · Oct 30, 2022 · d188213 · d188213
1 parent e9ebc98
commit d188213
Showing 1 changed file with 85 additions and 2 deletions.
diff --git a/Configuration/TypoScript/Page/javascript.typoscript b/Configuration/TypoScript/Page/javascript.typoscript
@@ -10,8 +10,8 @@ config {
 
 # load in home page only
   [tree.pagelayout == "pagets__home"]
-		page.includeJSFooterlibs.home = EXT:microtemplate/Resources/Public/JavaScript/Page/home.js
-		page.includeJSFooterlibs.menus = EXT:microtemplate/Resources/Public/JavaScript/Page/menus.js
+		#page.includeJSFooterlibs.home = EXT:microtemplate/Resources/Public/JavaScript/Page/home.js
+		#page.includeJSFooterlibs.menus = EXT:microtemplate/Resources/Public/JavaScript/Page/menus.js
     page.jsInline {
         10990 = TEXT
         10990.value (
@@ -35,6 +35,89 @@ config {
                       });
                   };
               });
+          /* home */
+          function addScrolledToHeader(el){
+            let sp = window.scrollY;
+            if (sp >= 45) {
+              header.classList.add('scrolled');
+              header.classList.add('force-bg');
+            } else {
+              header.classList.remove('scrolled');
+              if (!menu.classList.contains('open')) {
+                header.classList.remove('force-bg');
+              }
+            }
+          }
+
+          addScrolledToHeader(header);
+          window.addEventListener('scroll', function() {
+            addScrolledToHeader(header);
+          });
+
+          /* remember scroll position */
+          window.onbeforeunload = function(e) {
+            window.name += ' [' + window.scrollY.toString() + '[' + window.scrollX.toString();
+            document.querySelector('html').style.cssText = '';
+          };
+
+          if (window.name.indexOf('[') > 0) {
+            let parts = window.name.split('[');
+            window.scrollTo(parseInt(parts[parts.length - 1]), parseInt(parts[parts.length - 2]));
+            document.querySelector('html').style.cssText = 'scroll-behavior: smooth';
+          }
+          /* menu */
+          function removeMenuClasses() {
+            hmbrgr.classList.remove('open');
+            menu.classList.remove('open');
+            header.classList.remove('force-bg');
+          }
+
+          hmbrgr.addEventListener('click', function() {
+            hmbrgr.classList.toggle('open');
+            menu.classList.toggle('open');
+            header.classList.toggle('force-bg');
+          }, false);
+
+          const menuLinks = menu.querySelectorAll("a");
+          menuLinks.forEach(link => {
+            link.addEventListener("click", function() {
+              removeMenuClasses();
+            });
+          });
+
+          logo.addEventListener('click', function() {
+            removeMenuClasses();
+          }, false);
+
+          const callback = (entries, observer) => {
+            entries.forEach(entry => {
+              const id = entry.target.id;
+              const el = document.body.querySelector('#menu a[href*="#' + id + '"]');
+              const active = document.querySelectorAll('#menu .active');
+              const count = active.length;
+              if (entry.isIntersecting) {
+                if (el) {
+                el.parentNode.classList.add('active');
+              }
+                active.forEach(i => {
+                  if (i != el) {
+                    i.classList.remove('active');
+                  }
+                });
+
+              }
+            });
+          };
+          const sections2 = document.querySelectorAll('.c-section');
+          const options = {
+            threshold: 0.48
+          };
+          const observer = new IntersectionObserver(callback, options);
+          sections2.forEach(section2 => {
+            observer.observe(section2);
+          });
+
+
         )
     }
 	[END]