@widelab-nc/widehue 1.0.40 → 1.0.42

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@widelab-nc/widehue",
-  "version": "1.0.40",
+  "version": "1.0.42",
   "description": "Widelab starter template based on Finsweet template + add-ons.",
   "homepage": "https://widelab.co",
   "license": "ISC",

package/src/index.js

@@ -24,32 +24,12 @@ function customGsapEasing() {
 // Contact form open animation
 let contactFormOpen;
 
-// 1. GŁÓWNY PROBLEM: Refresh ScrollTrigger po pełnym załadowaniu
 function refreshScrollTriggersAfterLoad() {
   window.addEventListener('load', () => {
     console.log('[ScrollTrigger] Page fully loaded — refreshing all triggers');
-
-    // ZWIĘKSZ DELAY dla Safari
     setTimeout(() => {
       ScrollTrigger.refresh();
-
-      // DODATKOWY refresh dla Safari
-      if (/^((?!chrome|android).)*safari/i.test(navigator.userAgent)) {
-        setTimeout(() => {
-          ScrollTrigger.refresh();
-          console.log('[Safari] Additional ScrollTrigger refresh');
-        }, 500);
-      }
-    }, 200); // Zwiększone z 100ms do 200ms
-  });
-
-  // DODAJ refresh na resize dla Safari
-  window.addEventListener('resize', () => {
-    if (/^((?!chrome|android).)*safari/i.test(navigator.userAgent)) {
-      setTimeout(() => {
-        ScrollTrigger.refresh();
-      }, 100);
-    }
+    }, 100); // bufor na przypadkowe opóźnienia, możesz zwiększyć
   });
 }
 
@@ -109,30 +89,12 @@ const lenis = new Lenis({
   duration: 1.2,
   easing: (t) => Math.min(1, 1.001 - Math.pow(2, -10 * t)),
 });
-
-
-// 2. POPRAWKA DLA LENIS + Safari
 function lenisScroll() {
-  // Sprawdź czy to Safari
-  const isSafari = /^((?!chrome|android).)*safari/i.test(navigator.userAgent);
-
-  lenis.on('scroll', (e) => {
-    ScrollTrigger.update();
-
-    // Dodatkowe wymuszenie update dla Safari
-    if (isSafari) {
-      requestAnimationFrame(() => {
-        ScrollTrigger.update();
-      });
-    }
-  });
-
-  gsap.ticker.add((time) => {
-    lenis.raf(time * 1000);
-  });
-
-  gsap.ticker.lagSmoothing(0);
-
+  lenis.on('scroll', ScrollTrigger.update);
+  gsap.ticker.add((time)=>{
+    lenis.raf(time * 1000)
+  })
+  gsap.ticker.lagSmoothing(0)
   function raf(time) {
     lenis.raf(time);
     requestAnimationFrame(raf);
@@ -140,8 +102,6 @@ function lenisScroll() {
   requestAnimationFrame(raf);
 }
 
-
-
 // Lazy load videos
 function lazyLoadVideos() {
   let lazyVideos = [].slice.call(document.querySelectorAll("video.lazyload"));
@@ -242,10 +202,10 @@ function initBasicAnimations() {
   }
 }
 
-// 5. ULEPSZONE pageLoadAnimation
 function pageLoadAnimation() {
   console.log('pageLoadAnimation function called');
 
+  // Check if all required loader elements exist
   const requiredElements = [
     '.loader_ract.is-left',
     '.loader_ract.is-right',
@@ -268,20 +228,10 @@ function pageLoadAnimation() {
       console.log('First animation step triggered: scrollRestoration and scrollTo');
       history.scrollRestoration = 'manual';
 
-      // POPRAWKA: Lepszy scroll to top dla Safari
-      const isSafari = /^((?!chrome|android).)*safari/i.test(navigator.userAgent);
-
+      // Safari-safe scroll to top
       if (typeof lenis !== 'undefined' && lenis.scrollTo) {
         try {
           lenis.scrollTo(0, { immediate: true });
-
-          // Dodatkowe wymuszenie dla Safari
-          if (isSafari) {
-            setTimeout(() => {
-              window.scrollTo(0, 0);
-              lenis.scrollTo(0, { immediate: true });
-            }, 50);
-          }
         } catch (e) {
           console.warn('Lenis scrollTo failed, using fallback:', e);
           window.scrollTo(0, 0);
@@ -313,11 +263,6 @@ function pageLoadAnimation() {
       console.log('lenis started');
       if (typeof lenis !== 'undefined' && lenis.start) {
         lenis.start();
-
-        // Refresh ScrollTrigger po starcie lenis
-        setTimeout(() => {
-          ScrollTrigger.refresh();
-        }, 100);
       }
     }, '>')
     .to('.loader_wrapper', {
@@ -330,17 +275,21 @@ function pageLoadAnimation() {
 
   console.log('Animation timeline defined');
 
+  // Update on screen resize - with element existence check
   window.addEventListener('resize', function () {
     console.log('Window resize event triggered');
     setTimeout(function () {
       if (document.querySelector('.loader_wrapper')) {
         console.log('Set .loader_wrapper to display:none on resize');
         gsap.set('.loader_wrapper', { display: 'none' });
+      } else {
+        console.warn('Loader wrapper not found on resize');
       }
     }, 50);
   });
-}
 
+  console.log('Resize event listener added');
+}
 
 
 // Page transition animation
@@ -551,60 +500,37 @@ window.heroAnimationOnLoad = function(e) {
     console.log('Page reloaded; session flag cleared.');
   }
 
-  // POPRAWKA: Ustaw initial state przed SplitText
   gsap.set('.wideletter', { y: '-150%', scale: 1 });
-  gsap.set('#heroHeading', { opacity: 0 }); // DODANE
 
-  // POPRAWKA: Scroll to top z większym delay dla Safari
   if (typeof lenis !== 'undefined') {
     console.log('Lenis instance found, attempting to scroll to top');
-
-    const isSafari = /^((?!chrome|android).)*safari/i.test(navigator.userAgent);
-    const delay = isSafari ? 300 : 100; // Większy delay dla Safari
-
     setTimeout(() => {
       lenis.scrollTo(0, { duration: 0, easing: (t) => t });
       console.log('Lenis scrollTo action called after delay');
-    }, delay);
+    }, 100);
+  } else {
+    console.log('Lenis instance not found');
   }
 
   const videoMask = e.querySelector('.hero_headline_ract-mask');
   const video = e.querySelector('video.lazyload');
   const heroAnimation = gsap.timeline({});
+  const homeHeroHeading = new SplitText('#heroHeading', {
+    type: 'lines',
+    linesClass: 'hero-line',
+  });
+  const homeHeroHeadingMask = new SplitText('#heroHeading', {
+    type: 'lines',
+    linesClass: 'hero-line-mask',
+  });
 
-  // POPRAWKA: Dodaj fallback jeśli SplitText nie działa
-  let homeHeroHeading, homeHeroHeadingMask, heroLines;
-
-  try {
-    homeHeroHeading = new SplitText('#heroHeading', {
-      type: 'lines',
-      linesClass: 'hero-line',
-    });
-    homeHeroHeadingMask = new SplitText('#heroHeading', {
-      type: 'lines',
-      linesClass: 'hero-line-mask',
-    });
-
-    heroLines = document.querySelectorAll('.hero-line');
-
-    if (heroLines.length === 0) {
-      throw new Error('SplitText failed to create lines');
-    }
-  } catch (error) {
-    console.error('SplitText error:', error);
-    // Fallback: użyj oryginalnego elementu
-    heroLines = [document.querySelector('#heroHeading')];
-    if (heroLines[0]) {
-      heroLines[0].classList.add('hero-line');
-    }
-  }
-
+  const heroLines = document.querySelectorAll('.hero-line');
   if (heroLines.length === 0) {
     console.error('GSAP target .hero-line not found.');
     return;
   }
 
-  // Reszta funkcji bez zmian...
+  // Handle video source replacement based on viewport width
   function updateVideoSources() {
     const isMobile = window.innerWidth < 992;
     const mobileMp4 = video.getAttribute('mobile-mp4');
@@ -620,19 +546,24 @@ window.heroAnimationOnLoad = function(e) {
         webmSource.setAttribute('data-src', mobileWebm);
       }
     } else {
+      // Revert to desktop sources if necessary
       mp4Source.setAttribute('data-src', mp4Source.getAttribute('data-src').replace('mobile-', ''));
       webmSource.setAttribute('data-src', webmSource.getAttribute('data-src').replace('mobile-', ''));
     }
   }
 
+  // Initial call to update video sources
   updateVideoSources();
+
+  // Add event listener for window resize to update video sources
   window.addEventListener('resize', updateVideoSources);
 
   if (video) {
+    // Prevent the video from autoplaying when lazy-loaded
     video.setAttribute('data-no-autoplay', 'true');
     video.addEventListener('loadeddata', () => {
       if (video.hasAttribute('data-no-autoplay')) {
-        video.pause();
+        video.pause(); // Ensure the video is paused if it loads
       }
     });
   }
@@ -646,6 +577,7 @@ window.heroAnimationOnLoad = function(e) {
 
     heroAnimation.to('.navbar_brand_lottie', {
       duration: 1.5,
+      // Usuń progress: 1 całkowicie
       onComplete: function() {
         console.log('Lottie animation completed');
         gsap.to('.navbar_brand_lottie', { opacity: 0, duration: 0.25 });
@@ -705,33 +637,6 @@ window.heroAnimationOnLoad = function(e) {
   console.log('Animation timeline setup completed');
 }
 
-// 4. DODAJ GLOBAL FIX dla Safari
-function initSafariFixes() {
-  const isSafari = /^((?!chrome|android).)*safari/i.test(navigator.userAgent);
-
-  if (isSafari) {
-    console.log('Safari detected - applying fixes');
-
-    // Fix dla viewport height na mobile Safari
-    const fixViewportHeight = () => {
-      const vh = window.innerHeight * 0.01;
-      document.documentElement.style.setProperty('--vh', `${vh}px`);
-    };
-
-    fixViewportHeight();
-    window.addEventListener('resize', fixViewportHeight);
-    window.addEventListener('orientationchange', () => {
-      setTimeout(fixViewportHeight, 100);
-    });
-
-    // Dodatkowy refresh ScrollTrigger po orientationchange
-    window.addEventListener('orientationchange', () => {
-      setTimeout(() => {
-        ScrollTrigger.refresh();
-      }, 300);
-    });
-  }
-}
 
 window.briefContact = function(e) {
   const button = document.querySelector('.brief-button');
@@ -2638,13 +2543,7 @@ window.Webflow.push(() => {
   console.log('The new code source is loaded!');
   initAlpine();
   lazyLoadVideos();
-  if (Webflow.env("editor") === undefined) {
-    lenisScroll();
-    lenis.start();
-  } else {
-    console.log('Editor mode ON');
-    lenis.destroy();
-  }
+
   customGsapEasing();
   reloadOnBack();
   revealFooter();