(function(){ var root = document.currentScript.closest('.mh-root') || document.querySelector('.mh-root'); if(!root || !window.gsap) return; gsap.registerPlugin(ScrollTrigger); /* build 60 minute ticks around the clock */ var ticksG = root.querySelector('#mh-ticks'); if(ticksG){ var cx=220, cy=220, rOuter=200, ns='http://www.w3.org/2000/svg'; for(var i=0;i<60;i++){ var isHour = i % 5 === 0; var len = isHour ? 14 : 6; var w = isHour ? 1.4 : .6; var line = document.createElementNS(ns,'line'); line.setAttribute('x1',cx); line.setAttribute('y1',cy-rOuter); line.setAttribute('x2',cx); line.setAttribute('y2',cy-rOuter+len); line.setAttribute('stroke-width',w); line.setAttribute('transform','rotate('+(i*6)+' '+cx+' '+cy+')'); ticksG.appendChild(line); } } /* custom cursor */ var cursor = root.querySelector('.mh-cursor'); window.addEventListener('mousemove', function(e){ gsap.to(cursor,{x:e.clientX,y:e.clientY,opacity:1,duration:.5,ease:'power3.out'}); }); root.querySelectorAll('a,button').forEach(function(el){ el.addEventListener('mouseenter',function(){ gsap.to(cursor,{width:54,height:54,margin:'-27px 0 0 -27px',duration:.35}); }); el.addEventListener('mouseleave',function(){ gsap.to(cursor,{width:26,height:26,margin:'-13px 0 0 -13px',duration:.35}); }); }); /* split wordmark chars already in DOM via spans .mh-char */ /* ---------------- HERO CINEMATIC TIMELINE ---------------- */ var tl = gsap.timeline({defaults:{ease:'power3.out'}}); tl.to('#mh-meta-top', {opacity:1, duration:.9}, .3) .to('#mh-meta-corner', {opacity:1, duration:.9}, .5) .fromTo('#mh-clockstage', {opacity:0, scale:.86, rotate:-4}, {opacity:1, scale:1, rotate:0, duration:1.6, ease:'power2.out'}, .6) .fromTo('#mh-hourhand', {rotation:0, transformOrigin:'220px 220px'}, {rotation:304, duration:2.1, ease:'power3.inOut'}, .8) .fromTo('#mh-minhand', {rotation:0, transformOrigin:'220px 220px'}, {rotation:48, duration:2.1, ease:'power3.inOut'}, .8) .to('#mh-cupid-ghost', {opacity:.14, duration:1.6}, 1.4) .to('.mh-char', { y:0, duration:1.1, ease:'expo.out', stagger:.045 }, 1.7) .fromTo('#mh-clockstage', {yPercent:0}, {yPercent:-4, duration:1.2}, 1.9) .to('#mh-meta-bottom', {opacity:1, duration:.8}, 2.4) .to('#mh-scrollcue', {opacity:1, duration:.8}, 2.7); /* idle life: subtle minute-hand breathing tick */ gsap.to('#mh-minhand', { rotation:'+=1.4', transformOrigin:'220px 220px', duration:2.4, repeat:-1, yoyo:true, ease:'sine.inOut', delay:3.2 }); /* scroll cue nudge */ gsap.to('#mh-scrollcue i', {scaleY:.4, transformOrigin:'top', duration:1.3, repeat:-1, yoyo:true, ease:'sine.inOut', delay:3}); /* hero parallax on scroll */ gsap.to('#mh-clockstage', { yPercent:14, ease:'none', scrollTrigger:{trigger:'#mh-hero', start:'top top', end:'bottom top', scrub:.6} }); gsap.to('#mh-wordmark', { yPercent:-10, ease:'none', scrollTrigger:{trigger:'#mh-hero', start:'top top', end:'bottom top', scrub:.6} }); gsap.to('#mh-cupid-ghost', { yPercent:-18, ease:'none', scrollTrigger:{trigger:'#mh-hero', start:'top top', end:'bottom top', scrub:.6} }); /* ---------------- chapter reveals ---------------- */ root.querySelectorAll('[data-mh-chapter]').forEach(function(ch){ var items = ch.querySelectorAll('.mh-reveal'); gsap.to(items, { opacity:1, y:0, duration:1, stagger:.09, ease:'power3.out', scrollTrigger:{ trigger:ch, start:'top 78%' } }); }); /* poster headline lines slide in from alternating sides */ root.querySelectorAll('.mh-poster-h span').forEach(function(span,i){ gsap.fromTo(span, {xPercent:i%2===0?-6:6, opacity:0}, { xPercent:0, opacity:1, duration:1.1, ease:'power3.out', scrollTrigger:{ trigger:span, start:'top 85%' } }); }); root.querySelectorAll('.mh-house-h span').forEach(function(span,i){ gsap.fromTo(span, {xPercent:i%2===0?-4:4, opacity:0}, { xPercent:0, opacity:1, duration:1.2, ease:'power3.out', scrollTrigger:{ trigger:span, start:'top 85%' } }); }); /* big background step numerals drift slightly on scroll */ root.querySelectorAll('.mh-step-num').forEach(function(n){ gsap.to(n, { yPercent:-14, ease:'none', scrollTrigger:{ trigger:n, start:'top bottom', end:'bottom top', scrub:.8 }}); }); ScrollTrigger.refresh(); })();