# dannick10/quimpy architecture

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

- Interactive diagram: https://gitdiagram.com/dannick10/quimpy
- Repository: https://github.com/dannick10/quimpy

## Overview

#### Purpose and Entry Points
Quimpy is a browser-based 2D game built around a p5.js-style sketch loop. The application begins in `src/index.html`, loads game initialization and frame logic from `src/main/sketch.js`, and applies page/game presentation through `src/style.css`.

#### Runtime and Game Loop
`src/main/sketch.js` is the orchestration entry point for setup, rendering, and per-frame updates. `src/system/p5.js` provides the p5 integration boundary, while `src/system/preload.js` loads game assets before active play. This establishes the browser → p5 runtime → game-loop control flow.

#### Core Game State and Rules
Game-wide configuration, controls, and gameplay decisions are separated into the system layer:
- `src/system/config.js` holds shared game parameters/state constants.
- `src/system/controls.js` maps player input into gameplay actions.
- `src/system/gamelogic.js` coordinates rules such as collisions, progression, combat, collection, or state transitions.
- `src/system/ui.js` renders or manages game-facing UI states.

The main loop should invoke these services rather than embedding game rules in individual entities.

#### Entity Model
The game world is represented by specialized entity modules rooted in `src/entities/entity.js`. Movement-capable behavior is factored through `src/entities/moveentity.js`, with concrete world actors including:
- `src/entities/player.js` for the controllable character.
- `src/entities/enemies.js` for hostile actors.
- `src/entities/blocks.js` for terrain or interactive world blocks.
- `src/entities/coin.js` and `src/entities/power.js` for collectible/progression items.

Rendering or transient visual behavior is handled by `src/entities/animationEntity.js` and `src/entities/particle.js`; card-oriented gameplay is represented by `src/entities/card.js`.

#### Primary Flow and Boundaries
Input flows from `src/system/controls.js` into player/entity updates. Per-frame orchestration in `src/main/sketch.js` updates movable actors, evaluates gameplay interactions through `src/system/gamelogic.js`, and renders entities/UI. Entity modules own actor-local state and behavior; the system layer owns cross-entity rules, shared configuration, and UI coordination.

Asset loading is a distinct startup boundary: `src/system/preload.js` resolves sprites and audio before entities or gameplay depend on them.

#### Assets and External Dependencies
The runtime targets a browser and relies on p5-related functionality via `src/system/p5.js`. Visual assets are organized under `src/sprites`, including enemy and customization resources such as `src/sprites/enemy` and `src/sprites/customization/skin`. Audio is local static media under `src/sounds`, consumed by gameplay and UI events. No backend, database, or external service is indicated by the repository tree.

Main entry points: [`src/main/sketch.js`](https://github.com/dannick10/quimpy/blob/main/src/main/sketch.js) (Sketch loop), [`src/system/gamelogic.js`](https://github.com/dannick10/quimpy/blob/main/src/system/gamelogic.js) (Game rules), [`src/entities/player.js`](https://github.com/dannick10/quimpy/blob/main/src/entities/player.js) (Player), [`src/entities/enemies.js`](https://github.com/dannick10/quimpy/blob/main/src/entities/enemies.js) (Enemies)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_runtime["Browser Runtime"]
  node_page["Game page<br/>HTML entry<br/>[index.html]"]
  node_styles["Game styles<br/>CSS<br/>[style.css]"]
  node_sketch["Sketch loop<br/>game orchestrator<br/>[sketch.js]"]
  node_p5["p5 integration<br/>runtime adapter<br/>[p5.js]"]
end

subgraph group_system["Game Systems"]
  node_preload["Asset preload<br/>startup loader<br/>[preload.js]"]
  node_config["Game config<br/>shared state<br/>[config.js]"]
  node_controls["Controls<br/>input mapping<br/>[controls.js]"]
  node_gamelogic["Game rules<br/>rules coordinator<br/>[gamelogic.js]"]
  node_ui["Game UI<br/>UI system<br/>[ui.js]"]
end

subgraph group_entities["Entity Model"]
  node_entity["Base entity<br/>entity base<br/>[entity.js]"]
  node_moveentity["Movable entity<br/>movement base<br/>[moveentity.js]"]
  node_player["Player<br/>controllable actor<br/>[player.js]"]
  node_enemies["Enemies<br/>hostile actors<br/>[enemies.js]"]
  node_worlditems["Blocks and pickups<br/>world entities<br/>[blocks.js]"]
  node_visuals["Visual entities<br/>render effects<br/>[animationEntity.js]"]
end

subgraph group_assets["Static Assets"]
  node_sprites["Sprites<br/>visual assets"]
  node_sounds["Sounds<br/>audio assets"]
end

node_page -->|"loads"| node_sketch
node_page -->|"applies"| node_styles
node_sketch -->|"uses"| node_p5
node_sketch -->|"starts with"| node_preload
node_preload -->|"loads"| node_sprites
node_preload -->|"loads"| node_sounds
node_sketch -->|"reads"| node_config
node_sketch -->|"updates"| node_controls
node_controls -->|"drives actions"| node_player
node_sketch -->|"evaluates each frame"| node_gamelogic
node_gamelogic -->|"applies rules to"| node_player
node_gamelogic -->|"coordinates"| node_enemies
node_gamelogic -->|"collects and interacts"| node_worlditems
node_sketch -->|"renders"| node_ui
node_sketch -->|"updates and renders"| node_player
node_sketch -->|"updates and renders"| node_enemies
node_sketch -->|"renders"| node_worlditems
node_sketch -->|"renders"| node_visuals
node_entity -->|"base for"| node_moveentity
node_moveentity -->|"base for"| node_player
node_moveentity -->|"base for"| node_enemies
node_entity -->|"base for"| node_worlditems
node_entity -->|"base for"| node_visuals
node_player -.->|"uses"| node_sprites
node_enemies -.->|"uses"| node_sprites
node_gamelogic -.->|"triggers"| node_sounds
node_ui -.->|"triggers"| node_sounds

click node_page "https://github.com/dannick10/quimpy/blob/main/src/index.html"
click node_styles "https://github.com/dannick10/quimpy/blob/main/src/style.css"
click node_sketch "https://github.com/dannick10/quimpy/blob/main/src/main/sketch.js"
click node_p5 "https://github.com/dannick10/quimpy/blob/main/src/system/p5.js"
click node_preload "https://github.com/dannick10/quimpy/blob/main/src/system/preload.js"
click node_config "https://github.com/dannick10/quimpy/blob/main/src/system/config.js"
click node_controls "https://github.com/dannick10/quimpy/blob/main/src/system/controls.js"
click node_gamelogic "https://github.com/dannick10/quimpy/blob/main/src/system/gamelogic.js"
click node_ui "https://github.com/dannick10/quimpy/blob/main/src/system/ui.js"
click node_entity "https://github.com/dannick10/quimpy/blob/main/src/entities/entity.js"
click node_moveentity "https://github.com/dannick10/quimpy/blob/main/src/entities/moveentity.js"
click node_player "https://github.com/dannick10/quimpy/blob/main/src/entities/player.js"
click node_enemies "https://github.com/dannick10/quimpy/blob/main/src/entities/enemies.js"
click node_worlditems "https://github.com/dannick10/quimpy/blob/main/src/entities/blocks.js"
click node_visuals "https://github.com/dannick10/quimpy/blob/main/src/entities/animationEntity.js"
click node_sprites "https://github.com/dannick10/quimpy/tree/main/src/sprites"
click node_sounds "https://github.com/dannick10/quimpy/tree/main/src/sounds"

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_page,node_styles,node_sketch,node_p5 toneBlue
class node_preload,node_config,node_controls,node_gamelogic,node_ui toneAmber
class node_entity,node_moveentity,node_player,node_enemies,node_worlditems,node_visuals toneMint
class node_sprites,node_sounds toneRose
```

## Components

### Browser Runtime

- [Game page](https://github.com/dannick10/quimpy/blob/main/src/index.html): HTML entry · Loads the game and page presentation. · `src/index.html`
- [Game styles](https://github.com/dannick10/quimpy/blob/main/src/style.css): CSS · `src/style.css`
- [Sketch loop](https://github.com/dannick10/quimpy/blob/main/src/main/sketch.js): game orchestrator · Runs setup, frame updates, and rendering. · `src/main/sketch.js`
- [p5 integration](https://github.com/dannick10/quimpy/blob/main/src/system/p5.js): runtime adapter · `src/system/p5.js`

### Game Systems

- [Asset preload](https://github.com/dannick10/quimpy/blob/main/src/system/preload.js): startup loader · Loads media before active play. · `src/system/preload.js`
- [Game config](https://github.com/dannick10/quimpy/blob/main/src/system/config.js): shared state · `src/system/config.js`
- [Controls](https://github.com/dannick10/quimpy/blob/main/src/system/controls.js): input mapping · `src/system/controls.js`
- [Game rules](https://github.com/dannick10/quimpy/blob/main/src/system/gamelogic.js): rules coordinator · Evaluates cross-entity interactions and state transitions. · `src/system/gamelogic.js`
- [Game UI](https://github.com/dannick10/quimpy/blob/main/src/system/ui.js): UI system · `src/system/ui.js`

### Entity Model

- [Base entity](https://github.com/dannick10/quimpy/blob/main/src/entities/entity.js): entity base · `src/entities/entity.js`
- [Movable entity](https://github.com/dannick10/quimpy/blob/main/src/entities/moveentity.js): movement base · `src/entities/moveentity.js`
- [Player](https://github.com/dannick10/quimpy/blob/main/src/entities/player.js): controllable actor · `src/entities/player.js`
- [Enemies](https://github.com/dannick10/quimpy/blob/main/src/entities/enemies.js): hostile actors · `src/entities/enemies.js`
- [Blocks and pickups](https://github.com/dannick10/quimpy/blob/main/src/entities/blocks.js): world entities · Terrain, coins, and power items. · `src/entities/blocks.js`
- [Visual entities](https://github.com/dannick10/quimpy/blob/main/src/entities/animationEntity.js): render effects · Animations, particles, and cards. · `src/entities/animationEntity.js`

### Static Assets

- [Sprites](https://github.com/dannick10/quimpy/tree/main/src/sprites): visual assets · Includes enemy and skin resources. · `src/sprites`
- [Sounds](https://github.com/dannick10/quimpy/tree/main/src/sounds): audio assets · `src/sounds`

## Connections

- Game page → Sketch loop: loads
- Game page → Game styles: applies
- Sketch loop → p5 integration: uses
- Sketch loop → Asset preload: starts with
- Asset preload → Sprites: loads
- Asset preload → Sounds: loads
- Sketch loop → Game config: reads
- Sketch loop → Controls: updates
- Controls → Player: drives actions
- Sketch loop → Game rules: evaluates each frame
- Game rules → Player: applies rules to
- Game rules → Enemies: coordinates
- Game rules → Blocks and pickups: collects and interacts
- Sketch loop → Game UI: renders
- Sketch loop → Player: updates and renders
- Sketch loop → Enemies: updates and renders
- Sketch loop → Blocks and pickups: renders
- Sketch loop → Visual entities: renders
- Base entity → Movable entity: base for
- Movable entity → Player: base for
- Movable entity → Enemies: base for
- Base entity → Blocks and pickups: base for
- Base entity → Visual entities: base for
- Player → Sprites: uses
- Enemies → Sprites: uses
- Game rules → Sounds: triggers
- Game UI → Sounds: triggers