mirror of
https://git.hexahost.dev/smueller/HexaHost-Frontend.git
synced 2026-06-02 13:28:43 +00:00
2 lines
6.5 KiB
JavaScript
2 lines
6.5 KiB
JavaScript
(function(){"use strict";const navToggle=document.querySelector(".nav-toggle");const navMenu=document.querySelector(".nav-menu");const navLinks=document.querySelectorAll(".nav-link");const glassCards=document.querySelectorAll(".glass-card");const productCards=document.querySelectorAll(".product-card");if(navToggle&&navMenu){navToggle.addEventListener("click",function(){navMenu.classList.toggle("active");navToggle.classList.toggle("active");});navLinks.forEach(navLink=>{navLink.addEventListener("click",function(){navMenu.classList.remove("active");navToggle.classList.remove("active");});});}document.querySelectorAll("a[href^=\"#\"]").forEach(anchorLink=>{anchorLink.addEventListener("click",function(event){event.preventDefault();const targetSection=document.querySelector(this.getAttribute("href"));if(targetSection){targetSection.scrollIntoView({behavior:"smooth",block:"start"});}});});glassCards.forEach(card=>{card.addEventListener("mouseenter",function(){this.style.transform="translateY(-8px)scale(1.02)";});card.addEventListener("mouseleave",function(){this.style.transform="translateY(0)scale(1)";});});productCards.forEach(productCard=>{productCard.addEventListener("mouseenter",function(){if(!this.classList.contains("featured")){this.style.transform="translateY(-10px)scale(1.03)";}});productCard.addEventListener("mouseleave",function(){if(!this.classList.contains("featured")){this.style.transform="translateY(0)scale(1)";}});});const observerOptions={threshold:0.1,rootMargin:"0px 0px-50px 0px"};const animationObserver=new IntersectionObserver(function(entries){entries.forEach(entry=>{if(entry.isIntersecting){entry.target.classList.add("animate-in");}});},observerOptions);const animatedElements=document.querySelectorAll(".glass-card,.feature-item,.product-card");animatedElements.forEach(element=>{animationObserver.observe(element);});const headerElement=document.querySelector(".header");const heroSection=document.querySelector(".hero");let isScrollTicking=false;function updateOnScroll(){const scrollTop=window.pageYOffset||document.documentElement.scrollTop;if(headerElement){if(scrollTop>50){headerElement.classList.add("scrolled");}else{headerElement.classList.remove("scrolled");}}if(heroSection){const parallaxOffset=scrollTop*-0.5;heroSection.style.transform="translateY("+parallaxOffset+"px)";}isScrollTicking=false;}window.addEventListener("scroll",function(){if(!isScrollTicking){requestAnimationFrame(updateOnScroll);isScrollTicking=true;}},{passive:true});const forms=document.querySelectorAll("form");forms.forEach(form=>{form.addEventListener("submit",function(submitEvent){const requiredFields=form.querySelectorAll("[required]");let isValid=true;requiredFields.forEach(field=>{if(!field.value.trim()){isValid=false;field.classList.add("error");field.addEventListener("focus",function(){this.classList.remove("error");},{once:true});}});if(!isValid){submitEvent.preventDefault();showNotification("Bitte füllen Sie alle Pflichtfelder aus.","error");}});});function showNotification(message,type="info"){const notificationEl=document.createElement("div");notificationEl.className="notification notification-"+type;notificationEl.textContent=message;notificationEl.style.position="fixed";notificationEl.style.top="20px";notificationEl.style.right="20px";notificationEl.style.padding="15px 20px";notificationEl.style.borderRadius="8px";notificationEl.style.color="white";notificationEl.style.fontWeight="500";notificationEl.style.zIndex="9999";notificationEl.style.transform="translateX(400px)";notificationEl.style.transition="transform 0.3s ease-in-out";if(type==="error"){notificationEl.style.background="linear-gradient(135deg,#ef4444,#dc2626)";}else if(type==="success"){notificationEl.style.background="linear-gradient(135deg,#10b981,#059669)";}else{notificationEl.style.background="linear-gradient(135deg,#3b82f6,#2563eb)";}document.body.appendChild(notificationEl);setTimeout(()=>{notificationEl.style.transform="translateX(0)";},100);setTimeout(()=>{notificationEl.style.transform="translateX(400px)";setTimeout(()=>{if(notificationEl.parentNode){notificationEl.parentNode.removeChild(notificationEl);}},300);},5000);}const lazyImages=document.querySelectorAll("img[data-src]");const lazyImageObserver=new IntersectionObserver(imageEntries=>{imageEntries.forEach(imageEntry=>{if(imageEntry.isIntersecting){const image=imageEntry.target;image.src=image.dataset.src;image.classList.remove("lazy");lazyImageObserver.unobserve(image);}});});lazyImages.forEach(lazyImage=>lazyImageObserver.observe(lazyImage));function debounce(callback,delay){let timeoutId;return function debouncedFunction(...args){const runLater=()=>{clearTimeout(timeoutId);callback(...args);};clearTimeout(timeoutId);timeoutId=setTimeout(runLater,delay);};}const debouncedScrollProgress=debounce(function(){updateScrollProgress();},16);window.addEventListener("scroll",debouncedScrollProgress);function updateScrollProgress(){const pageYOffset=window.pageYOffset;const scrollableHeight=document.body.scrollHeight-window.innerHeight;const progressPercent=pageYOffset/scrollableHeight*100;document.documentElement.style.setProperty("--scroll-progress",progressPercent+"%");}function initDarkMode(){const darkModeToggle=document.querySelector(".dark-mode-toggle");if(darkModeToggle){darkModeToggle.addEventListener("click",function(){document.body.classList.toggle("dark-mode");localStorage.setItem("darkMode",document.body.classList.contains("dark-mode"));});if(localStorage.getItem("darkMode")==="true"){document.body.classList.add("dark-mode");}}}function initFaqAccordion(){const faqItems=document.querySelectorAll(".faq-item");faqItems.forEach(faqItem=>{const faqQuestion=faqItem.querySelector(".faq-question");const faqAnswer=faqItem.querySelector(".faq-answer");if(faqQuestion&&faqAnswer){faqQuestion.addEventListener("click",function(){faqItems.forEach(otherFaqItem=>{if(otherFaqItem!==faqItem&&otherFaqItem.classList.contains("open")){otherFaqItem.classList.remove("open");const otherFaqAnswer=otherFaqItem.querySelector(".faq-answer");if(otherFaqAnswer){otherFaqAnswer.style.maxHeight=null;}}});faqItem.classList.toggle("open");if(faqItem.classList.contains("open")){faqAnswer.style.maxHeight=faqAnswer.scrollHeight+"px";}else{faqAnswer.style.maxHeight=null;}});}});}document.addEventListener("DOMContentLoaded",function(){initDarkMode();initFaqAccordion();document.body.classList.add("loaded");if(!localStorage.getItem("hasVisited")){setTimeout(()=>{showNotification("Willkommen bei HexaHost.de!🚀","success");localStorage.setItem("hasVisited","true");},1000);}});const hexaHostApi={showNotification:showNotification};window.HexaHost=hexaHostApi;})();
|