# rorishiga-blip/quiz architecture

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

- Interactive diagram: https://gitdiagram.com/rorishiga-blip/quiz
- Repository: https://github.com/rorishiga-blip/quiz

## Overview

This is a small browser-based Java basics quiz. The user starts a quiz, selects answers, advances through questions, and sees a score-based result; finishing also opens a video modal. The sampled JavaScript contains the question data, quiz state and DOM event logic. The tree also includes HTML and CSS, but their contents were not sampled, so their precise wiring and presentation details are not asserted.

Main entry points: [`script.js`](https://github.com/rorishiga-blip/quiz/blob/main/script.js) (Quiz flow), [`index.html`](https://github.com/rorishiga-blip/quiz/blob/main/index.html) (Quiz interface), [`style.css`](https://github.com/rorishiga-blip/quiz/blob/main/style.css) (Page styling)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_quiz["Quiz experience"]
  node_quiz_app["Quiz interface<br/>[index.html]"]
  node_quiz_logic["Quiz flow<br/>[script.js]"]
  node_questions["Question set<br/>[script.js]"]
  node_result["Score result<br/>[script.js]"]
end

subgraph group_extras["Presentation extras"]
  node_video["Video modal<br/>[script.js]"]
  node_theme["Theme toggle<br/>[script.js]"]
  node_styles["Page styling<br/>[style.css]"]
end

node_user(("Quiz taker"))

node_user -->|"uses"| node_quiz_app
node_quiz_logic -->|"updates DOM"| node_quiz_app
node_quiz_logic -->|"reads questions"| node_questions
node_quiz_logic -->|"shows result"| node_result
node_quiz_logic -->|"opens on completion"| node_video
node_quiz_logic -->|"handles toggle"| node_theme
node_styles -.->|"styles"| node_quiz_app

click node_quiz_app "https://github.com/rorishiga-blip/quiz/blob/main/index.html"
click node_quiz_logic "https://github.com/rorishiga-blip/quiz/blob/main/script.js"
click node_questions "https://github.com/rorishiga-blip/quiz/blob/main/script.js"
click node_result "https://github.com/rorishiga-blip/quiz/blob/main/script.js"
click node_video "https://github.com/rorishiga-blip/quiz/blob/main/script.js"
click node_theme "https://github.com/rorishiga-blip/quiz/blob/main/script.js"
click node_styles "https://github.com/rorishiga-blip/quiz/blob/main/style.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_quiz_app,node_quiz_logic,node_questions,node_result toneBlue
class node_video,node_theme,node_styles toneAmber
class node_user toneIndigo
```

## Components

### Quiz experience

- [Quiz interface](https://github.com/rorishiga-blip/quiz/blob/main/index.html): `index.html`
- [Quiz flow](https://github.com/rorishiga-blip/quiz/blob/main/script.js): `script.js`
- [Question set](https://github.com/rorishiga-blip/quiz/blob/main/script.js): `script.js`
- [Score result](https://github.com/rorishiga-blip/quiz/blob/main/script.js): `script.js`

### Presentation extras

- [Video modal](https://github.com/rorishiga-blip/quiz/blob/main/script.js): `script.js`
- [Theme toggle](https://github.com/rorishiga-blip/quiz/blob/main/script.js): `script.js`
- [Page styling](https://github.com/rorishiga-blip/quiz/blob/main/style.css): `style.css`

### Other components

- **Quiz taker**

## Connections

- Quiz taker → Quiz interface: uses
- Quiz flow → Quiz interface: updates DOM (evidence: `script.js`)
- Quiz flow → Question set: reads questions (evidence: `script.js`)
- Quiz flow → Score result: shows result (evidence: `script.js`)
- Quiz flow → Video modal: opens on completion (evidence: `script.js`)
- Quiz flow → Theme toggle: handles toggle (evidence: `script.js`)
- Page styling → Quiz interface: styles