Home

verycracked / starbase

publicverycracked/Starbase
Overview Code History Branches Pull requestsIssuesInsights
main
HomeOverview Code PRsIssues

Replace STARBASE intro splash with GitHub login gate

7 months ago

2195561
Authored
V.C. Billingsley2/20/2026, 5:51:59 AM
Remove the timed STARBASE dissolve-in/out intro that played on every
page load. Replace it with a full-screen login gate that blocks access
to the graph until the user authenticates via GitHub OAuth.

Login screen design:
- STARBASE title in Geist Pixel (56px, centered) preserving brand
- "explore your codebase" subtitle (11px uppercase, tertiary color)
- "Sign in with GitHub" button with GitHub SVG icon
- Animated 2D canvas starfield background (1200 stars with parallax
  drift and twinkle) for visual continuity with the 3D graph
- Content fades in via .show-content class transition

Auth flow:
- On page load, the login overlay renders immediately at opacity:1
  (no flash of graph content) and calls /api/me to check session
- If authenticated: overlay is removed instantly, graph loads normally
- If not authenticated: login content fades in, button redirects to
  /auth/github which starts the OAuth flow
- On OAuth callback (URL contains #authenticated): overlay is removed,
  hash is cleared, auth state is refreshed
- On sign out: showLogin() re-adds the overlay and fades content in

This is optimal over a route-based approach because the app is a
single-page 3D visualization — there's no router, and the graph
initializes eagerly. A DOM overlay that gates visibility is the
lightest mechanism: zero bundle cost, no routing library, and the
graph's WebGL context stays warm behind the overlay so there's no
re-initialization delay after login.

Parent9b93d47

2 files changed
  • src/main.js+137−29
  • src/styles.css+65−11