import{r as a,c as T,bs as R,bt as x,j as s,m as r}from"./index-CxGMQRP8.js";import{u as j}from"./useIOSAudioContext-DSBnluc9.js";const I="https://cdn.storysparkle.org/landing_assets/blotch-yellow.webp",N="https://cdn.storysparkle.org/landing_assets/blotch-magenta.webp",V=()=>{const p=a.useRef(null),h=a.useRef(-1),u=a.useRef(0),{getContext:f}=j(),{t:d}=T("landing"),c=d("syncedHighlights.sentence"),g=c.includes("|"),i=g?c.split("|").filter(o=>o.length>0):c.split(/\s+/).filter(o=>o.length>0),{scrollYProgress:l}=R({target:p,offset:["start start","end end"]}),y=x(l,[0,1],[0,180]),w=x(l,[0,1],[0,-180]),[m,v]=a.useState(-1),b=()=>{const o=Date.now();if(!(o-u.current<150)){u.current=o;try{const t=f();if(!t)return;const e=t.createOscillator(),n=t.createGain();e.connect(n),n.connect(t.destination),e.type="sine",e.frequency.setValueAtTime(800,t.currentTime),e.frequency.exponentialRampToValueAtTime(200,t.currentTime+.1),n.gain.setValueAtTime(.15,t.currentTime),n.gain.exponentialRampToValueAtTime(.01,t.currentTime+.1),e.start(t.currentTime),e.stop(t.currentTime+.1)}catch{}}};return a.useEffect(()=>{const o=l.on("change",t=>{const e=Math.floor(t*(i.length+1))-1,n=Math.max(-1,Math.min(e,i.length-1));n!==h.current&&n>=0&&b(),h.current=n,v(n)});return()=>o()},[l,i.length]),s.jsx("section",{ref:p,className:"relative z-10",style:{height:"250vh",background:"#E0F2FE"},children:s.jsxs("div",{className:"sticky top-14 h-[calc(100vh-3.5rem)] flex flex-col items-center justify-center px-6 md:px-12 lg:px-24 ipad-portrait:!px-2 overflow-visible",children:[s.jsx(r.img,{src:I,alt:"Background highlight blotch",role:"presentation",className:`absolute pointer-events-none opacity-80 z-10
w-[70vw] h-auto lg:w-auto lg:h-[70vh] max-[1366px]:lg:h-[50vh]
left-1/2 lg:left-[5vw]
top-[10vh] lg:top-1/2
ipad-portrait:!w-[45vw] ipad-portrait:!h-auto ipad-portrait:!left-1/2 ipad-portrait:!top-[10vh]`,style:{rotate:y,x:"-50%",y:"-50%"}}),s.jsx(r.img,{src:N,alt:"Background highlight blotch",role:"presentation",className:`absolute pointer-events-none opacity-80 z-10
w-[70vw] h-auto lg:w-auto lg:h-[70vh] max-[1366px]:lg:h-[50vh]
left-1/2 lg:left-[95vw]
top-[90vh] lg:top-1/2
ipad-portrait:!w-[45vw] ipad-portrait:!h-auto ipad-portrait:!left-1/2 ipad-portrait:!top-[90vh]`,style:{rotate:w,x:"-50%",y:"-50%"}}),s.jsx(r.h2,{className:"section-header text-[22px] lg:text-[32px] text-center mb-8",initial:{opacity:0,y:20},whileInView:{opacity:1,y:0},viewport:{once:!0},transition:{duration:.6},children:d("syncedHighlights.heading")}),s.jsx(r.p,{className:"section-subtext text-center max-w-3xl ipad-portrait:!max-w-[680px]",initial:{opacity:0,y:20},whileInView:{opacity:1,y:0},viewport:{once:!0,amount:.5},transition:{duration:.6,delay:.2},children:i.map((o,t)=>{const e=t===m,n=t<m;return s.jsx(r.span,{className:`inline-block ${g?"px-0":"mr-2 px-1"} py-0.5 rounded transition-colors duration-200 ${e?"bg-[#BF0404] text-white":n?"text-foreground":"text-muted-foreground"}`,animate:{scale:e?1.1:1},transition:{type:"spring",stiffness:300,damping:20},children:o},t)})})]})})};export{V as default};
//# sourceMappingURL=SyncedHighlightsSection-BTbs0uZf.js.map