https://ecocupid-asean.com/assets/PerspectiveSelectScreen-eyCDho4a.js

1import{x as S,r as m,j as t,br as E,m as T}from"./index-q_JQ1u3V.js";import{a as f}from"./gameStore-BwZwP4lc.js";import{g as C}from"./countries-CGP2wUa2.js";import{F as j}from"./file-text-RmbE5Tly.js";import{U as N}from"./users-CYc5Aycy.js";import{C as k}from"./chart-no-axes-column-DT4jsEBd.js";import{L as R}from"./leaf-DTRLNCqw.js";const O=[{id:"correspondent",name:"THE CORRESPONDENT",role:"Environmental journalist. You shape what the public knows.",bg:"var(--th-correspondent)",meterFill:"rgba(240,237,230,0.6)",icon:j,texture:`url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='40' height='40'><path d='M0 0h40v40H0z' fill='none'/><path d='M0 20h40M20 0v40' stroke='rgba(240,237,230,0.06)' stroke-width='1'/></svg>")`,meterOne:{label:"STORY REACH",max:100},meterTwo:{label:"SOURCE TRUST",max:10},meterValues:e=>[{value:e.startStoryReach??0,display:`${e.startStoryReach??0} / 100`},{value:e.startSourceTrust??0,display:`${e.startSourceTrust??0} tokens`}]},{id:"organiser",name:"THE ORGANISER",role:"Youth network coordinator. You build the conditions for change.",bg:"var(--th-organiser)",meterFill:"var(--th-ecocupid-coral)",icon:N,texture:`url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='60' height='60'><circle cx='15' cy='15' r='1.5' fill='rgba(240,237,230,0.07)'/><circle cx='45' cy='30' r='1.5' fill='rgba(240,237,230,0.07)'/><circle cx='20' cy='48' r='1.5' fill='rgba(240,237,230,0.07)'/><line x1='15' y1='15' x2='45' y2='30' stroke='rgba(240,237,230,0.04)' stroke-width='0.5'/><line x1='45' y1='30' x2='20' y2='48' stroke='rgba(240,237,230,0.04)' stroke-width='0.5'/></svg>")`,meterOne:{label:"VOLUNTEER ENERGY",max:10},meterTwo:{label:"MOVEMENT MOMENTUM",max:5},meterValues:e=>[{value:e.startVolunteerEnergy??0,display:`${e.startVolunteerEnergy??0} tokens`},{value:e.startMovementMomentum??0,display:`${e.startMovementMomentum??0} / 5`}]},{id:"sustainability",name:"THE SUSTAINABILITY LEAD",role:"Head of Sustainability. You have a budget, a board, and ESG targets.",bg:"var(--th-sustainability)",meterFill:"var(--th-standing)",icon:k,texture:"repeating-linear-gradient(45deg, rgba(240,237,230,0.04) 0 1px, transparent 1px 8px)",meterOne:{label:"CSR BUDGET",max:10},meterTwo:{label:"ESG SCORE",max:100},meterValues:e=>[{value:e.startCSRBudget??0,display:`${e.startCSRBudget??0} units`},{value:e.startESGScore??0,display:`${e.startESGScore??0} / 100`}]},{id:"fielddirector",name:"THE FIELD DIRECTOR",role:"Project director, community-based. You restore what was lost.",bg:"var(--th-fielddirector)",meterFill:"var(--th-ecocupid-accent)",icon:R,texture:`url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='80' height='80'><path d='M40 10 Q60 40 40 70 Q20 40 40 10z' fill='none' stroke='rgba(240,237,230,0.05)' stroke-width='0.7'/><path d='M40 10 L40 70' stroke='rgba(240,237,230,0.04)' stroke-width='0.5'/></svg>")`,meterOne:{label:"GRANT FUNDS",max:10},meterTwo:{label:"COMMUNITY TRUST",max:5},meterValues:e=>[{value:e.startGrantFunds??0,display:`${e.startGrantFunds??0} tranches`},{value:e.startCommunityTrust??0,display:`${e.startCommunityTrust??0} / 5`}]}],v=({label:e,display:s,pct:n,fill:l,delay:o})=>t.jsxs("div",{className:"w-full",children:[t.jsxs("div",{className:"font-game-mono mb-1.5 flex items-center justify-between",style:{color:"rgba(240,237,230,0.55)",fontSize:"10px",letterSpacing:"0.12em"},children:[t.jsx("span",{children:e}),t.jsx("span",{children:s})]}),t.jsx("div",{style:{height:"3px",width:"100%",backgroundColor:"rgba(240,237,230,0.08)",overflow:"hidden"},children:t.jsx("div",{style:{height:"100%",width:`${n}%`,backgroundColor:l,animation:"th-meter-grow 600ms ease-out both",animationDelay:`${o}ms`}})})]}),M=({spec:e,startData:s,isSelected:n,isOther:l,onSelect:o,index:a})=>{const[i,d]=m.useState(!1),x=e.icon,[c,h]=e.meterValues(s),p=c.value/e.meterOne.max*100,u=h.value/e.meterTwo.max*100;return t.jsx("button",{type:"button",onClick:()=>o(e.id),onMouseEnter:()=>d(!0),onMouseLeave:()=>d(!1),className:"th-panel th-snap-item relative block overflow-hidden text-left",style:{flex:n?"1 1 100%":l?"0 0 0%":"1 1 50%",backgroundColor:e.bg,backgroundImage:e.texture,backgroundRepeat:"repeat",opacity:l?0:1,boxShadow:i?"inset 0 0 0 1px rgba(240,237,230,0.20)":"none",filter:i?"brightness(1.08)":"brightness(1)",transition:"all 300ms ease",cursor:n?"default":"pointer",animation:"th-fade-up 500ms ease-out both",animationDelay:`${a*80}ms`,minHeight:"50vh"},"aria-label":`Choose ${e.name}`,children:t.jsxs("div",{className:"flex h-full min-h-[50vh] flex-col items-center justify-between px-8 py-12 md:px-10",children:[t.jsx(x,{className:"h-12 w-12",strokeWidth:1.25,style:{color:"var(--th-text-primary)"},"aria-hidden":!0}),t.jsxs("div",{className:"flex w-full max-w-md flex-col items-center text-center",children:[t.jsx("h3",{className:"font-headline",style:{color:"var(--th-text-primary)",fontSize:"22px",letterSpacing:"0.08em"},children:e.name}),t.jsx("p",{className:"mt-3",style:{color:"rgba(240,237,230,0.70)",fontSize:"13px",maxWidth:"40ch"},children:e.role}),t.jsx("p",{className:"mt-4 italic",style:{color:"rgba(240,237,230,0.55)",fontSize:"13px",maxWidth:"46ch",display:"-webkit-box",WebkitLineClamp:2,WebkitBoxOrient:"vertical",overflow:"hidden"},children:s.panelTeaser})]}

1),t.jsxs("div",{className:"w-full max-w-md space-y-4",children:[t.jsx(v,{label:e.meterOne.label,display:c.display,pct:p,fill:e.meterFill,delay:200}),t.jsx(v,{label:e.meterTwo.label,display:h.display,pct:u,fill:e.meterFill,delay:350})]}),t.jsx("span",{className:"font-game-mono",style:{color:"rgba(240,237,230,0.6)",fontSize:"10px",letterSpacing:"0.2em",opacity:i&&!n?1:0,transition:"opacity 200ms ease"},children:"→ SELECT"})]})})},P=()=>{const e=S(),s=f(r=>r.selectedCountry),n=f(r=>r.selectPerspective),l=f(r=>r.setOpeningDispatch),o=C(s),[a,i]=m.useState(null),[d,x]=m.useState(!1),c=m.useMemo(()=>!a||!o?"":o.perspectives[a].openingDispatch,[a,o]);if(m.useEffect(()=>{if(!a)return;const r=setTimeout(()=>x(!0),2700);return()=>clearTimeout(r)},[a]),!s||!o)return t.jsx(E,{to:"/threshold/select/country",replace:!0});const h=r=>{a||i(r)},p=()=>{a&&(n(a),l(c),e("/threshold/intro"))},u=a!==null;return t.jsxs("div",{className:"relative w-full",style:{minHeight:"100vh"},children:[t.jsx("div",{className:"pointer-events-none absolute inset-x-0 top-0 z-20 flex flex-col items-center pt-6",children:t.jsxs("p",{className:"font-game-mono th-anim-fade-in",style:{color:"rgba(240,237,230,0.40)",fontSize:"11px",letterSpacing:"0.15em"},children:[o.name.toUpperCase()," · CHOOSE YOUR PERSPECTIVE"]})}),!u&&t.jsx(T,{to:"/threshold/select/country",className:"font-game-mono th-anim-fade-in absolute left-6 top-6 z-20",style:{color:"rgba(240,237,230,0.5)",fontSize:"11px",letterSpacing:"0.15em",animationDelay:"500ms",textDecoration:"none"},children:"← BACK"}),t.jsx("div",{className:"th-snap-y flex w-full flex-col overflow-y-auto md:h-screen md:flex-row md:flex-wrap md:overflow-hidden",style:{minHeight:"100vh"},children:O.map((r,y)=>{const w=o.perspectives[r.id],g=a===r.id,b=a!==null&&a!==r.id;return t.jsx("div",{style:{width:g?"100%":b?"0%":"50%",height:g?"100vh":"50vh",transition:"width 380ms ease, height 380ms ease",overflow:"hidden"},className:"th-snap-item",children:t.jsx(M,{spec:r,startData:w,isSelected:g,isOther:b,onSelect:h,index:y})},r.id)})}),u&&t.jsx("div",{className:"pointer-events-none fixed inset-0 z-30 flex items-center justify-center px-6",style:{backgroundColor:"rgba(13,17,23,0.55)"},children:t.jsxs("div",{className:"pointer-events-auto max-w-3xl text-center",children:[t.jsx("p",{className:"th-anim-typewriter italic",style:{color:"rgba(240,237,230,0.85)",fontSize:"clamp(14px, 1.6vw, 16px)",lineHeight:1.7,whiteSpace:"pre-wrap"},children:c}),d&&t.jsx("button",{type:"button",onClick:p,className:"mt-10 font-game-mono th-anim-fade-up",style:{background:"transparent",border:"1px solid rgba(240,237,230,0.5)",color:"var(--th-text-primary)",padding:"14px 40px",fontSize:"13px",letterSpacing:"0.15em",cursor:"pointer",transition:"border-color 200ms ease, background-color 200ms ease"},onMouseEnter:r=>{r.currentTarget.style.borderColor="rgba(240,237,230,1)",r.currentTarget.style.backgroundColor="rgba(240,237,230,0.06)"},onMouseLeave:r=>{r.currentTarget.style.borderColor="rgba(240,237,230,0.5)",r.currentTarget.style.backgroundColor="transparent"},children:"ENTER THE FIELD →"})]})})]})};export{P as default};
2//# sourceMappingURL=PerspectiveSelectScreen-eyCDho4a.js.map