# roshan-in/astroverse architecture

> Architecture diagram of the GitHub repository roshan-in/astroverse, generated by GitDiagram from its file tree, README and a sample of source files (last updated 2026-11-10). It is an AI-made overview: check details against the source.

- Interactive diagram: https://gitdiagram.com/roshan-in/astroverse
- Repository: https://github.com/roshan-in/astroverse

## Overview

AstroVerse is a set of interactive space-learning pages rather than an integrated homepage: visitors choose a page and explore 3D solar-system views, mission content and a quiz, cosmic facts, or visual effects. The README maps each page to its script and styles; sampled JavaScript shows the main interactions, rendering, texture loading, and browser-based quiz records. The Solar System and Planet Explorer use Three.js from a CDN. The effects preview is described as still in development. Relationships not shown in excerpts are based only on README documentation.

Main entry points: [`solar-system.html`](https://github.com/roshan-in/astroverse/blob/main/solar-system.html) (Solar System Page), [`JavaScript/solar-system.js`](https://github.com/roshan-in/astroverse/blob/main/JavaScript/solar-system.js) (Orbital Scene), [`planet-explorer.html`](https://github.com/roshan-in/astroverse/blob/main/planet-explorer.html) (Explorer Page), [`JavaScript/explorer.js`](https://github.com/roshan-in/astroverse/blob/main/JavaScript/explorer.js) (Planet Viewer)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_solar["Solar System"]
  node_solarpage["Solar System Page<br/>[solar-system.html]"]
  node_solarview["Orbital Scene<br/>[solar-system.js]"]
  node_solartextures["Planet Textures"]
  node_solarstyles["Solar Styles<br/>[solar-system.css]"]
end

subgraph group_explorer["Planet Explorer"]
  node_explorerpage["Explorer Page"]
  node_explorerview["Planet Viewer<br/>[explorer.js]"]
  node_explorerstyles["Explorer Styles<br/>[explorer.css]"]
end

subgraph group_missions["Missions and Quiz"]
  node_missionspage["Missions Page"]
  node_quiz["Quiz and Progress<br/>[missions.js]"]
  node_browserstorage[("Browser Storage")]
  node_missionstyles["Mission Styles<br/>[missions.css]"]
end

subgraph group_discoveries["Cosmic Discoveries"]
  node_discoveriespage["Discoveries Page"]
  node_discoveries["Fact Filters"]
  node_discoverystyles["Discovery Styles"]
end

subgraph group_effects["Effects Preview"]
  node_effectspage["Effects Preview"]
  node_effects["Visual Effects<br/>[cosmic-effects.js]"]
  node_effectsstyles["Effects Styles<br/>[cosmic-effects.css]"]
end

node_visitor(("Visitor"))
node_three["Three.js CDN"]

node_visitor -->|"opens"| node_solarpage
node_solarpage -->|"starts"| node_solarview
node_solarpage -->|"uses styles"| node_solarstyles
node_solarview -->|"loads textures"| node_solartextures
node_solarview -->|"imports"| node_three
node_visitor -->|"opens"| node_explorerpage
node_explorerpage -->|"starts"| node_explorerview
node_explorerpage -->|"uses styles"| node_explorerstyles
node_explorerview -->|"loads textures"| node_solartextures
node_explorerview -->|"imports"| node_three
node_visitor -->|"opens"| node_missionspage
node_missionspage -->|"starts"| node_quiz
node_missionspage -->|"uses styles"| node_missionstyles
node_quiz -->|"saves records"| node_browserstorage
node_browserstorage -->|"restores records"| node_quiz
node_visitor -->|"opens"| node_discoveriespage
node_discoveriespage -->|"starts"| node_discoveries
node_discoveriespage -->|"uses styles"| node_discoverystyles
node_visitor -->|"opens"| node_effectspage
node_effectspage -->|"starts"| node_effects
node_effectspage -->|"uses styles"| node_effectsstyles

click node_solarpage "https://github.com/roshan-in/astroverse/blob/main/solar-system.html"
click node_solarview "https://github.com/roshan-in/astroverse/blob/main/JavaScript/solar-system.js"
click node_solartextures "https://github.com/roshan-in/astroverse/tree/main/assets/textures/solar-system"
click node_solarstyles "https://github.com/roshan-in/astroverse/blob/main/CSS/solar-system.css"
click node_explorerpage "https://github.com/roshan-in/astroverse/blob/main/planet-explorer.html"
click node_explorerview "https://github.com/roshan-in/astroverse/blob/main/JavaScript/explorer.js"
click node_explorerstyles "https://github.com/roshan-in/astroverse/blob/main/CSS/explorer.css"
click node_missionspage "https://github.com/roshan-in/astroverse/blob/main/space-missions.html"
click node_quiz "https://github.com/roshan-in/astroverse/blob/main/JavaScript/missions.js"
click node_missionstyles "https://github.com/roshan-in/astroverse/blob/main/CSS/missions.css"
click node_discoveriespage "https://github.com/roshan-in/astroverse/blob/main/cosmic-discoveries.html"
click node_discoveries "https://github.com/roshan-in/astroverse/blob/main/JavaScript/cosmic-discoveries.js"
click node_discoverystyles "https://github.com/roshan-in/astroverse/blob/main/CSS/cosmic-discoveries.css"
click node_effectspage "https://github.com/roshan-in/astroverse/blob/main/effects-preview.html"
click node_effects "https://github.com/roshan-in/astroverse/blob/main/JavaScript/cosmic-effects.js"
click node_effectsstyles "https://github.com/roshan-in/astroverse/blob/main/CSS/cosmic-effects.css"

classDef toneNeutral fill:#f8fafc,stroke:#334155,stroke-width:1.5px,color:#0f172a
classDef toneBlue fill:#dbeafe,stroke:#2563eb,stroke-width:1.5px,color:#172554
classDef toneAmber fill:#fef3c7,stroke:#d97706,stroke-width:1.5px,color:#78350f
classDef toneMint fill:#dcfce7,stroke:#16a34a,stroke-width:1.5px,color:#14532d
classDef toneRose fill:#ffe4e6,stroke:#e11d48,stroke-width:1.5px,color:#881337
classDef toneIndigo fill:#e0e7ff,stroke:#4f46e5,stroke-width:1.5px,color:#312e81
classDef toneTeal fill:#ccfbf1,stroke:#0f766e,stroke-width:1.5px,color:#134e4a
class node_solarpage,node_solarview,node_solartextures,node_solarstyles toneBlue
class node_explorerpage,node_explorerview,node_explorerstyles toneAmber
class node_missionspage,node_quiz,node_browserstorage,node_missionstyles toneMint
class node_discoveriespage,node_discoveries,node_discoverystyles toneRose
class node_effectspage,node_effects,node_effectsstyles,node_visitor,node_three toneIndigo
```

## Components

### Solar System

- [Solar System Page](https://github.com/roshan-in/astroverse/blob/main/solar-system.html): `solar-system.html`
- [Orbital Scene](https://github.com/roshan-in/astroverse/blob/main/JavaScript/solar-system.js): `JavaScript/solar-system.js`
- [Planet Textures](https://github.com/roshan-in/astroverse/tree/main/assets/textures/solar-system): `assets/textures/solar-system`
- [Solar Styles](https://github.com/roshan-in/astroverse/blob/main/CSS/solar-system.css): `CSS/solar-system.css`

### Planet Explorer

- [Explorer Page](https://github.com/roshan-in/astroverse/blob/main/planet-explorer.html): `planet-explorer.html`
- [Planet Viewer](https://github.com/roshan-in/astroverse/blob/main/JavaScript/explorer.js): `JavaScript/explorer.js`
- [Explorer Styles](https://github.com/roshan-in/astroverse/blob/main/CSS/explorer.css): `CSS/explorer.css`

### Missions and Quiz

- [Missions Page](https://github.com/roshan-in/astroverse/blob/main/space-missions.html): `space-missions.html`
- [Quiz and Progress](https://github.com/roshan-in/astroverse/blob/main/JavaScript/missions.js): `JavaScript/missions.js`
- **Browser Storage**
- [Mission Styles](https://github.com/roshan-in/astroverse/blob/main/CSS/missions.css): `CSS/missions.css`

### Cosmic Discoveries

- [Discoveries Page](https://github.com/roshan-in/astroverse/blob/main/cosmic-discoveries.html): `cosmic-discoveries.html`
- [Fact Filters](https://github.com/roshan-in/astroverse/blob/main/JavaScript/cosmic-discoveries.js): `JavaScript/cosmic-discoveries.js`
- [Discovery Styles](https://github.com/roshan-in/astroverse/blob/main/CSS/cosmic-discoveries.css): `CSS/cosmic-discoveries.css`

### Effects Preview

- [Effects Preview](https://github.com/roshan-in/astroverse/blob/main/effects-preview.html): `effects-preview.html`
- [Visual Effects](https://github.com/roshan-in/astroverse/blob/main/JavaScript/cosmic-effects.js): `JavaScript/cosmic-effects.js`
- [Effects Styles](https://github.com/roshan-in/astroverse/blob/main/CSS/cosmic-effects.css): `CSS/cosmic-effects.css`

### Other components

- **Visitor**
- **Three.js CDN**

## Connections

- Visitor → Solar System Page: opens (evidence: `README.md`)
- Solar System Page → Orbital Scene: starts (evidence: `README.md`)
- Solar System Page → Solar Styles: uses styles (evidence: `README.md`)
- Orbital Scene → Planet Textures: loads textures (evidence: `JavaScript/solar-system.js`)
- Orbital Scene → Three.js CDN: imports (evidence: `JavaScript/solar-system.js`)
- Visitor → Explorer Page: opens (evidence: `README.md`)
- Explorer Page → Planet Viewer: starts (evidence: `README.md`)
- Explorer Page → Explorer Styles: uses styles (evidence: `README.md`)
- Planet Viewer → Planet Textures: loads textures (evidence: `JavaScript/explorer.js`)
- Planet Viewer → Three.js CDN: imports (evidence: `JavaScript/explorer.js`)
- Visitor → Missions Page: opens (evidence: `README.md`)
- Missions Page → Quiz and Progress: starts (evidence: `README.md`)
- Missions Page → Mission Styles: uses styles (evidence: `README.md`)
- Quiz and Progress → Browser Storage: saves records (evidence: `JavaScript/missions.js`)
- Browser Storage → Quiz and Progress: restores records (evidence: `JavaScript/missions.js`)
- Visitor → Discoveries Page: opens (evidence: `README.md`)
- Discoveries Page → Fact Filters: starts (evidence: `README.md`)
- Discoveries Page → Discovery Styles: uses styles (evidence: `README.md`)
- Visitor → Effects Preview: opens (evidence: `README.md`)
- Effects Preview → Visual Effects: starts (evidence: `README.md`)
- Effects Preview → Effects Styles: uses styles (evidence: `README.md`)