<style>#split { font-kerning: none;}</style><script src="https://cdn.jsdelivr.net/npm/js-cookie@2/src/js.cookie.min.js"></script><script>const fullnames = [ "Good Luck Org.", "Godzilla Looms Ominously", "Group of Literal Orangutans", "Gorgeous Ladies Of (Architecture)", "Glowing Little Orchids", "Gwyneth Likes Origami", "Greater Lakes & Oceans", "Gun Lolly Originals", "Go Long Options", "Giant Llama Org.", "Guns Leave Orphans", "Glitter Lipped Orcas", "Gauche Lame Orchids", "Galloping Like Okapi", "Gimme Lions Or-else", "Get Laid Online", "Group of Lemmings Overseas", "Games Like Overwatch", "Galloping Long Overnight", "Golfers Love Orienteering", "General Lawlessness Organization", "Glittering Lofty Oeuvre", "Glamorous Life Options", "Girly Liars Opine", "Get Layouts Overnight", "Gimmicky Lyrics Overall", "Green Like Orange", "Gnat Leopard Octopus", "Gold Loans Overstock", "Green Lights Only", "George Lucas Opponent", "Glaciers Lubricating Oceans", "Geometry Looms Ominously", "Giraffes Lounging Obliquely", "Grotesque Lurching Ostritches", "Gays & Lesbians Only", "Grass & Leaves Outside", "Gorgons, Leviathans & Ouroboroses", "Ghosts, Leprechauns & Orcs", "Gyrating Legendary Octopii", "Gracious Living Opportunities", "Giddy, Lighthearted & Orange", "Gamers Live Online", "God's Love, Obligatory", "Gnostic Lenticular Oracle", "Ginormous Landmarked Oculus", "Gone Legends of Old", "Geeky Lords Oversimplified", "Gleeful Limitless Oxymorons", "Gables, Lintels & Ornament", "Gangster Ladies Organize!", "Galactic Luddite Outpost", "Garden of Lucid Oysters", "Gagging Like Oprah", "Gravitating Lacadasically Outwards", "Ginormous Lazy Octopii"];let currentFullname = 0, fullnameArray = [], splitInstance = null, storedPositions = [];const slowDown = 0.5;function shuffle(array) { for (let i = array.length - 1; i > 0; i--) { const j = Math.floor(Math.random() * (i + 1)); [array[i], array[j]] = [array[j], array[i]]; } return array;}function sanitize(text) { return text.toLowerCase().replace(/[^a-z]/g, "");}function firstLetterSpan(wordEl) { const clean = sanitize(wordEl.textContent); if (!clean) return null; return Array.from(wordEl.querySelectorAll(".char")) .find(c => c.textContent.toLowerCase() === clean[0]) || null;}function displayName() { const h1 = document.getElementById("split"); const name = fullnameArray[currentFullname] || fullnames[0]; h1.textContent = name; h1.style.display = ""; const expires = new Date(Date.now() + 15 * 60 * 1000); Cookies.set("current", currentFullname, { expires }); Cookies.set("fullname", name, { expires });}function runShrink() { if (splitInstance) { splitInstance.revert(); splitInstance = null; } splitInstance = SplitText.create("#split", { type: "words,chars", wordsClass: "word++", charsClass: "char++" }); const chars = splitInstance.chars; const words = splitInstance.words; const stopWords = ["&","and","the","a","an","of"]; const sigWords = words .map(w => ({ el: w, text: w.textContent.trim() })) .filter(o => { const c = sanitize(o.text), r = o.text; return c && !stopWords.includes(c) && !/^\(.+\)$/.test(r); }); const keepAll = sigWords.map(o => firstLetterSpan(o.el)).filter(Boolean); const L_O = keepAll.slice(1); const targets = chars.filter(c => !keepAll.includes(c)); const [rG, rL, rO] = keepAll.map(el => el.getBoundingClientRect()); const baseLX = rG.left + rG.width; const baseOX = baseLX + rL.width; const contractX = [ 0, baseLX - rL.left, baseOX - rO.left ]; const radiusX = 60; const radiusY = 60; let randL = gsap.utils.random(0, radiusX); let randO = gsap.utils.random(0, radiusX); if (randL > randO) [randL, randO] = [randO, randL]; gsap.timeline() .to(targets, { autoAlpha: 0, duration: slowDown, ease: "expo.inOut" }) .to(keepAll, { x: i => contractX[i], y: 0, duration: slowDown, ease: "expo.inOut" }, "+=0.1") .to(L_O, { // i===0 → L, i===1 → O x: i => `+=${ i === 0 ? randL : randO }`, y: () => `+=${ gsap.utils.random(-20, radiusY) }`, duration: slowDown, ease: "expo.inOut", stagger: { each: 0.05, from: 0 } }) .eventCallback("onComplete", () => { storedPositions = keepAll.map(el => { const rect = el.getBoundingClientRect(); return { absX: rect.left, absY: rect.top }; }); });}function runExpand() { if (splitInstance) { splitInstance.revert(); splitInstance = null; } currentFullname = (currentFullname + 1) % fullnameArray.length; displayName(); splitInstance = SplitText.create("#split", { type: "words,chars", wordsClass: "word++", charsClass: "char++" }); const chars = splitInstance.chars; const words = splitInstance.words; const stopWords = ["&","and","the","a","an","of"]; const sigWords = words .map(w => ({ el: w, text: w.textContent.trim() })) .filter(o => { const c = sanitize(o.text), r = o.text; return c && !stopWords.includes(c) && !/^\(.+\)$/.test(r); }); const keepAll = sigWords.map(o => firstLetterSpan(o.el)).filter(Boolean); const targets = chars.filter(c => !keepAll.includes(c)); const newRects = keepAll.map(el => el.getBoundingClientRect()); const deltas = newRects.map((rect, i) => ({ x: storedPositions[i].absX - rect.left, y: storedPositions[i].absY - rect.top })); const tl = gsap.timeline(); tl.set(keepAll, { x: i => deltas[i].x, y: i => deltas[i].y }, 0) .set(targets, { autoAlpha: 0 }, 0) .to(keepAll, { y: 0, duration: slowDown, ease: "power2.inOut" }, 0) .to(keepAll, { x: 0, duration: slowDown, ease: "back.out(1.7)" }, "+=0.1") .to(targets, { autoAlpha: 1, duration: slowDown, ease: "power1.inOut" }, "+=0.1") .eventCallback("onComplete", () => { splitInstance.revert(); splitInstance = null; });}function main() { fullnameArray = shuffle(fullnames); const saved = Cookies.get("current"); if (saved) currentFullname = parseInt(saved, 10); displayName(); document.fonts.ready.then(() => { ScrollTrigger.create({ trigger: ".logo-trigger-dummy", start: "top top", onEnter: runShrink, onLeaveBack: runExpand }); });}document.addEventListener("DOMContentLoaded", main);</script>
<style>#split { font-kerning: none;}</style><script src="https://cdn.jsdelivr.net/npm/js-cookie@2/src/js.cookie.min.js"></script><script>const fullnames = [ "Good Luck Org.", "Godzilla Looms Ominously", "Group of Literal Orangutans", "Gorgeous Ladies Of (Architecture)", "Glowing Little Orchids", "Gwyneth Likes Origami", "Greater Lakes & Oceans", "Gun Lolly Originals", "Go Long Options", "Giant Llama Org.", "Guns Leave Orphans", "Glitter Lipped Orcas", "Gauche Lame Orchids", "Galloping Like Okapi", "Gimme Lions Or-else", "Get Laid Online", "Group of Lemmings Overseas", "Games Like Overwatch", "Galloping Long Overnight", "Golfers Love Orienteering", "General Lawlessness Organization", "Glittering Lofty Oeuvre", "Glamorous Life Options", "Girly Liars Opine", "Get Layouts Overnight", "Gimmicky Lyrics Overall", "Green Like Orange", "Gnat Leopard Octopus", "Gold Loans Overstock", "Green Lights Only", "George Lucas Opponent", "Glaciers Lubricating Oceans", "Geometry Looms Ominously", "Giraffes Lounging Obliquely", "Grotesque Lurching Ostritches", "Gays & Lesbians Only", "Grass & Leaves Outside", "Gorgons, Leviathans & Ouroboroses", "Ghosts, Leprechauns & Orcs", "Gyrating Legendary Octopii", "Gracious Living Opportunities", "Giddy, Lighthearted & Orange", "Gamers Live Online", "God's Love, Obligatory", "Gnostic Lenticular Oracle", "Ginormous Landmarked Oculus", "Gone Legends of Old", "Geeky Lords Oversimplified", "Gleeful Limitless Oxymorons", "Gables, Lintels & Ornament", "Gangster Ladies Organize!", "Galactic Luddite Outpost", "Garden of Lucid Oysters", "Gagging Like Oprah", "Gravitating Lacadasically Outwards", "Ginormous Lazy Octopii"];let currentFullname = 0, fullnameArray = [], splitInstance = null, storedPositions = [];const slowDown = 0.5;function shuffle(array) { for (let i = array.length - 1; i > 0; i--) { const j = Math.floor(Math.random() * (i + 1)); [array[i], array[j]] = [array[j], array[i]]; } return array;}function sanitize(text) { return text.toLowerCase().replace(/[^a-z]/g, "");}function firstLetterSpan(wordEl) { const clean = sanitize(wordEl.textContent); if (!clean) return null; return Array.from(wordEl.querySelectorAll(".char")) .find(c => c.textContent.toLowerCase() === clean[0]) || null;}function displayName() { const h1 = document.getElementById("split"); const name = fullnameArray[currentFullname] || fullnames[0]; h1.textContent = name; h1.style.display = ""; const expires = new Date(Date.now() + 15 * 60 * 1000); Cookies.set("current", currentFullname, { expires }); Cookies.set("fullname", name, { expires });}function runShrink() { if (splitInstance) { splitInstance.revert(); splitInstance = null; } splitInstance = SplitText.create("#split", { type: "words,chars", wordsClass: "word++", charsClass: "char++" }); const chars = splitInstance.chars; const words = splitInstance.words; const stopWords = ["&","and","the","a","an","of"]; const sigWords = words .map(w => ({ el: w, text: w.textContent.trim() })) .filter(o => { const c = sanitize(o.text), r = o.text; return c && !stopWords.includes(c) && !/^\(.+\)$/.test(r); }); const keepAll = sigWords.map(o => firstLetterSpan(o.el)).filter(Boolean); const L_O = keepAll.slice(1); const targets = chars.filter(c => !keepAll.includes(c)); const [rG, rL, rO] = keepAll.map(el => el.getBoundingClientRect()); const baseLX = rG.left + rG.width; const baseOX = baseLX + rL.width; const contractX = [ 0, baseLX - rL.left, baseOX - rO.left ]; const radiusX = 60; const radiusY = 60; let randL = gsap.utils.random(0, radiusX); let randO = gsap.utils.random(0, radiusX); if (randL > randO) [randL, randO] = [randO, randL]; gsap.timeline() .to(targets, { autoAlpha: 0, duration: slowDown, ease: "expo.inOut" }) .to(keepAll, { x: i => contractX[i], y: 0, duration: slowDown, ease: "expo.inOut" }, "+=0.1").to(keepAll, { x: (el, i) => i === 0 ? '+=0' // G: no change : `+=${ i === 1 ? randL : randO }`, y: () => `+=${ gsap.utils.random(-10, radiusY) }`, duration: slowDown, ease: "expo.inOut", stagger: { each: 0.05, from: 0 }}) .eventCallback("onComplete", () => { storedPositions = keepAll.map(el => { const rect = el.getBoundingClientRect(); return { absX: rect.left, absY: rect.top }; }); });}function runExpand() { if (splitInstance) { splitInstance.revert(); splitInstance = null; } currentFullname = (currentFullname + 1) % fullnameArray.length; displayName(); splitInstance = SplitText.create("#split", { type: "words,chars", wordsClass: "word++", charsClass: "char++" }); const chars = splitInstance.chars; const words = splitInstance.words; const stopWords = ["&","and","the","a","an","of"]; const sigWords = words .map(w => ({ el: w, text: w.textContent.trim() })) .filter(o => { const c = sanitize(o.text), r = o.text; return c && !stopWords.includes(c) && !/^\(.+\)$/.test(r); }); const keepAll = sigWords.map(o => firstLetterSpan(o.el)).filter(Boolean); const targets = chars.filter(c => !keepAll.includes(c)); const newRects = keepAll.map(el => el.getBoundingClientRect()); const deltas = newRects.map((rect, i) => ({ x: storedPositions[i].absX - rect.left, y: storedPositions[i].absY - rect.top })); const tl = gsap.timeline(); tl.set(keepAll, { x: i => deltas[i].x, y: i => deltas[i].y }, 0) .set(targets, { autoAlpha: 0 }, 0) .to(keepAll, { y: 0, duration: slowDown, ease: "power2.inOut" }, 0) .to(keepAll, { x: 0, duration: slowDown, ease: "back.out(1.7)" }, "+=0.1") .to(targets, { autoAlpha: 1, duration: slowDown, ease: "power1.inOut" }, "+=0.1") .eventCallback("onComplete", () => { splitInstance.revert(); splitInstance = null; });}function main() { fullnameArray = shuffle(fullnames); const saved = Cookies.get("current"); if (saved) currentFullname = parseInt(saved, 10); displayName(); document.fonts.ready.then(() => { ScrollTrigger.create({ trigger: ".logo-trigger-dummy", start: "top top", onEnter: runShrink, onLeaveBack: runExpand }); });}document.addEventListener("DOMContentLoaded", main);</script>
