// LANGUAGE GATE — Full-height bilingual entry screen // Franco-Georgian mariage. Subtle vine patterns, Chokha-inspired ornaments, // flags woven in discreetly. Three languages: FR / GE / DE. // Auto-cycling welcome line — fades the chars of the current language out, // then fades the next language's chars in with a left-to-right stagger. const WELCOME_WORDS = ['Bienvenue', 'მოგესალმებით', 'Willkommen']; const WelcomeCycler = () => { const [idx, setIdx] = React.useState(0); React.useEffect(() => { const id = setInterval(() => setIdx((i) => (i + 1) % WELCOME_WORDS.length), 3200); return () => clearInterval(id); }, []); return (
{WELCOME_WORDS.map((word, i) => ( {[...word].map((ch, j) => ( {ch === ' ' ? ' ' : ch} ))} ))}
); }; const LangGate = ({ onSelect }) => { const [hovered, setHovered] = React.useState(null); const [exiting, setExiting] = React.useState(false); const [chosen, setChosen] = React.useState(null); const handle = (lang) => { if (exiting) return; // Start the panduri loop right inside the click handler so iOS Safari // counts it as a user-gesture-initiated playback. if (window.__startBgAudio) { try { window.__startBgAudio(); } catch (e) { /* ignore */ } } setChosen(lang); setExiting(true); // wait for exit animation setTimeout(() => onSelect(lang), 900); }; const langs = [ { code: 'fr', label: 'Choisissez', native: 'Bienvenue', flag: 'fr', tagline: 'Le mariage de Justine & Levani', }, { code: 'ge', label: 'აირჩიეთ', native: 'მოგესალმებით', flag: 'ge', tagline: 'ჟუსტინ და ლევანის ქორწილი', }, { code: 'de', label: 'Wählen', native: 'Willkommen', flag: 'de', tagline: 'Die Hochzeit von Justine & Levani', }, ]; return (
{window.MonoLogo && }
{langs.map((l) => ( ))}
Franco · Géorgien
05-06 septembre 2026
); }; // Tiny flag components — sage-tinted to fit palette const FlagDisc = ({ code }) => { if (code === 'fr') { return ( ); } if (code === 'ge') { return ( {/* Saint George cross — central red bands */} {/* 4 Bolnisi crosses in the quadrants */} {[[7.5,7.5],[22.5,7.5],[7.5,22.5],[22.5,22.5]].map(([x,y],i)=>( ))} ); } if (code === 'de') { return ( ); } return null; }; const FlagFR = () => ( ); const FlagGE = () => ( {/* 4 small Bolnisi crosses */} {[[4.5,2.5],[13.5,2.5],[4.5,9.5],[13.5,9.5]].map(([x,y],i)=>( ))} ); window.LangGate = LangGate;