; } // ══════════════════════════════════════════════════════════════════════════ // SCENE 1 — INTRO / LOGO REVEAL // Timing: 0–5s. Black. Type flies in letter by letter for "JONAS GROUP" // (classical roman wordmark), underlined with the ENTERTAINMENT spaced-cap, // then a fast "flash cut" whiteout exit. // ══════════════════════════════════════════════════════════════════════════ function SceneIntro() { const { progress, localTime, duration } = useSprite(); const pal = usePalette(); // Letters animate in sequentially const letters = 'JONAS GROUP'.split(''); const letterStart = 0.4; // seconds const letterStagger = 0.08; const entertainmentStart = 1.8; const flashStart = duration - 0.45; // Flash whiteout at end const flashT = localTime < flashStart ? 0 : (localTime - flashStart) / 0.4; return ( <> {/* Hairline cross */}

{/* Wordmark */}

{letters.map((ch, i) => { const t = clamp((localTime - letterStart - i * letterStagger) / 0.5, 0, 1); const eased = Easing.easeOutCubic(t); return ( {ch} ); })}

{/* ENTERTAINMENT */}

ENTERTAINMENT

{/* Flash whiteout */}

); } // ══════════════════════════════════════════════════════════════════════════ // SCENE 2 — THESIS STATEMENT // Timing: 5–10s. Slab of display type with huge tracking contrast. // "WE DON'T CHASE CULTURE. / WE WRITE IT." // ══════════════════════════════════════════════════════════════════════════ function SceneThesis() { const { localTime, duration } = useSprite(); const pal = usePalette(); const exitStart = duration - 0.4; const line1T = clamp((localTime - 0.15) / 0.9, 0, 1); const line2T = clamp((localTime - 0.9) / 0.9, 0, 1); const exitT = localTime > exitStart ? (localTime - exitStart) / 0.4 : 0; return ( <>

· THE JONAS GROUP ENTERTAINMENT THESIS ·

We don't chase culture.

We write it.

); } // ══════════════════════════════════════════════════════════════════════════ // SCENE 3 — CATALOG REVEAL // Timing: 10–19s. "CATALOGS UNDER MANAGEMENT" header. // Five catalog names punch in stacked with hairline counters on the left. // ══════════════════════════════════════════════════════════════════════════ const CATALOGS = [ { name: 'THE JONAS BROTHERS', sub: 'SELECT CATALOG & SONG RIGHTS · 2025 ACQUISITION' }, { name: 'JULIA MICHAELS', sub: 'SONGWRITER CATALOG · ACQUISITION' }, { name: 'RHETT AKINS', sub: 'SONGWRITER CATALOG' }, { name: 'JUSTIN EBACH', sub: 'SONGWRITER / PRODUCER CATALOG' }, { name: 'DANGER TWINS', sub: 'SONGWRITER CATALOG' }, ]; function SceneCatalog() { const { localTime, duration } = useSprite(); const pal = usePalette(); const headerT = Easing.easeOutCubic(clamp(localTime / 0.7, 0, 1)); const itemStagger = 0.55; const itemStart = 1.0; const exitStart = duration - 0.5; const exitT = localTime > exitStart ? (localTime - exitStart) / 0.5 : 0; return ( <> {/* vertical rule */}

{/* HEADER */}

01 · CATALOG

Catalogs under management

{/* LIST */}

{CATALOGS.map((cat, i) => { const t = clamp((localTime - itemStart - i * itemStagger) / 0.6, 0, 1); const eased = Easing.easeOutCubic(t); return (

0{i + 1}

{cat.name}

{cat.sub}

); })}

{/* FOOTER STAT */}

JONAS CATALOG HOLDINGS

investing in music that outlasts the cycle

); } // ══════════════════════════════════════════════════════════════════════════ // SCENE 4 — ROSTER (full-bleed portraits, each 1.7s, then a grid) // Timing: 15–30s (15s total; 6 portraits @ 1.7s = 10.2s, then ~4.5s grid) // ══════════════════════════════════════════════════════════════════════════ const ROSTER = [ { name: 'RAELYNN', sub: 'ARTIST · VALORY MUSIC / BIG MACHINE', img: (window.__ASSETS && window.__ASSETS.raelynn) || '../assets/artist-raelynn.png' }, { name: 'AARON GILLESPIE', sub: 'ARTIST · FROM UNDEROATH', img: (window.__ASSETS && window.__ASSETS.aaron) || '../assets/artist-aaron.jpeg' }, { name: 'BAILEE MADISON', sub: 'ACTOR → MUSIC ARTIST', img: (window.__ASSETS && window.__ASSETS.bailee) || '../assets/artist-bailee.png' }, { name: 'FRANKLIN JONAS', sub: 'ARTIST', img: (window.__ASSETS && window.__ASSETS.franklin) || '../assets/artist-franklin.jpg' }, { name: 'DAN MARSHALL', sub: 'ARTIST', img: (window.__ASSETS && window.__ASSETS.dan) || '../assets/artist-dan.jpeg' }, { name: 'HUNTER HAWKINS', sub: 'ARTIST', img: (window.__ASSETS && window.__ASSETS.hunter) || '../assets/artist-hunter.png' }, { name: 'AMY STROUP', sub: 'ARTIST · DANGER TWINS', img: (window.__ASSETS && window.__ASSETS.amy) || '../assets/artist-amy.png' }, ]; function SceneRoster() { const { localTime, duration } = useSprite(); const pal = usePalette(); const bleedCount = 6; const bleedDur = 1.7; const bleedTotal = bleedCount * bleedDur; const gridStart = bleedTotal; const gridDur = duration - gridStart - 0.3; // Which bleed portrait is active right now? const bleedIdx = Math.floor(localTime / bleedDur); const localInBleed = localTime - bleedIdx * bleedDur; const inBleedPhase = localTime < bleedTotal; // Transition between bleeds: 0.35s fade const fadeIn = clamp(localInBleed / 0.35, 0, 1); const fadeOut = localInBleed > bleedDur - 0.35 ? 1 - (localInBleed - (bleedDur - 0.35)) / 0.35 : 1; const bleedOpacity = Math.min(fadeIn, fadeOut); return ( <> {/* --- FULL-BLEED PHASE --- */} {inBleedPhase && ROSTER[bleedIdx] && ( )} {/* --- GRID PHASE --- */} {!inBleedPhase && ( )} {/* Persistent counter bottom-left during bleed phase */} {inBleedPhase && (

{String(bleedIdx + 1).padStart(2, '0')} / {String(ROSTER.length).padStart(2, '0')} · ARTIST ROSTER

)} ); } function FullBleedPortrait({ artist, index, localTime, dur, pal, opacity }) { // Ken Burns slow zoom const kbScale = 1.0 + (localTime / dur) * 0.08; // Name slides in from left at 0.3s const nameT = Easing.easeOutCubic(clamp((localTime - 0.25) / 0.6, 0, 1)); return ( <> {/* Image — offset to right third so left side is dark for type */}

{/* Left side gradient blur to merge with black */}

{/* Subtle bottom vignette */}

{/* Type stack — large italic first name, spaced last name */}

{String(index + 1).padStart(2, '0')} · JGE ROSTER

{artist.name}

{artist.sub}

); } function RosterGrid({ localTime, dur, pal }) { const headerT = Easing.easeOutCubic(clamp(localTime / 0.5, 0, 1)); const items = ROSTER; return ( <>

02 · ROSTER

Artists we represent

{items.length} artists

{items.map((a, i) => { const t = clamp((localTime - 0.4 - i * 0.1) / 0.55, 0, 1); const eased = Easing.easeOutCubic(t); return (

{a.name}

{a.sub}

); })} {/* "& more" placeholder to balance the 8th grid cell */} {(() => { const i = items.length; const t = clamp((localTime - 0.4 - i * 0.1) / 0.55, 0, 1); const eased = Easing.easeOutCubic(t); return (

& more

ACTIVE ROSTER ACROSS PUBLISHING, RECORDS & MANAGEMENT

); })()}

); } // ══════════════════════════════════════════════════════════════════════════ // SCENE 5 — RADIO CHART MOMENT // Timing: 32–38s. "I DARE YOU" Rascal Flatts × Jonas Brothers moment. // ══════════════════════════════════════════════════════════════════════════ function SceneRadio() { const { localTime, duration } = useSprite(); const pal = usePalette(); const t1 = Easing.easeOutCubic(clamp(localTime / 0.6, 0, 1)); const t2 = Easing.easeOutCubic(clamp((localTime - 0.5) / 0.7, 0, 1)); const t3 = Easing.easeOutCubic(clamp((localTime - 1.5) / 0.7, 0, 1)); const t4 = Easing.easeOutCubic(clamp((localTime - 2.3) / 0.7, 0, 1)); const t5 = Easing.easeOutCubic(clamp((localTime - 3.1) / 0.7, 0, 1)); // Chart rising bars animate const chartProgress = clamp((localTime - 2.5) / (duration - 3.5), 0, 1); return ( <>

04 · RADIO · I DARE YOU

Our songs on the dial

{/* BIG STAT */}

TOP 10 SMASH · COUNTRY RADIO

"I Dare You."

Rascal Flatts × Jonas Brothers

CO-PUBLISHED BY JONAS GROUP PUBLISHING

{/* Rising chart bars */}

{Array.from({ length: 14 }).map((_, i) => { const seed = [32, 28, 44, 38, 52, 48, 66, 58, 74, 82, 70, 90, 96, 100][i]; const barT = clamp((localTime - 2.5 - i * 0.05) / 0.6, 0, 1); const h = Easing.easeOutCubic(barT) * seed * 2.2; const isPeak = i >= 11; return (

); })}

WK 1

WK 14 · TOP 10

{/* Second win */}

ALSO CHARTING

John Zach King — penned by Rhett Akins — climbing Country radio.

); } // ══════════════════════════════════════════════════════════════════════════ // SCENE 6 — AWARDS & WINS (marquee-style headline ticker + pinned wins) // Timing: 38–46s // ══════════════════════════════════════════════════════════════════════════ const WINS = [ { tag: 'NMPA ICON AWARD · 2025', line: 'Rhett Akins honored as', big: 'Non-Performing Songwriter Icon' }, { tag: 'SESAC · 2025', line: "Justin Ebach's", big: '"Relapse" wins SESAC Award' }, { tag: 'SIGNING · 2025', line: 'Aaron Gillespie inks with', big: 'Jonas Group Publishing' }, ]; function SceneAwards() { const { localTime, duration } = useSprite(); const pal = usePalette(); const headerT = Easing.easeOutCubic(clamp(localTime / 0.5, 0, 1)); const perCard = (duration - 1) / WINS.length; return ( <> {/* Marquee band at top */}

{Array(6).fill(0).map((_, i) => ( RECENT WINS · 2025 · JONAS GROUP ENTERTAINMENT · ))}

05 · WINS

Headlines from the year

{WINS.map((w, i) => { const start = 0.6 + i * perCard * 0.5; const t = clamp((localTime - start) / 0.7, 0, 1); const eased = Easing.easeOutCubic(t); return (

{w.tag}

{w.line}

{w.big}

0{i + 1}

); })}

); } // ══════════════════════════════════════════════════════════════════════════ // SCENE 7 — THREE PILLARS (Publishing / Red Van Records / Management) // Timing: 46–54s // ══════════════════════════════════════════════════════════════════════════ const PILLARS = [ { roman: 'I', name: 'JONAS GROUP\nPUBLISHING', tag: 'Champions acclaimed songwriters and catalogs from Nashville\'s Music Row.', metric: 'ACTIVE ROSTER + CATALOG ACQUISITIONS' }, { roman: 'II', name: 'RED VAN\nRECORDS', tag: 'In-house record label — the home for signings that don\'t fit the major-label mold.', metric: 'ARTIST-FIRST · A&R-LED' }, { roman: 'III', name: 'ARTIST\nMANAGEMENT', tag: 'Day-to-day representation for a select roster — creative, business, and team.', metric: 'FULL-SERVICE · BOUTIQUE SCALE' }, ]; function ScenePillars() { const { localTime, duration } = useSprite(); const pal = usePalette(); const headerT = Easing.easeOutCubic(clamp(localTime / 0.6, 0, 1)); return ( <>

06 · THE BUSINESS

Three pillars, one table

{PILLARS.map((p, i) => { const t = clamp((localTime - 0.6 - i * 0.35) / 0.7, 0, 1); const eased = Easing.easeOutCubic(t); return (

{p.roman}.

{p.name}

{p.tag}

{p.metric}

); })}

); } // ══════════════════════════════════════════════════════════════════════════ // SCENE 8 — CLOSE (logo lockup, address, fade) // Timing: 54–60s // ══════════════════════════════════════════════════════════════════════════ function SceneClose() { const { localTime, duration } = useSprite(); const pal = usePalette(); const t1 = Easing.easeOutCubic(clamp(localTime / 0.8, 0, 1)); const t2 = Easing.easeOutCubic(clamp((localTime - 0.6) / 0.8, 0, 1)); const t3 = Easing.easeOutCubic(clamp((localTime - 1.4) / 0.8, 0, 1)); const t4 = Easing.easeOutCubic(clamp((localTime - 2.2) / 0.8, 0, 1)); const fadeOut = localTime > duration - 0.8 ? (localTime - (duration - 0.8)) / 0.8 : 0; return ( <>

{/* Dividing rule */}

JONAS GROUP

ENTERTAINMENT

1600 17th Ave South · Nashville, TN 37212

JONASGROUP.COM

); } // ══════════════════════════════════════════════════════════════════════════ // SCENE 4.5 — AMY STROUP ARTIST HERO (full-bleed portrait + bio pull-quote) // Timing: 30–34.5s. Plays after the Roster grid as a "zoom in" deep dive on one artist. // ══════════════════════════════════════════════════════════════════════════ function SceneAmyHero() { const { localTime, duration } = useSprite(); const pal = usePalette(); // Ken Burns slow zoom const kbScale = 1.0 + (localTime / duration) * 0.08; const t1 = Easing.easeOutCubic(clamp(localTime / 0.5, 0, 1)); const t2 = Easing.easeOutCubic(clamp((localTime - 0.35) / 0.7, 0, 1)); const t3 = Easing.easeOutCubic(clamp((localTime - 1.0) / 0.7, 0, 1)); const t4 = Easing.easeOutCubic(clamp((localTime - 1.8) / 0.7, 0, 1)); const t5 = Easing.easeOutCubic(clamp((localTime - 2.6) / 0.7, 0, 1)); const fadeOut = localTime > duration - 0.4 ? 1 - (localTime - (duration - 0.4)) / 0.4 : 1; return ( <> {/* Portrait — right side */}

{/* Type stack left */}

03 · SONGWRITER SPOTLIGHT

The self-proclaimed “song farmer” —

Amy
Stroup.

Songs recorded by Chaka Khan & Ingrid Michaelson.
Sync placements in Grey's Anatomy, This Is Us, Disney's Willow.
Half of Danger Twins.

2.4B+

TIKTOK · YOUTUBE VIEWS

{/* Corner tag */}

JGP ROSTER · CATALOG ACQUIRED 2024

); } // ══════════════════════════════════════════════════════════════════════════ // SCENE 5.5 — "GET TO DRINKIN'" (pull-quote card, mirrors I Dare You) // Timing: 38–43s // ══════════════════════════════════════════════════════════════════════════ function SceneGetToDrinkin() { const { localTime, duration } = useSprite(); const pal = usePalette(); const t1 = Easing.easeOutCubic(clamp(localTime / 0.6, 0, 1)); const t2 = Easing.easeOutCubic(clamp((localTime - 0.5) / 0.7, 0, 1)); const t3 = Easing.easeOutCubic(clamp((localTime - 1.5) / 0.7, 0, 1)); const t4 = Easing.easeOutCubic(clamp((localTime - 2.3) / 0.7, 0, 1)); const t5 = Easing.easeOutCubic(clamp((localTime - 3.1) / 0.7, 0, 1)); const fadeOut = localTime > duration - 0.4 ? 1 - (localTime - (duration - 0.4)) / 0.4 : 1; return ( <>

04 · RADIO · GET TO DRINKIN'

The next one climbing

NEW RELEASE · COUNTRY RADIO

"Get to Drinkin'."

Penned by Rhett Akins

PUBLISHED BY JONAS GROUP PUBLISHING

{/* Rising waveform/bars */}

{Array.from({ length: 22 }).map((_, i) => { const seed = [22, 36, 28, 54, 42, 68, 50, 78, 60, 86, 72, 94, 80, 88, 70, 60, 52, 42, 32, 26, 20, 16][i]; const barT = clamp((localTime - 2.5 - i * 0.03) / 0.5, 0, 1); const h = Easing.easeOutCubic(barT) * seed * 1.9; return (

); })}

NOW SPINNING

COUNTRY FORMAT

{/* Context line */}

CATALOG

Another hit from the Akins catalog — working the dial.

); } // ── Global exports ────────────────────────────────────────────────────────── Object.assign(window, { PALETTES, usePalette, SceneIntro, SceneThesis, SceneCatalog, SceneRoster, SceneRadio, SceneAwards, ScenePillars, SceneClose, SceneAmyHero, SceneGetToDrinkin, FONT_DISPLAY, FONT_WORD, FONT_BODY, });