← All Wireframes WF-04 Video Explorer Modal src/pages/videos.astro · VideoExplorer.jsx · 1440 × 1960 px VideoExplorer.jsx VideoModal.jsx client:load island
This file shows two states: (A) the Videos page grid view, and (B) the modal overlay that appears when a video is clicked.
STATE A — GRID VIEW (videos.astro + VideoExplorer.jsx) SPACEWAYS OF SUN RA Discography Timeline Videos Musicians Poetry Films Books Magazines IIIF Home / Videos Videos Live performances, concert recordings & rare footage ERA All Chicago NYC Egypt Montreux 1980s 42 videos 1:47 YouTube Sun Ra and His Arkestra Montreux Jazz Festival · 1976 Montreux Palais de Beaulieu · 87 min set NOW PLAYING Cairo — Sun Ra & Arkestra Cairo, Egypt · October 1971 Egypt Historic outdoor performance · rare footage Slug's Saloon, Lower East Side New York City · 1966 NYC Slug's Saloon era recordings FILM Space Is the Place (1974) Dir. John Coney · Feature film Film 85 min · Oakland, 1972 production RAI Broadcast, Rome Rome, Italy · 1977 Late RAI television recording · 55 min Chicago Live, late 1950s Chicago, Illinois · c.1958–61 Chicago DuSable Lounge · early Arkestra VideoExplorer.jsx · 3-col grid STATE B — MODAL OPEN (clicking a video card triggers VideoModal.jsx overlay) Now Playing · Montreux Jazz Festival 1976 Esc 27:14 1:47:22 ⏮ ⏸ ⏭ ▶ Embedded YouTube · lazy-loaded via IntersectionObserver YouTube iframe (lazy) Montreux Sun Ra & His Arkestra at Montreux Jazz Fest YEAR 1976 CITY Montreux, Switzerland VENUE Palais de Beaulieu DURATION 1h 47m SOURCE YouTube · Official upload Full concert with extended Arkestra set. Features John Gilmore, Marshall Allen, Danny Davis, and June Tyson. live Arkestra Montreux 1976 ▶ Open on YouTube View Timeline → metadata panel · VideoModal.jsx RELATED VIDEOS Egypt 1971 NYC 1968 Montreux ← NOW Rome 1977 Space Is The Place (1974) Prev Next VideoModal.jsx · focus-trap · Esc to close IMPLEMENTATION NOTES Phase 4: VideoExplorer.jsx + VideoModal.jsx (client:load island) Phase 7: YouTube iframes lazy-loaded via IntersectionObserver / client:visible Phase 7: aria-label on all controls, focus-trap in modal, Esc key to close