@rtstic.dev/pulse 0.0.22 → 0.0.23
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";(()=>{var a="pulse-loader-visited";function c(){return sessionStorage.getItem(a)==="true"}function T(){sessionStorage.setItem(a,"true")}function I(e,t){let o=performance.now(),n=0,s=100;function i(u){let d=u-o,r=Math.min(d/t,1),m=Math.floor(n+(s-n)*r);e.textContent=m.toString(),r<1?requestAnimationFrame(i):e.textContent="100"}requestAnimationFrame(i)}function f(e,t){e.style.width="0%",e.style.transition=`width ${t}ms linear`,requestAnimationFrame(()=>{e.style.width="100%"})}function y(e){e.style.transition="transform 500ms ease-in-out, opacity 500ms ease-in-out",e.style.transform="translateY(-100%)",setTimeout(()=>{e.style.display="none",document.body.style.overflow=""},500)}function R(e,t,o,n){document.body.style.overflow="hidden",e.style.display="flex",f(t,n),o&&I(o,n),setTimeout(()=>{y(e)},n),T()}function l(){let e=document.querySelector('[pulse-loader-ele="wrapper"]'),t=document.querySelector('[pulse-loader-ele="fill"]'),o=document.querySelector('[pulse-loader-ele="counter"]');if(!e||!t){console.error("Pulse Loader: Required elements not found");return}let s=!c()?3e3:1e3;R(e,t,o,s)}document.readyState==="loading"?document.addEventListener("DOMContentLoaded",l):l();})();
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../src/global/loader.ts"],
|
|
4
|
+
"sourcesContent": ["/**\n * Pulse Loader - A simple loading animation with first-time and return visitor variants\n * \n * HTML Structure Required:\n * <div pulse-loader-ele=\"wrapper\">\n * <div pulse-loader-ele=\"fill\"></div>\n * <div pulse-loader-ele=\"counter\">0</div>\n * </div>\n */\n\nconst FIRST_VISIT_KEY = 'pulse-loader-visited';\nconst FIRST_VISIT_DURATION = 3000; // 5 seconds\nconst RETURN_VISIT_DURATION = 1000; // 2 seconds\nconst EXIT_DURATION = 500; // 1 second for exit animation\n\n/**\n * Check if user has visited before using sessionStorage\n */\nfunction hasVisited(): boolean {\n return sessionStorage.getItem(FIRST_VISIT_KEY) === 'true';\n}\n\n/**\n * Mark the page as visited\n */\nfunction markAsVisited(): void {\n sessionStorage.setItem(FIRST_VISIT_KEY, 'true');\n}\n\n/**\n * Animate counter from 0 to 100\n */\nfunction animateCounter(counterElement: HTMLElement, duration: number): void {\n const startTime = performance.now();\n const startValue = 0;\n const endValue = 100;\n\n function updateCounter(currentTime: number): void {\n const elapsed = currentTime - startTime;\n const progress = Math.min(elapsed / duration, 1);\n const currentValue = Math.floor(startValue + (endValue - startValue) * progress);\n \n counterElement.textContent = currentValue.toString();\n\n if (progress < 1) {\n requestAnimationFrame(updateCounter);\n } else {\n counterElement.textContent = '100';\n }\n }\n\n requestAnimationFrame(updateCounter);\n}\n\n/**\n * Animate the fill element from 0 to 100% width\n */\nfunction animateFill(fillElement: HTMLElement, duration: number): void {\n fillElement.style.width = '0%';\n fillElement.style.transition = `width ${duration}ms linear`;\n\n requestAnimationFrame(() => {\n fillElement.style.width = '100%';\n });\n}\n\n/**\n * Exit the loader with smooth animation\n */\nfunction exitLoader(wrapperElement: HTMLElement): void {\n wrapperElement.style.transition = `transform ${EXIT_DURATION}ms ease-in-out, opacity ${EXIT_DURATION}ms ease-in-out`;\n wrapperElement.style.transform = 'translateY(-100%)';\n// wrapperElement.style.opacity = '0';\n\n setTimeout(() => {\n wrapperElement.style.display = 'none';\n document.body.style.overflow = '';\n }, EXIT_DURATION);\n}\n\n/**\n * Start the loading animation sequence\n */\nfunction startLoading(\n wrapperElement: HTMLElement,\n fillElement: HTMLElement,\n counterElement: HTMLElement | null,\n duration: number\n): void {\n // Hide body overflow\n document.body.style.overflow = 'hidden';\n\n // Show wrapper\n wrapperElement.style.display = 'flex';\n\n // Animate fill element\n animateFill(fillElement, duration);\n\n // Animate counter if element exists\n if (counterElement) {\n animateCounter(counterElement, duration);\n }\n\n // After load duration, exit the loader\n setTimeout(() => {\n exitLoader(wrapperElement);\n }, duration);\n\n // Mark as visited\n markAsVisited();\n}\n\n/**\n * Initialize the pulse loader\n */\nfunction initPulseLoader(): void {\n const wrapperElement = document.querySelector<HTMLElement>('[pulse-loader-ele=\"wrapper\"]');\n const fillElement = document.querySelector<HTMLElement>('[pulse-loader-ele=\"fill\"]');\n const counterElement = document.querySelector<HTMLElement>('[pulse-loader-ele=\"counter\"]');\n\n if (!wrapperElement || !fillElement) {\n console.error('Pulse Loader: Required elements not found');\n return;\n }\n\n // Determine duration based on visit status\n const isFirstVisit = !hasVisited();\n const loadDuration = isFirstVisit ? FIRST_VISIT_DURATION : RETURN_VISIT_DURATION;\n\n // Start the loading sequence\n startLoading(wrapperElement, fillElement, counterElement, loadDuration);\n}\n\n// Initialize loader when DOM is ready\nif (document.readyState === 'loading') {\n document.addEventListener('DOMContentLoaded', initPulseLoader);\n} else {\n initPulseLoader();\n}\n\n// Export for module usage\nexport { initPulseLoader };"],
|
|
5
|
+
"mappings": ";;;AAUA,MAAM,kBAAkB;AACxB,MAAM,uBAAuB;AAC7B,MAAM,wBAAwB;AAC9B,MAAM,gBAAgB;AAKtB,WAAS,aAAsB;AAC7B,WAAO,eAAe,QAAQ,eAAe,MAAM;AAAA,EACrD;AAKA,WAAS,gBAAsB;AAC7B,mBAAe,QAAQ,iBAAiB,MAAM;AAAA,EAChD;AAKA,WAAS,eAAe,gBAA6B,UAAwB;AAC3E,UAAM,YAAY,YAAY,IAAI;AAClC,UAAM,aAAa;AACnB,UAAM,WAAW;AAEjB,aAAS,cAAc,aAA2B;AAChD,YAAM,UAAU,cAAc;AAC9B,YAAM,WAAW,KAAK,IAAI,UAAU,UAAU,CAAC;AAC/C,YAAM,eAAe,KAAK,MAAM,cAAc,WAAW,cAAc,QAAQ;AAE/E,qBAAe,cAAc,aAAa,SAAS;AAEnD,UAAI,WAAW,GAAG;AAChB,8BAAsB,aAAa;AAAA,MACrC,OAAO;AACL,uBAAe,cAAc;AAAA,MAC/B;AAAA,IACF;AAEA,0BAAsB,aAAa;AAAA,EACrC;AAKA,WAAS,YAAY,aAA0B,UAAwB;AACrE,gBAAY,MAAM,QAAQ;AAC1B,gBAAY,MAAM,aAAa,SAAS,QAAQ;AAEhD,0BAAsB,MAAM;AAC1B,kBAAY,MAAM,QAAQ;AAAA,IAC5B,CAAC;AAAA,EACH;AAKA,WAAS,WAAW,gBAAmC;AACrD,mBAAe,MAAM,aAAa,aAAa,aAAa,2BAA2B,aAAa;AACpG,mBAAe,MAAM,YAAY;AAGjC,eAAW,MAAM;AACf,qBAAe,MAAM,UAAU;AAC/B,eAAS,KAAK,MAAM,WAAW;AAAA,IACjC,GAAG,aAAa;AAAA,EAClB;AAKA,WAAS,aACP,gBACA,aACA,gBACA,UACM;AAEN,aAAS,KAAK,MAAM,WAAW;AAG/B,mBAAe,MAAM,UAAU;AAG/B,gBAAY,aAAa,QAAQ;AAGjC,QAAI,gBAAgB;AAClB,qBAAe,gBAAgB,QAAQ;AAAA,IACzC;AAGA,eAAW,MAAM;AACf,iBAAW,cAAc;AAAA,IAC3B,GAAG,QAAQ;AAGX,kBAAc;AAAA,EAChB;AAKA,WAAS,kBAAwB;AAC/B,UAAM,iBAAiB,SAAS,cAA2B,8BAA8B;AACzF,UAAM,cAAc,SAAS,cAA2B,2BAA2B;AACnF,UAAM,iBAAiB,SAAS,cAA2B,8BAA8B;AAEzF,QAAI,CAAC,kBAAkB,CAAC,aAAa;AACnC,cAAQ,MAAM,2CAA2C;AACzD;AAAA,IACF;AAGA,UAAM,eAAe,CAAC,WAAW;AACjC,UAAM,eAAe,eAAe,uBAAuB;AAG3D,iBAAa,gBAAgB,aAAa,gBAAgB,YAAY;AAAA,EACxE;AAGA,MAAI,SAAS,eAAe,WAAW;AACrC,aAAS,iBAAiB,oBAAoB,eAAe;AAAA,EAC/D,OAAO;AACL,oBAAgB;AAAA,EAClB;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";(()=>{var L=e=>!!e;function
|
|
1
|
+
"use strict";(()=>{var L=e=>!!e;function h(){if(typeof window>"u")return null;let e=window.gsap;if(!e)return console.warn("window.gsap not found. Make sure GSAP is loaded globally before this code runs."),null;let o=window.ScrollTrigger||e.ScrollTrigger;return o?(e.registerPlugin(o),e):(console.warn("ScrollTrigger not found on window (or gsap). Make sure the ScrollTrigger plugin script is loaded globally."),null)}function D(){let e=h();if(!e)return;let o=document.getElementById("home-scroll");if(!o)return;let T=o.querySelector("[pulse-animation-element='hero-title']"),S=o.querySelector("[pulse-animation-element='hero-description']"),R=o.querySelector("[pulse-animation-element='hero-button']"),l=Array.from(o.querySelectorAll("[pulse-animation-element='hero-blur']")),a=o.querySelector("[pulse-animation-element='hero-blur-overlay']"),m=o.querySelector("#canvas3d"),H=document.querySelector('[pulse-animation-element="col-1-row-1-item-1"]'),M=document.querySelector('[pulse-animation-element="col-1-row-1-item-2"]'),q=document.querySelector('[pulse-animation-element="col-1-row-2-item-1"]'),C=document.querySelector('[pulse-animation-element="col-1-row-2-item-2"]'),I=document.querySelector('[pulse-animation-element="col-1-row-3-item-1"]'),b=document.querySelector('[pulse-animation-element="col-2-row-1-item-1"]'),v=document.querySelector('[pulse-animation-element="col-2-row-1-item-2"]'),V=document.querySelector('[pulse-animation-element="col-2-row-2-item-1"]'),A=document.querySelector('[pulse-animation-element="col-2-row-3-item-1"]'),G=document.querySelector('[pulse-animation-element="col-3-row-1-item-1"]'),P=document.querySelector('[pulse-animation-element="col-3-row-2-col-1-item-1"]'),W=document.querySelector('[pulse-animation-element="col-3-row-2-col-1-item-2"]'),B=document.querySelector('[pulse-animation-element="col-3-row-2-col-2-item-1"]'),O=document.querySelector('[pulse-animation-element="col-3-row-2-col-2-item-2"]'),k=document.querySelector('[pulse-animation-element="col-3-row-3-item-1"]'),j=document.querySelector('[pulse-animation-element="canvas"]'),s=document.querySelector('[pulse-animation-element="radial-gradient-wrapper"]'),n=[H,M,q,C,I,b,v,A,G,P,W,B,O,k].filter(L),r=document.querySelector('[pulse-animation-element="player-inner-elements"]'),c=document.querySelector('[pulse-animation-element="player-radius-rect"]'),i=document.querySelector('[pulse-animation-element="line-art"]');if(!c){console.warn("Player radius rect not found");return}let z=c.getTotalLength(),u=document.querySelector('[pulse-animation-element="player-handle"]'),d=document.querySelector('[pulse-animation-element="player-handle-tail"]'),p=document.querySelector('[pulse-animation-element="handle-wrapper"]'),y=Array.from(document.querySelectorAll('[pulse-animation-element="vignette"]')),x=document.querySelector('[pulse-animation-element="torch-wrapper"]'),f=document.querySelector('[pulse-animation-element="torch"]'),w=document.querySelector('[pulse-animation-element="launch-button"]'),g=document.querySelector('[pulse-animation-element="launch-title"]'),t=e.timeline({defaults:{ease:"power2.out",duration:1},scrollTrigger:{trigger:o,start:"top bottom",end:"bottom top",scrub:!0,invalidateOnRefresh:!0}});l.length&&e.set(l,{yPercent:32,opacity:1}),a&&e.set(a,{y:0,opacity:1}),s&&e.set(s,{opacity:0}),t.addLabel("start",0),T&&t.fromTo(T,{y:1100},{y:-400,ease:"power2.out",duration:1.2,immediateRender:!1},"start+=0.1"),S&&t.fromTo(S,{y:680},{y:-400,ease:"power2.out",duration:1.2,immediateRender:!1},"start+=0.2"),R&&t.fromTo(R,{y:440},{y:-480,ease:"power2.out",duration:1.2,immediateRender:!1},"start+=0.3"),l.length&&t.to(l,{yPercent:-100,opacity:0,ease:"power2.out",duration:1.2,delay:.2,immediateRender:!1},"start+=0.2"),a&&t.to(a,{y:-1200,ease:"power2.out",duration:1,delay:.2,immediateRender:!1},"start+=0.2");let E=[T,S,R].filter(L);E.length&&(t.to(E,{scale:.95,duration:.8,ease:"power2.out",immediateRender:!1},"start+=0.4"),t.to(E,{opacity:0,duration:.2,delay:.2,ease:"power2.out",immediateRender:!1},"start+=0.35")),n.length&&e.set(n,{opacity:0,scale:()=>e.utils.random(.5,.95),y:()=>e.utils.random(40,60)}),r&&e.set(r,{scale:.8}),e.set(c,{opacity:0}),i&&e.set(i,{opacity:0,scale:.5}),m&&e.set(m,{height:"auto"}),u&&e.set(u,{rotation:-10}),d&&e.set(d,{rotation:-10}),p&&e.set(p,{scale:.8,opacity:0}),g&&e.set(g,{y:50,opacity:0,scale:.95}),w&&e.set(w,{y:0,opacity:0,scale:.95}),y.length&&e.set(y,{opacity:0}),f&&e.set(f,{opacity:0}),t.addLabel("grid-in","start+=0.5"),n.length&&(t.to(n,{scale:1,y:0,ease:"power2.out",duration:()=>e.utils.random(.4,.8),stagger:{amount:.1,from:"random"},immediateRender:!1},"grid-in"),t.to(n,{opacity:1,ease:"power2.out",duration:()=>e.utils.random(.2,.4),stagger:{amount:.1,from:"random"},immediateRender:!1},"grid-in")),m&&t.to(m,{height:"100%",ease:"power2.out",duration:.5,immediateRender:!1},"grid-in"),r&&(t.to(r,{scale:1,ease:"power2.out",duration:.3,immediateRender:!1},"grid-in"),t.to(r,{opacity:1,ease:"power2.out",duration:.1,immediateRender:!1},"grid-in+=0.1")),i&&(t.fromTo(i,{opacity:0},{opacity:1,ease:"power2.out",duration:.2,immediateRender:!1},"grid-in+=0.1"),t.fromTo(i,{scale:.5},{scale:1,ease:"power2.out",duration:.5,immediateRender:!1},"grid-in+=0.2")),t.to(c,{opacity:1,ease:"power2.out",duration:.3,immediateRender:!1},"grid-in+=0.3"),u&&d&&p&&(t.to(p,{opacity:1,scale:1,duration:.1,ease:"power2.out",immediateRender:!1},"grid-in+=0.4"),t.to(u,{rotation:30,duration:.5,ease:"power2.out",immediateRender:!1},"grid-in+=0.4"),t.to(d,{rotation:30,duration:.5,ease:"power2.out",immediateRender:!1},"grid-in+=0.4")),g&&t.to(g,{y:0,opacity:1,scale:1,duration:.2,ease:"power2.out",immediateRender:!1},"grid-in+=0.35"),w&&t.to(w,{y:0,opacity:1,scale:1,duration:.2,ease:"power2.out",immediateRender:!1},"grid-in+=0.45"),s&&t.to(s,{opacity:1,duration:.1,ease:"power2.out",immediateRender:!1},"grid-in+=0.4"),y.length&&t.to(y,{opacity:1,duration:.2,ease:"power2.out",immediateRender:!1},"grid-in+=0.4"),f&&t.to(f,{opacity:1,duration:.2,ease:"power2.out",immediateRender:!1},"grid-in+=0.4"),n.length&&t.to(n,{opacity:.8,ease:"power2.out",duration:.2,stagger:{amount:.1,from:"random"},immediateRender:!1},"grid-in+=0.30")}typeof window<"u"&&(window.addEventListener("DOMContentLoaded",()=>{D()}),window.addEventListener("load",()=>{let e=h();if(!e)return;let o=window.ScrollTrigger||e.ScrollTrigger;o&&o.refresh&&o.refresh()}));})();
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/home/hero-animation/scroll.ts"],
|
|
4
|
-
"sourcesContent": ["// animations/homeScroll.ts\n\n/**\n * Uses GSAP + ScrollTrigger from window (global scripts).\n * No imports. Ensures ScrollTrigger is registered on the SAME gsap instance.\n */\n\ndeclare global {\n interface Window {\n gsap?: any;\n ScrollTrigger?: any;\n }\n}\n\n/**\n * Helper: filter out null/undefined so GSAP never receives them.\n */\nconst isEl = <T extends Element>(v: T | null | undefined): v is T => Boolean(v);\n\n/**\n * Ensure global gsap + ScrollTrigger exist and are registered.\n * Returns the gsap instance or null.\n */\nfunction getGlobalGsap(): any | null {\n if (typeof window === \"undefined\") return null;\n\n const gsap = window.gsap;\n if (!gsap) {\n console.warn(\"window.gsap not found. Make sure GSAP is loaded globally before this code runs.\");\n return null;\n }\n\n const ScrollTrigger = window.ScrollTrigger || gsap.ScrollTrigger;\n if (!ScrollTrigger) {\n console.warn(\n \"ScrollTrigger not found on window (or gsap). Make sure the ScrollTrigger plugin script is loaded globally.\"\n );\n return null;\n }\n\n // Register once (safe to call multiple times)\n gsap.registerPlugin(ScrollTrigger);\n return gsap;\n}\n\n/* ============================================================================\n * initHomeScrollAnimation\n * ==========================================================================*/\nexport function initHomeScrollAnimation(): void {\n const gsap = getGlobalGsap();\n if (!gsap) return;\n\n /* --------------------------------- Guards -------------------------------- */\n const section = document.getElementById(\"home-scroll\");\n if (!section) return;\n\n /* ------------------------------ Hero Elements ---------------------------- */\n const title = section.querySelector<HTMLElement>(\n \"[pulse-animation-element='hero-title']\"\n );\n const description = section.querySelector<HTMLElement>(\n \"[pulse-animation-element='hero-description']\"\n );\n const button = section.querySelector<HTMLElement>(\n \"[pulse-animation-element='hero-button']\"\n );\n const blurs = Array.from(\n section.querySelectorAll<HTMLElement>(\"[pulse-animation-element='hero-blur']\")\n );\n\n const blurOverlay = section.querySelector<HTMLElement>(\n \"[pulse-animation-element='hero-blur-overlay']\"\n );\n const canvas3d = section.querySelector<HTMLElement>(\"#canvas3d\");\n\n /* ------------------------------ Grid Elements ---------------------------- */\n const Col1Row1Item1 = document.querySelector<HTMLElement>(\n '[pulse-animation-element=\"col-1-row-1-item-1\"]'\n );\n const Col1Row1Item2 = document.querySelector<HTMLElement>(\n '[pulse-animation-element=\"col-1-row-1-item-2\"]'\n );\n const Col1Row2Item1 = document.querySelector<HTMLElement>(\n '[pulse-animation-element=\"col-1-row-2-item-1\"]'\n );\n const Col1Row2Item2 = document.querySelector<HTMLElement>(\n '[pulse-animation-element=\"col-1-row-2-item-2\"]'\n );\n const Col1Row3Item1 = document.querySelector<HTMLElement>(\n '[pulse-animation-element=\"col-1-row-3-item-1\"]'\n );\n const Col2Row1Item1 = document.querySelector<HTMLElement>(\n '[pulse-animation-element=\"col-2-row-1-item-1\"]'\n );\n const Col2Row1Item2 = document.querySelector<HTMLElement>(\n '[pulse-animation-element=\"col-2-row-1-item-2\"]'\n );\n const Col2Row2Item1 = document.querySelector<HTMLElement>(\n '[pulse-animation-element=\"col-2-row-2-item-1\"]'\n );\n const col2Row3Item1 = document.querySelector<HTMLElement>(\n '[pulse-animation-element=\"col-2-row-3-item-1\"]'\n );\n const Col3Row1Item1 = document.querySelector<HTMLElement>(\n '[pulse-animation-element=\"col-3-row-1-item-1\"]'\n );\n const Col3Row2Col1Item1 = document.querySelector<HTMLElement>(\n '[pulse-animation-element=\"col-3-row-2-col-1-item-1\"]'\n );\n const Col3Row2Col1Item2 = document.querySelector<HTMLElement>(\n '[pulse-animation-element=\"col-3-row-2-col-1-item-2\"]'\n );\n const Col3Row2Col2Item1 = document.querySelector<HTMLElement>(\n '[pulse-animation-element=\"col-3-row-2-col-2-item-1\"]'\n );\n const Col3Row2Col2Item2 = document.querySelector<HTMLElement>(\n '[pulse-animation-element=\"col-3-row-2-col-2-item-2\"]'\n );\n const Col3Row3Item1 = document.querySelector<HTMLElement>(\n '[pulse-animation-element=\"col-3-row-3-item-1\"]'\n );\n\n const canvasElement = document.querySelector<HTMLElement>(\n '[pulse-animation-element=\"canvas\"]'\n );\n const radialGradientWrapper = document.querySelector<HTMLElement>(\n '[pulse-animation-element=\"radial-gradient-wrapper\"]'\n );\n\n // collect grid items (filter out nulls)\n const gridItems = [\n Col1Row1Item1,\n Col1Row1Item2,\n Col1Row2Item1,\n Col1Row2Item2,\n Col1Row3Item1,\n Col2Row1Item1,\n Col2Row1Item2,\n // Col2Row2Item1, // intentionally not part of gridItems in your original code\n col2Row3Item1,\n Col3Row1Item1,\n Col3Row2Col1Item1,\n Col3Row2Col1Item2,\n Col3Row2Col2Item1,\n Col3Row2Col2Item2,\n Col3Row3Item1,\n ].filter(isEl);\n\n /* ----------------------------- Player Elements --------------------------- */\n // const playerPositionElement = Col2Row2Item1;\n\n const playerInnerElements = document.querySelector<HTMLElement>(\n '[pulse-animation-element=\"player-inner-elements\"]'\n );\n const playerRadiusRect = document.querySelector<SVGRectElement>(\n '[pulse-animation-element=\"player-radius-rect\"]'\n );\n const lineArt = document.querySelector<HTMLElement>(\n '[pulse-animation-element=\"line-art\"]'\n );\n\n if (!playerRadiusRect) {\n console.warn(\"Player radius rect not found\");\n return;\n }\n const length = playerRadiusRect.getTotalLength();\n\n const playerHandle = document.querySelector<HTMLElement>(\n '[pulse-animation-element=\"player-handle\"]'\n );\n const playerHandlerTail = document.querySelector<HTMLElement>(\n '[pulse-animation-element=\"player-handle-tail\"]'\n );\n const playerHandleWrapper = document.querySelector<HTMLElement>(\n '[pulse-animation-element=\"handle-wrapper\"]'\n );\n\n const vignette = Array.from(\n document.querySelectorAll<HTMLElement>('[pulse-animation-element=\"vignette\"]')\n );\n\n const torchWrapper = document.querySelector<HTMLElement>(\n '[pulse-animation-element=\"torch-wrapper\"]'\n );\n const torch = document.querySelector<HTMLElement>(\n '[pulse-animation-element=\"torch\"]'\n );\n\n const launchButton = document.querySelector<HTMLElement>(\n '[pulse-animation-element=\"launch-button\"]'\n );\n const launchTitle = document.querySelector<HTMLElement>(\n '[pulse-animation-element=\"launch-title\"]'\n );\n\n console.log(\"playerHandle:\", playerHandle);\n // console.log(\"Player position element:\", playerPositionElement);\n\n /* ------------------------------ Timeline Setup --------------------------- */\n const tl = gsap.timeline({\n defaults: { ease: \"power2.out\", duration: 1 },\n scrollTrigger: {\n trigger: section,\n start: \"top bottom\",\n end: \"bottom top\",\n scrub: true,\n invalidateOnRefresh: true,\n // markers: true,\n },\n });\n\n /* ------------------------------- Initial Sets ---------------------------- */\n if (blurs.length) gsap.set(blurs, { yPercent: 32, opacity: 1 });\n if (blurOverlay) gsap.set(blurOverlay, { y: 0, opacity: 1 });\n if (radialGradientWrapper) gsap.set(radialGradientWrapper, { opacity: 0 });\n\n /* --------------------------- Start: Hero Out & Blur ---------------------- */\n tl.addLabel(\"start\", 0);\n\n if (title) {\n tl.fromTo(\n title,\n { y: 1100 },\n { y: -400, ease: \"power2.out\", duration: 1.2, immediateRender: false },\n \"start+=0.1\"\n );\n }\n\n if (description) {\n tl.fromTo(\n description,\n { y: 680 },\n { y: -400, ease: \"power2.out\", duration: 1.2, immediateRender: false },\n \"start+=0.2\"\n );\n }\n\n if (button) {\n tl.fromTo(\n button,\n { y: 440 },\n { y: -480, ease: \"power2.out\", duration: 1.2, immediateRender: false },\n \"start+=0.3\"\n );\n }\n\n if (blurs.length) {\n tl.to(\n blurs,\n {\n yPercent: -100,\n opacity: 0,\n ease: \"power2.out\",\n duration: 1.2,\n delay: 0.2,\n immediateRender: false,\n },\n \"start+=0.2\"\n );\n }\n\n if (blurOverlay) {\n tl.to(\n blurOverlay,\n {\n y: -1200,\n ease: \"power2.out\",\n duration: 1,\n delay: 0.2,\n immediateRender: false,\n },\n \"start+=0.2\"\n );\n }\n\n const heroTargets = [title, description, button].filter(isEl);\n if (heroTargets.length) {\n tl.to(\n heroTargets,\n {\n scale: 0.95,\n duration: 0.8,\n ease: \"power2.out\",\n immediateRender: false,\n },\n \"start+=0.4\"\n );\n\n tl.to(\n heroTargets,\n {\n opacity: 0,\n duration: 0.2,\n delay: 0.2,\n ease: \"power2.out\",\n immediateRender: false,\n },\n \"start+=0.35\"\n );\n }\n\n /* ----------------------------- Grid: Initial ----------------------------- */\n if (gridItems.length) {\n gsap.set(gridItems, {\n opacity: 0,\n scale: () => gsap.utils.random(0.5, 0.95),\n y: () => gsap.utils.random(40, 60),\n });\n }\n\n // if (playerPositionElement) gsap.set(playerPositionElement, { opacity: 1, scale: 0.5 });\n if (playerInnerElements) gsap.set(playerInnerElements, { scale: 0.8 });\n gsap.set(playerRadiusRect, { opacity: 0 });\n if (lineArt) gsap.set(lineArt, { opacity: 0, scale: 0.5 });\n if (canvas3d) gsap.set(canvas3d, { height: \"auto\" });\n if (playerHandle) gsap.set(playerHandle, { rotation: -10 });\n if (playerHandlerTail) gsap.set(playerHandlerTail, { rotation: -10 });\n if (playerHandleWrapper) gsap.set(playerHandleWrapper, { scale: 0.8, opacity: 0 });\n if (launchTitle) gsap.set(launchTitle, { y: 50, opacity: 0, scale: 0.95 });\n if (launchButton) gsap.set(launchButton, { y: 0, opacity: 0, scale: 0.95 });\n if (vignette.length) gsap.set(vignette, { opacity: 0 });\n if (torch) gsap.set(torch, { opacity: 0 });\n\n /* ------------------------------- Grid: In -------------------------------- */\n tl.addLabel(\"grid-in\", \"start+=0.5\");\n\n if (gridItems.length) {\n tl.to(\n gridItems,\n {\n scale: 1,\n y: 0,\n ease: \"power2.out\",\n duration: () => gsap.utils.random(0.4, 0.8),\n stagger: { amount: 0.1, from: \"random\" },\n immediateRender: false,\n },\n \"grid-in\"\n );\n\n tl.to(\n gridItems,\n {\n opacity: 1,\n ease: \"power2.out\",\n duration: () => gsap.utils.random(0.2, 0.4),\n stagger: { amount: 0.1, from: \"random\" },\n immediateRender: false,\n },\n \"grid-in\"\n );\n }\n\n if (canvas3d) {\n tl.to(\n canvas3d,\n { height: \"100%\", ease: \"power2.out\", duration: 0.5, immediateRender: false },\n \"grid-in\"\n );\n }\n\n // if (playerPositionElement) {\n // tl.to(\n // playerPositionElement,\n // { opacity: 1, scale: 1, ease: \"power2.out\", duration: 0.3, immediateRender: false },\n // \"grid-in\"\n // );\n // }\n\n if (playerInnerElements) {\n tl.to(\n playerInnerElements,\n { scale: 1, ease: \"power2.out\", duration: 0.3, immediateRender: false },\n \"grid-in\"\n );\n tl.to(\n playerInnerElements,\n { opacity: 1, ease: \"power2.out\", duration: 0.1, immediateRender: false },\n \"grid-in+=0.1\"\n );\n }\n\n if (lineArt) {\n tl.fromTo(\n lineArt,\n { opacity: 0 },\n { opacity: 1, ease: \"power2.out\", duration: 0.2, immediateRender: false },\n \"grid-in+=0.1\"\n );\n\n tl.fromTo(\n lineArt,\n { scale: 0.5 },\n { scale: 1, ease: \"power2.out\", duration: 0.5, immediateRender: false },\n \"grid-in+=0.2\"\n );\n }\n\n tl.to(\n playerRadiusRect,\n { opacity: 1, ease: \"power2.out\", duration: 0.3, immediateRender: false },\n \"grid-in+=0.3\"\n );\n\n if (playerHandle && playerHandlerTail && playerHandleWrapper) {\n tl.to(\n playerHandleWrapper,\n { opacity: 1, scale: 1, duration: 0.1, ease: \"power2.out\", immediateRender: false },\n \"grid-in+=0.4\"\n );\n tl.to(\n playerHandle,\n { rotation: 30, duration: 0.5, ease: \"power2.out\", immediateRender: false },\n \"grid-in+=0.4\"\n );\n tl.to(\n playerHandlerTail,\n { rotation: 30, duration: 0.5, ease: \"power2.out\", immediateRender: false },\n \"grid-in+=0.4\"\n );\n }\n\n if (launchTitle) {\n tl.to(\n launchTitle,\n { y: 0, opacity: 1, scale: 1, duration: 0.2, ease: \"power2.out\", immediateRender: false },\n \"grid-in+=0.35\"\n );\n }\n\n if (launchButton) {\n tl.to(\n launchButton,\n { y: 0, opacity: 1, scale: 1, duration: 0.2, ease: \"power2.out\", immediateRender: false },\n \"grid-in+=0.45\"\n );\n }\n\n if (radialGradientWrapper) {\n tl.to(\n radialGradientWrapper,\n { opacity: 1, duration: 0.1, ease: \"power2.out\", immediateRender: false },\n \"grid-in+=0.4\"\n );\n }\n\n if (vignette.length) {\n tl.to(\n vignette,\n { opacity: 1, duration: 0.2, ease: \"power2.out\", immediateRender: false },\n \"grid-in+=0.4\"\n );\n }\n\n if (torchWrapper) {\n // kept commented out as in your original\n // tl.to(torchWrapper, { opacity: 1, duration: 0.2, ease: \"power2.out\", immediateRender: false }, \"grid-in+=0.4\");\n }\n\n if (torch) {\n tl.to(\n torch,\n { opacity: 1, duration: 0.2, ease: \"power2.out\", immediateRender: false },\n \"grid-in+=0.4\"\n );\n }\n\n if (gridItems.length) {\n tl.to(\n gridItems,\n {\n opacity: 0.8,\n ease: \"power2.out\",\n duration: 0.2,\n stagger: { amount: 0.1, from: \"random\" },\n immediateRender: false,\n },\n \"grid-in+=0.30\"\n );\n }\n}\n\n/* --------------------------------- Auto-Init ------------------------------- */\nif (typeof window !== \"undefined\") {\n window.addEventListener(\"DOMContentLoaded\", () => {\n initHomeScrollAnimation();\n });\n\n window.addEventListener(\"load\", () => {\n const gsap = getGlobalGsap();\n if (!gsap) return;\n\n const ScrollTrigger = window.ScrollTrigger || gsap.ScrollTrigger;\n if (ScrollTrigger && ScrollTrigger.refresh) ScrollTrigger.refresh();\n });\n}"],
|
|
5
|
-
"mappings": "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
|
|
4
|
+
"sourcesContent": ["// animations/homeScroll.ts\n\n/**\n * Uses GSAP + ScrollTrigger from window (global scripts).\n * No imports. Ensures ScrollTrigger is registered on the SAME gsap instance.\n */\n\ndeclare global {\n interface Window {\n gsap?: any;\n ScrollTrigger?: any;\n }\n}\n\n/**\n * Helper: filter out null/undefined so GSAP never receives them.\n */\nconst isEl = <T extends Element>(v: T | null | undefined): v is T => Boolean(v);\n\n/**\n * Ensure global gsap + ScrollTrigger exist and are registered.\n * Returns the gsap instance or null.\n */\nfunction getGlobalGsap(): any | null {\n if (typeof window === \"undefined\") return null;\n\n const gsap = window.gsap;\n if (!gsap) {\n console.warn(\"window.gsap not found. Make sure GSAP is loaded globally before this code runs.\");\n return null;\n }\n\n const ScrollTrigger = window.ScrollTrigger || gsap.ScrollTrigger;\n if (!ScrollTrigger) {\n console.warn(\n \"ScrollTrigger not found on window (or gsap). Make sure the ScrollTrigger plugin script is loaded globally.\"\n );\n return null;\n }\n\n // Register once (safe to call multiple times)\n gsap.registerPlugin(ScrollTrigger);\n return gsap;\n}\n\n/* ============================================================================\n * initHomeScrollAnimation\n * ==========================================================================*/\nexport function initHomeScrollAnimation(): void {\n const gsap = getGlobalGsap();\n if (!gsap) return;\n\n /* --------------------------------- Guards -------------------------------- */\n const section = document.getElementById(\"home-scroll\");\n if (!section) return;\n\n /* ------------------------------ Hero Elements ---------------------------- */\n const title = section.querySelector<HTMLElement>(\n \"[pulse-animation-element='hero-title']\"\n );\n const description = section.querySelector<HTMLElement>(\n \"[pulse-animation-element='hero-description']\"\n );\n const button = section.querySelector<HTMLElement>(\n \"[pulse-animation-element='hero-button']\"\n );\n const blurs = Array.from(\n section.querySelectorAll<HTMLElement>(\"[pulse-animation-element='hero-blur']\")\n );\n\n const blurOverlay = section.querySelector<HTMLElement>(\n \"[pulse-animation-element='hero-blur-overlay']\"\n );\n const canvas3d = section.querySelector<HTMLElement>(\"#canvas3d\");\n\n /* ------------------------------ Grid Elements ---------------------------- */\n const Col1Row1Item1 = document.querySelector<HTMLElement>(\n '[pulse-animation-element=\"col-1-row-1-item-1\"]'\n );\n const Col1Row1Item2 = document.querySelector<HTMLElement>(\n '[pulse-animation-element=\"col-1-row-1-item-2\"]'\n );\n const Col1Row2Item1 = document.querySelector<HTMLElement>(\n '[pulse-animation-element=\"col-1-row-2-item-1\"]'\n );\n const Col1Row2Item2 = document.querySelector<HTMLElement>(\n '[pulse-animation-element=\"col-1-row-2-item-2\"]'\n );\n const Col1Row3Item1 = document.querySelector<HTMLElement>(\n '[pulse-animation-element=\"col-1-row-3-item-1\"]'\n );\n const Col2Row1Item1 = document.querySelector<HTMLElement>(\n '[pulse-animation-element=\"col-2-row-1-item-1\"]'\n );\n const Col2Row1Item2 = document.querySelector<HTMLElement>(\n '[pulse-animation-element=\"col-2-row-1-item-2\"]'\n );\n const Col2Row2Item1 = document.querySelector<HTMLElement>(\n '[pulse-animation-element=\"col-2-row-2-item-1\"]'\n );\n const col2Row3Item1 = document.querySelector<HTMLElement>(\n '[pulse-animation-element=\"col-2-row-3-item-1\"]'\n );\n const Col3Row1Item1 = document.querySelector<HTMLElement>(\n '[pulse-animation-element=\"col-3-row-1-item-1\"]'\n );\n const Col3Row2Col1Item1 = document.querySelector<HTMLElement>(\n '[pulse-animation-element=\"col-3-row-2-col-1-item-1\"]'\n );\n const Col3Row2Col1Item2 = document.querySelector<HTMLElement>(\n '[pulse-animation-element=\"col-3-row-2-col-1-item-2\"]'\n );\n const Col3Row2Col2Item1 = document.querySelector<HTMLElement>(\n '[pulse-animation-element=\"col-3-row-2-col-2-item-1\"]'\n );\n const Col3Row2Col2Item2 = document.querySelector<HTMLElement>(\n '[pulse-animation-element=\"col-3-row-2-col-2-item-2\"]'\n );\n const Col3Row3Item1 = document.querySelector<HTMLElement>(\n '[pulse-animation-element=\"col-3-row-3-item-1\"]'\n );\n\n const canvasElement = document.querySelector<HTMLElement>(\n '[pulse-animation-element=\"canvas\"]'\n );\n const radialGradientWrapper = document.querySelector<HTMLElement>(\n '[pulse-animation-element=\"radial-gradient-wrapper\"]'\n );\n\n // collect grid items (filter out nulls)\n const gridItems = [\n Col1Row1Item1,\n Col1Row1Item2,\n Col1Row2Item1,\n Col1Row2Item2,\n Col1Row3Item1,\n Col2Row1Item1,\n Col2Row1Item2,\n // Col2Row2Item1, // intentionally not part of gridItems in your original code\n col2Row3Item1,\n Col3Row1Item1,\n Col3Row2Col1Item1,\n Col3Row2Col1Item2,\n Col3Row2Col2Item1,\n Col3Row2Col2Item2,\n Col3Row3Item1,\n ].filter(isEl);\n\n /* ----------------------------- Player Elements --------------------------- */\n // const playerPositionElement = Col2Row2Item1;\n\n const playerInnerElements = document.querySelector<HTMLElement>(\n '[pulse-animation-element=\"player-inner-elements\"]'\n );\n const playerRadiusRect = document.querySelector<SVGRectElement>(\n '[pulse-animation-element=\"player-radius-rect\"]'\n );\n const lineArt = document.querySelector<HTMLElement>(\n '[pulse-animation-element=\"line-art\"]'\n );\n\n if (!playerRadiusRect) {\n console.warn(\"Player radius rect not found\");\n return;\n }\n const length = playerRadiusRect.getTotalLength();\n\n const playerHandle = document.querySelector<HTMLElement>(\n '[pulse-animation-element=\"player-handle\"]'\n );\n const playerHandlerTail = document.querySelector<HTMLElement>(\n '[pulse-animation-element=\"player-handle-tail\"]'\n );\n const playerHandleWrapper = document.querySelector<HTMLElement>(\n '[pulse-animation-element=\"handle-wrapper\"]'\n );\n\n const vignette = Array.from(\n document.querySelectorAll<HTMLElement>('[pulse-animation-element=\"vignette\"]')\n );\n\n const torchWrapper = document.querySelector<HTMLElement>(\n '[pulse-animation-element=\"torch-wrapper\"]'\n );\n const torch = document.querySelector<HTMLElement>(\n '[pulse-animation-element=\"torch\"]'\n );\n\n const launchButton = document.querySelector<HTMLElement>(\n '[pulse-animation-element=\"launch-button\"]'\n );\n const launchTitle = document.querySelector<HTMLElement>(\n '[pulse-animation-element=\"launch-title\"]'\n );\n\n // console.log(\"playerHandle:\", playerHandle);\n // console.log(\"Player position element:\", playerPositionElement);\n\n /* ------------------------------ Timeline Setup --------------------------- */\n const tl = gsap.timeline({\n defaults: { ease: \"power2.out\", duration: 1 },\n scrollTrigger: {\n trigger: section,\n start: \"top bottom\",\n end: \"bottom top\",\n scrub: true,\n invalidateOnRefresh: true,\n // markers: true,\n },\n });\n\n /* ------------------------------- Initial Sets ---------------------------- */\n if (blurs.length) gsap.set(blurs, { yPercent: 32, opacity: 1 });\n if (blurOverlay) gsap.set(blurOverlay, { y: 0, opacity: 1 });\n if (radialGradientWrapper) gsap.set(radialGradientWrapper, { opacity: 0 });\n\n /* --------------------------- Start: Hero Out & Blur ---------------------- */\n tl.addLabel(\"start\", 0);\n\n if (title) {\n tl.fromTo(\n title,\n { y: 1100 },\n { y: -400, ease: \"power2.out\", duration: 1.2, immediateRender: false },\n \"start+=0.1\"\n );\n }\n\n if (description) {\n tl.fromTo(\n description,\n { y: 680 },\n { y: -400, ease: \"power2.out\", duration: 1.2, immediateRender: false },\n \"start+=0.2\"\n );\n }\n\n if (button) {\n tl.fromTo(\n button,\n { y: 440 },\n { y: -480, ease: \"power2.out\", duration: 1.2, immediateRender: false },\n \"start+=0.3\"\n );\n }\n\n if (blurs.length) {\n tl.to(\n blurs,\n {\n yPercent: -100,\n opacity: 0,\n ease: \"power2.out\",\n duration: 1.2,\n delay: 0.2,\n immediateRender: false,\n },\n \"start+=0.2\"\n );\n }\n\n if (blurOverlay) {\n tl.to(\n blurOverlay,\n {\n y: -1200,\n ease: \"power2.out\",\n duration: 1,\n delay: 0.2,\n immediateRender: false,\n },\n \"start+=0.2\"\n );\n }\n\n const heroTargets = [title, description, button].filter(isEl);\n if (heroTargets.length) {\n tl.to(\n heroTargets,\n {\n scale: 0.95,\n duration: 0.8,\n ease: \"power2.out\",\n immediateRender: false,\n },\n \"start+=0.4\"\n );\n\n tl.to(\n heroTargets,\n {\n opacity: 0,\n duration: 0.2,\n delay: 0.2,\n ease: \"power2.out\",\n immediateRender: false,\n },\n \"start+=0.35\"\n );\n }\n\n /* ----------------------------- Grid: Initial ----------------------------- */\n if (gridItems.length) {\n gsap.set(gridItems, {\n opacity: 0,\n scale: () => gsap.utils.random(0.5, 0.95),\n y: () => gsap.utils.random(40, 60),\n });\n }\n\n // if (playerPositionElement) gsap.set(playerPositionElement, { opacity: 1, scale: 0.5 });\n if (playerInnerElements) gsap.set(playerInnerElements, { scale: 0.8 });\n gsap.set(playerRadiusRect, { opacity: 0 });\n if (lineArt) gsap.set(lineArt, { opacity: 0, scale: 0.5 });\n if (canvas3d) gsap.set(canvas3d, { height: \"auto\" });\n if (playerHandle) gsap.set(playerHandle, { rotation: -10 });\n if (playerHandlerTail) gsap.set(playerHandlerTail, { rotation: -10 });\n if (playerHandleWrapper) gsap.set(playerHandleWrapper, { scale: 0.8, opacity: 0 });\n if (launchTitle) gsap.set(launchTitle, { y: 50, opacity: 0, scale: 0.95 });\n if (launchButton) gsap.set(launchButton, { y: 0, opacity: 0, scale: 0.95 });\n if (vignette.length) gsap.set(vignette, { opacity: 0 });\n if (torch) gsap.set(torch, { opacity: 0 });\n\n /* ------------------------------- Grid: In -------------------------------- */\n tl.addLabel(\"grid-in\", \"start+=0.5\");\n\n if (gridItems.length) {\n tl.to(\n gridItems,\n {\n scale: 1,\n y: 0,\n ease: \"power2.out\",\n duration: () => gsap.utils.random(0.4, 0.8),\n stagger: { amount: 0.1, from: \"random\" },\n immediateRender: false,\n },\n \"grid-in\"\n );\n\n tl.to(\n gridItems,\n {\n opacity: 1,\n ease: \"power2.out\",\n duration: () => gsap.utils.random(0.2, 0.4),\n stagger: { amount: 0.1, from: \"random\" },\n immediateRender: false,\n },\n \"grid-in\"\n );\n }\n\n if (canvas3d) {\n tl.to(\n canvas3d,\n { height: \"100%\", ease: \"power2.out\", duration: 0.5, immediateRender: false },\n \"grid-in\"\n );\n }\n\n // if (playerPositionElement) {\n // tl.to(\n // playerPositionElement,\n // { opacity: 1, scale: 1, ease: \"power2.out\", duration: 0.3, immediateRender: false },\n // \"grid-in\"\n // );\n // }\n\n if (playerInnerElements) {\n tl.to(\n playerInnerElements,\n { scale: 1, ease: \"power2.out\", duration: 0.3, immediateRender: false },\n \"grid-in\"\n );\n tl.to(\n playerInnerElements,\n { opacity: 1, ease: \"power2.out\", duration: 0.1, immediateRender: false },\n \"grid-in+=0.1\"\n );\n }\n\n if (lineArt) {\n tl.fromTo(\n lineArt,\n { opacity: 0 },\n { opacity: 1, ease: \"power2.out\", duration: 0.2, immediateRender: false },\n \"grid-in+=0.1\"\n );\n\n tl.fromTo(\n lineArt,\n { scale: 0.5 },\n { scale: 1, ease: \"power2.out\", duration: 0.5, immediateRender: false },\n \"grid-in+=0.2\"\n );\n }\n\n tl.to(\n playerRadiusRect,\n { opacity: 1, ease: \"power2.out\", duration: 0.3, immediateRender: false },\n \"grid-in+=0.3\"\n );\n\n if (playerHandle && playerHandlerTail && playerHandleWrapper) {\n tl.to(\n playerHandleWrapper,\n { opacity: 1, scale: 1, duration: 0.1, ease: \"power2.out\", immediateRender: false },\n \"grid-in+=0.4\"\n );\n tl.to(\n playerHandle,\n { rotation: 30, duration: 0.5, ease: \"power2.out\", immediateRender: false },\n \"grid-in+=0.4\"\n );\n tl.to(\n playerHandlerTail,\n { rotation: 30, duration: 0.5, ease: \"power2.out\", immediateRender: false },\n \"grid-in+=0.4\"\n );\n }\n\n if (launchTitle) {\n tl.to(\n launchTitle,\n { y: 0, opacity: 1, scale: 1, duration: 0.2, ease: \"power2.out\", immediateRender: false },\n \"grid-in+=0.35\"\n );\n }\n\n if (launchButton) {\n tl.to(\n launchButton,\n { y: 0, opacity: 1, scale: 1, duration: 0.2, ease: \"power2.out\", immediateRender: false },\n \"grid-in+=0.45\"\n );\n }\n\n if (radialGradientWrapper) {\n tl.to(\n radialGradientWrapper,\n { opacity: 1, duration: 0.1, ease: \"power2.out\", immediateRender: false },\n \"grid-in+=0.4\"\n );\n }\n\n if (vignette.length) {\n tl.to(\n vignette,\n { opacity: 1, duration: 0.2, ease: \"power2.out\", immediateRender: false },\n \"grid-in+=0.4\"\n );\n }\n\n if (torchWrapper) {\n // kept commented out as in your original\n // tl.to(torchWrapper, { opacity: 1, duration: 0.2, ease: \"power2.out\", immediateRender: false }, \"grid-in+=0.4\");\n }\n\n if (torch) {\n tl.to(\n torch,\n { opacity: 1, duration: 0.2, ease: \"power2.out\", immediateRender: false },\n \"grid-in+=0.4\"\n );\n }\n\n if (gridItems.length) {\n tl.to(\n gridItems,\n {\n opacity: 0.8,\n ease: \"power2.out\",\n duration: 0.2,\n stagger: { amount: 0.1, from: \"random\" },\n immediateRender: false,\n },\n \"grid-in+=0.30\"\n );\n }\n}\n\n/* --------------------------------- Auto-Init ------------------------------- */\nif (typeof window !== \"undefined\") {\n window.addEventListener(\"DOMContentLoaded\", () => {\n initHomeScrollAnimation();\n });\n\n window.addEventListener(\"load\", () => {\n const gsap = getGlobalGsap();\n if (!gsap) return;\n\n const ScrollTrigger = window.ScrollTrigger || gsap.ScrollTrigger;\n if (ScrollTrigger && ScrollTrigger.refresh) ScrollTrigger.refresh();\n });\n}"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";(()=>{function g(){return new Promise((r,
|
|
1
|
+
"use strict";(()=>{function g(){return new Promise((r,o)=>{let i=0,e=()=>{i++;let t=window.gsap,n=window.ScrollTrigger;t&&n?r({gsap:t,ScrollTrigger:n}):i>=50?o(new Error("GSAP or ScrollTrigger failed to load. Ensure they are loaded as <script> tags before this module.")):setTimeout(e,100)};e()})}async function f(){if(typeof window>"u")return!1;try{let{gsap:r,ScrollTrigger:o}=await g();return r.plugins?.scrollTrigger!==void 0?console.log("\u2713 ScrollTrigger already registered"):r.registerPlugin(o),!0}catch(r){return console.error("Failed to register ScrollTrigger:",r),!1}}async function d(){if(!await f())return;let o=window.gsap,l=o.matchMedia?.();if(!l){console.error("GSAP matchMedia() is unavailable.");return}l.add("(min-width: 992px)",()=>{let i=document.querySelectorAll("[horizontal-scroll-section]");if(i.length===0){console.warn("No elements found with [horizontal-scroll-section]");return}return i.forEach(e=>{let t=e.querySelector("[horizontal-scroll-wrapper]");if(!t){console.warn("Missing [horizontal-scroll-wrapper] inside:",e);return}let n=()=>{let c=t.scrollWidth-window.innerWidth;return Math.max(c,0)};if(n()<=0){console.warn("Wrapper content is not wider than viewport. No scroll needed.",t);return}let s=`hs-${t.dataset.stId||Math.random().toString(16).slice(2)}`,a=o.getById?.(s);a&&a.kill(),t.dataset.stId=s,o.to(t,{x:()=>-n(),ease:"none",scrollTrigger:{id:s,trigger:e,start:"top top",end:()=>`+=${n()}`,pin:!0,scrub:1,invalidateOnRefresh:!0,markers:!1,onUpdate:c=>{}}})}),()=>{try{o.getChildren?.().forEach(e=>{e.id?.startsWith("hs-")&&e.kill()})}catch{}}})}typeof window<"u"&&(document.readyState==="loading"?document.addEventListener("DOMContentLoaded",async()=>{try{await d()}catch(r){console.error("Error initializing horizontal scroll:",r)}}):d().catch(r=>{console.error("Error initializing horizontal scroll:",r)}),window.addEventListener("load",()=>{try{window.ScrollTrigger?.refresh&&window.ScrollTrigger.refresh()}catch(r){console.error("Error refreshing ScrollTrigger:",r)}}));})();
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/home/horizontal-scroll.ts"],
|
|
4
|
-
"sourcesContent": ["// horizontal-scroll.ts\n// Requires GSAP and ScrollTrigger loaded as global scripts BEFORE this file\n\ndeclare global {\n interface Window {\n gsap?: any;\n ScrollTrigger?: any;\n }\n}\n\nfunction waitForGSAPAndScrollTrigger(): Promise<{ gsap: any; ScrollTrigger: any }> {\n return new Promise((resolve, reject) => {\n const maxAttempts = 50; // 5 seconds with 100ms checks\n let attempts = 0;\n\n const check = () => {\n attempts++;\n const gsap = window.gsap;\n const ScrollTrigger = window.ScrollTrigger;\n\n if (gsap && ScrollTrigger) {\n resolve({ gsap, ScrollTrigger });\n } else if (attempts >= maxAttempts) {\n reject(\n new Error(\n \"GSAP or ScrollTrigger failed to load. Ensure they are loaded as <script> tags before this module.\"\n )\n );\n } else {\n setTimeout(check, 100);\n }\n };\n\n check();\n });\n}\n\nasync function ensureScrollTriggerRegistered(): Promise<boolean> {\n if (typeof window === \"undefined\") return false;\n\n try {\n const { gsap, ScrollTrigger } = await waitForGSAPAndScrollTrigger();\n\n // Check if already registered\n const isAlreadyRegistered = gsap.plugins?.scrollTrigger !== undefined;\n\n if (!isAlreadyRegistered) {\n gsap.registerPlugin(ScrollTrigger);\n console.log(\"\u2713 ScrollTrigger registered successfully\");\n } else {\n console.log(\"\u2713 ScrollTrigger already registered\");\n }\n\n return true;\n } catch (err) {\n console.error(\"Failed to register ScrollTrigger:\", err);\n return false;\n }\n}\n\nasync function initHorizontalScroll(): Promise<void> {\n // Wait for and register ScrollTrigger\n const registered = await ensureScrollTriggerRegistered();\n if (!registered) return;\n\n const gsap = window.gsap!;\n const mm = gsap.matchMedia?.();\n\n if (!mm) {\n console.error(\"GSAP matchMedia() is unavailable.\");\n return;\n }\n\n mm.add(\"(min-width: 992px)\", () => {\n const sections = document.querySelectorAll<HTMLElement>(\n \"[horizontal-scroll-section]\"\n );\n\n if (sections.length === 0) {\n console.warn(\"No elements found with [horizontal-scroll-section]\");\n return;\n }\n\n sections.forEach((section) => {\n const wrapper = section.querySelector<HTMLElement>(\n \"[horizontal-scroll-wrapper]\"\n );\n\n if (!wrapper) {\n console.warn(\"Missing [horizontal-scroll-wrapper] inside:\", section);\n return;\n }\n\n const endDistance = () => {\n const dist = wrapper.scrollWidth - window.innerWidth;\n return Math.max(dist, 0);\n };\n\n if (endDistance() <= 0) {\n console.warn(\n \"Wrapper content is not wider than viewport. No scroll needed.\",\n wrapper\n );\n return;\n }\n\n // Kill any existing trigger to prevent duplicates\n const triggerId = `hs-${wrapper.dataset.stId || Math.random().toString(16).slice(2)}`;\n const existing = gsap.getById?.(triggerId);\n if (existing) {\n existing.kill();\n }\n wrapper.dataset.stId = triggerId;\n\n // Animate horizontal scroll\n gsap.to(wrapper, {\n x: () => -endDistance(),\n ease: \"none\",\n scrollTrigger: {\n id: triggerId,\n trigger: section,\n start: \"top top\",\n end: () => `+=${endDistance()}`,\n pin: true,\n scrub: 1,\n invalidateOnRefresh: true,\n markers: false, // Set to true for debugging\n onUpdate: (self: any) => {\n // Optional: Add custom logic on scroll\n },\n },\n });\n });\n\n // Cleanup when media query no longer matches\n return () => {\n try {\n gsap.getChildren?.().forEach((trigger: any) => {\n if (trigger.id?.startsWith(\"hs-\")) {\n trigger.kill();\n }\n });\n } catch {\n // Silently fail on cleanup\n }\n };\n });\n}\n\n/* --------------------------------- Auto-Init ------------------------------- */\nif (typeof window !== \"undefined\") {\n // Initialize when DOM is ready\n if (document.readyState === \"loading\") {\n document.addEventListener(\"DOMContentLoaded\", async () => {\n try {\n await initHorizontalScroll();\n } catch (err) {\n console.error(\"Error initializing horizontal scroll:\", err);\n }\n });\n } else {\n // DOM already loaded\n initHorizontalScroll().catch((err) => {\n console.error(\"Error initializing horizontal scroll:\", err);\n });\n }\n\n // Refresh on window load to ensure accurate measurements\n window.addEventListener(\"load\", () => {\n try {\n if (window.ScrollTrigger?.refresh) {\n window.ScrollTrigger.refresh();\n }\n } catch (err) {\n console.error(\"Error refreshing ScrollTrigger:\", err);\n }\n });\n}\n\nexport { initHorizontalScroll };"],
|
|
5
|
-
"mappings": ";;;AAUA,WAAS,8BAA0E;AACjF,WAAO,IAAI,QAAQ,CAAC,SAAS,WAAW;AACtC,YAAM,cAAc;AACpB,UAAI,WAAW;AAEf,YAAM,QAAQ,MAAM;AAClB;AACA,cAAM,OAAO,OAAO;AACpB,cAAM,gBAAgB,OAAO;AAE7B,YAAI,QAAQ,eAAe;AACzB,kBAAQ,EAAE,MAAM,cAAc,CAAC;AAAA,QACjC,WAAW,YAAY,aAAa;AAClC;AAAA,YACE,IAAI;AAAA,cACF;AAAA,YACF;AAAA,UACF;AAAA,QACF,OAAO;AACL,qBAAW,OAAO,GAAG;AAAA,QACvB;AAAA,MACF;AAEA,YAAM;AAAA,IACR,CAAC;AAAA,EACH;AAEA,iBAAe,gCAAkD;AAC/D,QAAI,OAAO,WAAW,YAAa,QAAO;AAE1C,QAAI;AACF,YAAM,EAAE,MAAM,cAAc,IAAI,MAAM,4BAA4B;AAGlE,YAAM,sBAAsB,KAAK,SAAS,kBAAkB;AAE5D,UAAI,CAAC,qBAAqB;AACxB,aAAK,eAAe,aAAa;
|
|
4
|
+
"sourcesContent": ["// horizontal-scroll.ts\n// Requires GSAP and ScrollTrigger loaded as global scripts BEFORE this file\n\ndeclare global {\n interface Window {\n gsap?: any;\n ScrollTrigger?: any;\n }\n}\n\nfunction waitForGSAPAndScrollTrigger(): Promise<{ gsap: any; ScrollTrigger: any }> {\n return new Promise((resolve, reject) => {\n const maxAttempts = 50; // 5 seconds with 100ms checks\n let attempts = 0;\n\n const check = () => {\n attempts++;\n const gsap = window.gsap;\n const ScrollTrigger = window.ScrollTrigger;\n\n if (gsap && ScrollTrigger) {\n resolve({ gsap, ScrollTrigger });\n } else if (attempts >= maxAttempts) {\n reject(\n new Error(\n \"GSAP or ScrollTrigger failed to load. Ensure they are loaded as <script> tags before this module.\"\n )\n );\n } else {\n setTimeout(check, 100);\n }\n };\n\n check();\n });\n}\n\nasync function ensureScrollTriggerRegistered(): Promise<boolean> {\n if (typeof window === \"undefined\") return false;\n\n try {\n const { gsap, ScrollTrigger } = await waitForGSAPAndScrollTrigger();\n\n // Check if already registered\n const isAlreadyRegistered = gsap.plugins?.scrollTrigger !== undefined;\n\n if (!isAlreadyRegistered) {\n gsap.registerPlugin(ScrollTrigger);\n // console.log(\"\u2713 ScrollTrigger registered successfully\");\n } else {\n console.log(\"\u2713 ScrollTrigger already registered\");\n }\n\n return true;\n } catch (err) {\n console.error(\"Failed to register ScrollTrigger:\", err);\n return false;\n }\n}\n\nasync function initHorizontalScroll(): Promise<void> {\n // Wait for and register ScrollTrigger\n const registered = await ensureScrollTriggerRegistered();\n if (!registered) return;\n\n const gsap = window.gsap!;\n const mm = gsap.matchMedia?.();\n\n if (!mm) {\n console.error(\"GSAP matchMedia() is unavailable.\");\n return;\n }\n\n mm.add(\"(min-width: 992px)\", () => {\n const sections = document.querySelectorAll<HTMLElement>(\n \"[horizontal-scroll-section]\"\n );\n\n if (sections.length === 0) {\n console.warn(\"No elements found with [horizontal-scroll-section]\");\n return;\n }\n\n sections.forEach((section) => {\n const wrapper = section.querySelector<HTMLElement>(\n \"[horizontal-scroll-wrapper]\"\n );\n\n if (!wrapper) {\n console.warn(\"Missing [horizontal-scroll-wrapper] inside:\", section);\n return;\n }\n\n const endDistance = () => {\n const dist = wrapper.scrollWidth - window.innerWidth;\n return Math.max(dist, 0);\n };\n\n if (endDistance() <= 0) {\n console.warn(\n \"Wrapper content is not wider than viewport. No scroll needed.\",\n wrapper\n );\n return;\n }\n\n // Kill any existing trigger to prevent duplicates\n const triggerId = `hs-${wrapper.dataset.stId || Math.random().toString(16).slice(2)}`;\n const existing = gsap.getById?.(triggerId);\n if (existing) {\n existing.kill();\n }\n wrapper.dataset.stId = triggerId;\n\n // Animate horizontal scroll\n gsap.to(wrapper, {\n x: () => -endDistance(),\n ease: \"none\",\n scrollTrigger: {\n id: triggerId,\n trigger: section,\n start: \"top top\",\n end: () => `+=${endDistance()}`,\n pin: true,\n scrub: 1,\n invalidateOnRefresh: true,\n markers: false, // Set to true for debugging\n onUpdate: (self: any) => {\n // Optional: Add custom logic on scroll\n },\n },\n });\n });\n\n // Cleanup when media query no longer matches\n return () => {\n try {\n gsap.getChildren?.().forEach((trigger: any) => {\n if (trigger.id?.startsWith(\"hs-\")) {\n trigger.kill();\n }\n });\n } catch {\n // Silently fail on cleanup\n }\n };\n });\n}\n\n/* --------------------------------- Auto-Init ------------------------------- */\nif (typeof window !== \"undefined\") {\n // Initialize when DOM is ready\n if (document.readyState === \"loading\") {\n document.addEventListener(\"DOMContentLoaded\", async () => {\n try {\n await initHorizontalScroll();\n } catch (err) {\n console.error(\"Error initializing horizontal scroll:\", err);\n }\n });\n } else {\n // DOM already loaded\n initHorizontalScroll().catch((err) => {\n console.error(\"Error initializing horizontal scroll:\", err);\n });\n }\n\n // Refresh on window load to ensure accurate measurements\n window.addEventListener(\"load\", () => {\n try {\n if (window.ScrollTrigger?.refresh) {\n window.ScrollTrigger.refresh();\n }\n } catch (err) {\n console.error(\"Error refreshing ScrollTrigger:\", err);\n }\n });\n}\n\nexport { initHorizontalScroll };"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|