francy51
316a44661b
- Restructure flat static prototype into pnpm workspace monorepo - apps/game: playable shell with R3F 3D scene, HUD, SpacetimeDB connection - apps/docs: design docs and prototypes - apps/site: landing page - packages/ui: shared Button and Panel primitives - services/spacetimedb: backend module (9 tables, 11 reducers) - Archive legacy static files to archive/legacy-static/ - Game loop: connect, undock, target, approach, dock, mine, sell - Add pnpm-workspace.yaml, tsconfig.base.json, spacetime.json
80 lines
3.0 KiB
JavaScript
80 lines
3.0 KiB
JavaScript
window.GDD = window.GDD || {};
|
|
|
|
const GDD = window.GDD;
|
|
const { useState, useEffect } = React;
|
|
|
|
const NAV_SECTIONS = [
|
|
{
|
|
title: 'Documentation',
|
|
items: [
|
|
{ id: 'overview', icon: '◈', label: 'Overview' },
|
|
{ id: 'architecture', icon: '⬡', label: 'Architecture' },
|
|
{ id: 'techstack', icon: '⟐', label: 'Tech Stack' },
|
|
{ id: 'backend', icon: '⊞', label: 'Backend Model' },
|
|
{ id: 'agents', icon: '⏣', label: 'Agent Lifecycle' },
|
|
{ id: 'gameplay', icon: '◉', label: 'Gameplay Loop' },
|
|
{ id: 'ships', icon: '◇', label: 'Ships & Fitting' },
|
|
{ id: 'economy', icon: '⇄', label: 'Economy & Industry' },
|
|
{ id: 'social', icon: '✧', label: 'Progression & Social' },
|
|
{ id: 'ship-ai', icon: '◈', label: 'Ship AI — Zora' },
|
|
{ id: 'roadmap', icon: '⊞', label: 'Roadmap' },
|
|
{ id: 'risks', icon: '◬', label: 'Risks & Questions' },
|
|
{ id: 'demo-gallery', icon: '◈', label: 'Demo Gallery' },
|
|
]
|
|
},
|
|
{
|
|
title: 'Interactive Demos',
|
|
items: [
|
|
{ id: 'demo-starmap', icon: '✦', label: 'Star Map' },
|
|
{ id: 'demo-movement', icon: '→', label: 'Ship Movement' },
|
|
{ id: 'demo-combat', icon: '✸', label: 'Combat System' },
|
|
{ id: 'demo-market', icon: '⇄', label: 'Market' },
|
|
{ id: 'demo-fitting', icon: '⊞', label: 'Ship Fitting' },
|
|
{ id: 'demo-refining', icon: '⚗', label: 'Refining & MFG' },
|
|
{ id: 'demo-progression', icon: '▲', label: 'Skill Progression' },
|
|
{ id: 'demo-bounty', icon: '✸', label: 'Bounty & Kill Feed' },
|
|
{ id: 'demo-gamehud', icon: '◉', label: 'Game HUD' },
|
|
{ id: 'demo-chat', icon: '💬', label: 'Chat & Comms' },
|
|
{ id: 'demo-zora', icon: '🤖', label: 'Zora Tier 0' },
|
|
{ id: 'demo-galaxy', icon: '🌌', label: 'Galaxy Gen' },
|
|
]
|
|
}
|
|
];
|
|
|
|
function Sidebar({ collapsed, currentPage, onNavigate, onToggle }) {
|
|
const [hoveredItem, setHoveredItem] = useState(null);
|
|
|
|
return (
|
|
<aside className={`sidebar${collapsed ? ' collapsed' : ''}`}>
|
|
<div className="sidebar-header">
|
|
<div className="sidebar-logo">
|
|
GDD<span className="logo-dot">::</span>DOCS
|
|
</div>
|
|
</div>
|
|
<nav className="sidebar-nav">
|
|
{NAV_SECTIONS.map((section, si) => (
|
|
<div key={si}>
|
|
<div className="nav-section-title">{section.title}</div>
|
|
{section.items.map((item) => (
|
|
<a
|
|
key={item.id}
|
|
className={`nav-item${currentPage === item.id ? ' active' : ''}`}
|
|
href={`#${item.id}`}
|
|
onClick={(e) => { e.preventDefault(); onNavigate(item.id); }}
|
|
onMouseEnter={() => setHoveredItem(item.id)}
|
|
onMouseLeave={() => setHoveredItem(null)}
|
|
>
|
|
<span className="nav-icon">{item.icon}</span>
|
|
<span className="nav-label">{item.label}</span>
|
|
|
|
</a>
|
|
))}
|
|
</div>
|
|
))}
|
|
</nav>
|
|
</aside>
|
|
);
|
|
}
|
|
|
|
GDD.Sidebar = Sidebar;
|