# lian1998/threejs-cube-gunman architecture

> Architecture diagram of the GitHub repository lian1998/threejs-cube-gunman, generated by GitDiagram from its file tree, README and a sample of source files (last updated 2026-09-28). It is an AI-made overview: check details against the source.

- Interactive diagram: https://gitdiagram.com/lian1998/threejs-cube-gunman
- Repository: https://github.com/lian1998/threejs-cube-gunman

## Overview

This repository is a browser-based Three.js first-person shooter. Its main runtime loads game resources, initializes registered gameplay and view-layer objects, then calls their frame updates. The principal play flow runs from keyboard/mouse input through player movement and weapon firing to raycast hit processing and visual effects, which are rendered as layered scenes. The README also documents inventory, weapon variants, and multiple firing and impact effects. Some modules were not sampled, so links are limited to wiring shown in source or explicitly described by the README.

Main entry points: [`src/main.ts`](https://github.com/lian1998/threejs-cube-gunman/blob/master/src/main.ts) (Runtime Bootstrap), [`src/gameplay/pipes/LayerEventPipe.ts`](https://github.com/lian1998/threejs-cube-gunman/blob/master/src/gameplay/pipes/LayerEventPipe.ts) (Layer Events), [`src/core/GameContext.ts`](https://github.com/lian1998/threejs-cube-gunman/blob/master/src/core/GameContext.ts) (Game Context), [`src/gameplay/weapon/WeaponSystem.ts`](https://github.com/lian1998/threejs-cube-gunman/blob/master/src/gameplay/weapon/WeaponSystem.ts) (Weapon System)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_runtime["Runtime Core"]
  node_main["Runtime Bootstrap<br/>[main.ts]"]
  node_context["Game Context<br/>[GameContext.ts]"]
  node_resources["Resource Loading<br/>[GameResources.ts]"]
  node_objects["Object Registry<br/>[GameObjectMap.ts]"]
end

subgraph group_gameplay["Gameplay"]
  node_input["Input System<br/>[UserInputSystem.ts]"]
  node_dompipe["DOM Event Pipe<br/>[DomEventPipe.ts]"]
  node_inputpipe["Input Event Pipe"]
  node_camera["FPS Camera"]
  node_movement["Movement Controller"]
  node_playerstate["Local Player<br/>[LocalPlayer.ts]"]
  node_level["Mirage Level<br/>[LevelMirage.ts]"]
  node_inventory["Inventory System<br/>[InventorySystem.ts]"]
end

subgraph group_combat["Combat"]
  node_weapons["Weapon System<br/>[WeaponSystem.ts]"]
  node_weaponmodels["Weapon Variants<br/>[AK47.ts]"]
  node_logicpipe["Game Logic Events"]
end

subgraph group_rendering["Rendering"]
  node_layerpipe["Layer Events<br/>[LayerEventPipe.ts]"]
  node_viewport["Viewport Renderer<br/>[GLViewportLayer.ts]"]
  node_domlayer["DOM Layer<br/>[DomLayer.ts]"]
  node_shell["Shell Ejection"]
  node_smoke["Chamber Smoke"]
  node_muzzle["Muzzle Flash"]
  node_holes["Bullet Hole<br/>[BulletHoleLayer.ts]"]
  node_flash["Impact Flash"]
  node_ash["Impact Ash"]
  node_sky["Sky Layer<br/>[SkyLayer.ts]"]
  node_ui["Crosshair UI<br/>[CrosshairLayer.ts]"]
end

node_player(("Player"))

node_player -->|"provides controls"| node_input
node_input -->|"dispatches input"| node_inputpipe
node_player -->|"moves mouse"| node_dompipe
node_dompipe -->|"dispatches pointer events"| node_camera
node_inputpipe -->|"delivers key events"| node_movement
node_camera -->|"uses camera state"| node_context
node_movement -->|"reads camera and collision state"| node_context
node_movement -->|"updates movement"| node_playerstate
node_playerstate -->|"equips and uses weapons"| node_weapons
node_inputpipe -->|"delivers trigger input"| node_weapons
node_weapons -->|"selects weapon behavior"| node_weaponmodels
node_weapons -->|"dispatches fire events"| node_logicpipe
node_logicpipe -->|"delivers fire events"| node_weapons
node_weapons -->|"dispatches hit effects"| node_layerpipe
node_layerpipe -->|"delivers impact events"| node_holes
node_layerpipe -->|"delivers impact events"| node_flash
node_layerpipe -->|"delivers impact events"| node_ash
node_layerpipe -->|"delivers firing events"| node_shell
node_layerpipe -->|"delivers firing events"| node_smoke
node_layerpipe -->|"delivers firing events"| node_muzzle
node_main -->|"loads resources"| node_resources
node_main -->|"loads registered objects"| node_objects
node_main -->|"initializes and updates"| node_context
node_main -->|"runs frame updates"| node_viewport
node_main -->|"runs frame updates"| node_movement
node_main -->|"runs frame updates"| node_weapons
node_main -->|"runs frame updates"| node_shell
node_main -->|"runs frame updates"| node_smoke
node_main -->|"runs frame updates"| node_holes
node_main -->|"runs frame updates"| node_ash
node_main -->|"initializes level"| node_level
node_level -->|"sets scene and octree"| node_context
node_viewport -->|"renders configured scenes"| node_context
node_domlayer -->|"uses game view"| node_context
node_sky -->|"uses sky scene"| node_context
node_ui -->|"uses UI scene"| node_context
node_inventory -->|"manages player inventory"| node_playerstate

click node_main "https://github.com/lian1998/threejs-cube-gunman/blob/master/src/main.ts"
click node_context "https://github.com/lian1998/threejs-cube-gunman/blob/master/src/core/GameContext.ts"
click node_resources "https://github.com/lian1998/threejs-cube-gunman/blob/master/src/core/GameResources.ts"
click node_objects "https://github.com/lian1998/threejs-cube-gunman/blob/master/src/core/GameObjectMap.ts"
click node_input "https://github.com/lian1998/threejs-cube-gunman/blob/master/src/gameplay/input/UserInputSystem.ts"
click node_dompipe "https://github.com/lian1998/threejs-cube-gunman/blob/master/src/gameplay/pipes/DomEventPipe.ts"
click node_inputpipe "https://github.com/lian1998/threejs-cube-gunman/blob/master/src/gameplay/pipes/UserinputEventPipe.ts"
click node_camera "https://github.com/lian1998/threejs-cube-gunman/blob/master/src/gameplay/input/controllers/FPSCameraController.ts"
click node_movement "https://github.com/lian1998/threejs-cube-gunman/blob/master/src/gameplay/input/controllers/MovementController.ts"
click node_playerstate "https://github.com/lian1998/threejs-cube-gunman/blob/master/src/gameplay/player/LocalPlayer.ts"
click node_level "https://github.com/lian1998/threejs-cube-gunman/blob/master/src/gameplay/levels/LevelMirage.ts"
click node_inventory "https://github.com/lian1998/threejs-cube-gunman/blob/master/src/gameplay/Inventory/InventorySystem.ts"
click node_weapons "https://github.com/lian1998/threejs-cube-gunman/blob/master/src/gameplay/weapon/WeaponSystem.ts"
click node_weaponmodels "https://github.com/lian1998/threejs-cube-gunman/blob/master/src/gameplay/weapon/instances/AK47.ts"
click node_logicpipe "https://github.com/lian1998/threejs-cube-gunman/blob/master/src/gameplay/pipes/GameLogicEventPipe.ts"
click node_layerpipe "https://github.com/lian1998/threejs-cube-gunman/blob/master/src/gameplay/pipes/LayerEventPipe.ts"
click node_viewport "https://github.com/lian1998/threejs-cube-gunman/blob/master/src/viewlayers/GLViewportLayer.ts"
click node_domlayer "https://github.com/lian1998/threejs-cube-gunman/blob/master/src/viewlayers/DomLayer.ts"
click node_shell "https://github.com/lian1998/threejs-cube-gunman/blob/master/src/viewlayers/weapon/ChamberBulletShellLayer.ts"
click node_smoke "https://github.com/lian1998/threejs-cube-gunman/blob/master/src/viewlayers/weapon/ChamberSmokeLayer.ts"
click node_muzzle "https://github.com/lian1998/threejs-cube-gunman/blob/master/src/viewlayers/weapon/MuzzleFlashLayer.ts"
click node_holes "https://github.com/lian1998/threejs-cube-gunman/blob/master/src/viewlayers/scene/BulletHoleLayer.ts"
click node_flash "https://github.com/lian1998/threejs-cube-gunman/blob/master/src/viewlayers/scene/BulletHoleFlashLayer.ts"
click node_ash "https://github.com/lian1998/threejs-cube-gunman/blob/master/src/viewlayers/scene/BulletHoleAshLayer.ts"
click node_sky "https://github.com/lian1998/threejs-cube-gunman/blob/master/src/viewlayers/SkyLayer.ts"
click node_ui "https://github.com/lian1998/threejs-cube-gunman/blob/master/src/viewlayers/ui/CrosshairLayer.ts"

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_main,node_context,node_resources,node_objects toneBlue
class node_input,node_dompipe,node_inputpipe,node_camera,node_movement,node_playerstate,node_level,node_inventory toneAmber
class node_weapons,node_weaponmodels,node_logicpipe toneMint
class node_layerpipe,node_viewport,node_domlayer,node_shell,node_smoke,node_muzzle,node_holes,node_flash,node_ash,node_sky,node_ui toneRose
class node_player toneIndigo
```

## Components

### Runtime Core

- [Runtime Bootstrap](https://github.com/lian1998/threejs-cube-gunman/blob/master/src/main.ts): `src/main.ts`
- [Game Context](https://github.com/lian1998/threejs-cube-gunman/blob/master/src/core/GameContext.ts): `src/core/GameContext.ts`
- [Resource Loading](https://github.com/lian1998/threejs-cube-gunman/blob/master/src/core/GameResources.ts): `src/core/GameResources.ts`
- [Object Registry](https://github.com/lian1998/threejs-cube-gunman/blob/master/src/core/GameObjectMap.ts): `src/core/GameObjectMap.ts`

### Gameplay

- [Input System](https://github.com/lian1998/threejs-cube-gunman/blob/master/src/gameplay/input/UserInputSystem.ts): `src/gameplay/input/UserInputSystem.ts`
- [DOM Event Pipe](https://github.com/lian1998/threejs-cube-gunman/blob/master/src/gameplay/pipes/DomEventPipe.ts): `src/gameplay/pipes/DomEventPipe.ts`
- [Input Event Pipe](https://github.com/lian1998/threejs-cube-gunman/blob/master/src/gameplay/pipes/UserinputEventPipe.ts): `src/gameplay/pipes/UserinputEventPipe.ts`
- [FPS Camera](https://github.com/lian1998/threejs-cube-gunman/blob/master/src/gameplay/input/controllers/FPSCameraController.ts): `src/gameplay/input/controllers/FPSCameraController.ts`
- [Movement Controller](https://github.com/lian1998/threejs-cube-gunman/blob/master/src/gameplay/input/controllers/MovementController.ts): `src/gameplay/input/controllers/MovementController.ts`
- [Local Player](https://github.com/lian1998/threejs-cube-gunman/blob/master/src/gameplay/player/LocalPlayer.ts): `src/gameplay/player/LocalPlayer.ts`
- [Mirage Level](https://github.com/lian1998/threejs-cube-gunman/blob/master/src/gameplay/levels/LevelMirage.ts): `src/gameplay/levels/LevelMirage.ts`
- [Inventory System](https://github.com/lian1998/threejs-cube-gunman/blob/master/src/gameplay/Inventory/InventorySystem.ts): `src/gameplay/Inventory/InventorySystem.ts`

### Combat

- [Weapon System](https://github.com/lian1998/threejs-cube-gunman/blob/master/src/gameplay/weapon/WeaponSystem.ts): `src/gameplay/weapon/WeaponSystem.ts`
- [Weapon Variants](https://github.com/lian1998/threejs-cube-gunman/blob/master/src/gameplay/weapon/instances/AK47.ts): `src/gameplay/weapon/instances/AK47.ts`
- [Game Logic Events](https://github.com/lian1998/threejs-cube-gunman/blob/master/src/gameplay/pipes/GameLogicEventPipe.ts): `src/gameplay/pipes/GameLogicEventPipe.ts`

### Rendering

- [Layer Events](https://github.com/lian1998/threejs-cube-gunman/blob/master/src/gameplay/pipes/LayerEventPipe.ts): `src/gameplay/pipes/LayerEventPipe.ts`
- [Viewport Renderer](https://github.com/lian1998/threejs-cube-gunman/blob/master/src/viewlayers/GLViewportLayer.ts): `src/viewlayers/GLViewportLayer.ts`
- [DOM Layer](https://github.com/lian1998/threejs-cube-gunman/blob/master/src/viewlayers/DomLayer.ts): `src/viewlayers/DomLayer.ts`
- [Shell Ejection](https://github.com/lian1998/threejs-cube-gunman/blob/master/src/viewlayers/weapon/ChamberBulletShellLayer.ts): `src/viewlayers/weapon/ChamberBulletShellLayer.ts`
- [Chamber Smoke](https://github.com/lian1998/threejs-cube-gunman/blob/master/src/viewlayers/weapon/ChamberSmokeLayer.ts): `src/viewlayers/weapon/ChamberSmokeLayer.ts`
- [Muzzle Flash](https://github.com/lian1998/threejs-cube-gunman/blob/master/src/viewlayers/weapon/MuzzleFlashLayer.ts): `src/viewlayers/weapon/MuzzleFlashLayer.ts`
- [Bullet Hole](https://github.com/lian1998/threejs-cube-gunman/blob/master/src/viewlayers/scene/BulletHoleLayer.ts): `src/viewlayers/scene/BulletHoleLayer.ts`
- [Impact Flash](https://github.com/lian1998/threejs-cube-gunman/blob/master/src/viewlayers/scene/BulletHoleFlashLayer.ts): `src/viewlayers/scene/BulletHoleFlashLayer.ts`
- [Impact Ash](https://github.com/lian1998/threejs-cube-gunman/blob/master/src/viewlayers/scene/BulletHoleAshLayer.ts): `src/viewlayers/scene/BulletHoleAshLayer.ts`
- [Sky Layer](https://github.com/lian1998/threejs-cube-gunman/blob/master/src/viewlayers/SkyLayer.ts): `src/viewlayers/SkyLayer.ts`
- [Crosshair UI](https://github.com/lian1998/threejs-cube-gunman/blob/master/src/viewlayers/ui/CrosshairLayer.ts): `src/viewlayers/ui/CrosshairLayer.ts`

### Other components

- **Player**

## Connections

- Player → Input System: provides controls
- Input System → Input Event Pipe: dispatches input
- Player → DOM Event Pipe: moves mouse
- DOM Event Pipe → FPS Camera: dispatches pointer events
- Input Event Pipe → Movement Controller: delivers key events
- FPS Camera → Game Context: uses camera state
- Movement Controller → Game Context: reads camera and collision state
- Movement Controller → Local Player: updates movement
- Local Player → Weapon System: equips and uses weapons
- Input Event Pipe → Weapon System: delivers trigger input
- Weapon System → Weapon Variants: selects weapon behavior
- Weapon System → Game Logic Events: dispatches fire events
- Game Logic Events → Weapon System: delivers fire events
- Weapon System → Layer Events: dispatches hit effects
- Layer Events → Bullet Hole: delivers impact events
- Layer Events → Impact Flash: delivers impact events
- Layer Events → Impact Ash: delivers impact events
- Layer Events → Shell Ejection: delivers firing events
- Layer Events → Chamber Smoke: delivers firing events
- Layer Events → Muzzle Flash: delivers firing events
- Runtime Bootstrap → Resource Loading: loads resources
- Runtime Bootstrap → Object Registry: loads registered objects
- Runtime Bootstrap → Game Context: initializes and updates
- Runtime Bootstrap → Viewport Renderer: runs frame updates
- Runtime Bootstrap → Movement Controller: runs frame updates
- Runtime Bootstrap → Weapon System: runs frame updates
- Runtime Bootstrap → Shell Ejection: runs frame updates
- Runtime Bootstrap → Chamber Smoke: runs frame updates
- Runtime Bootstrap → Bullet Hole: runs frame updates
- Runtime Bootstrap → Impact Ash: runs frame updates
- Runtime Bootstrap → Mirage Level: initializes level
- Mirage Level → Game Context: sets scene and octree
- Viewport Renderer → Game Context: renders configured scenes
- DOM Layer → Game Context: uses game view
- Sky Layer → Game Context: uses sky scene
- Crosshair UI → Game Context: uses UI scene
- Inventory System → Local Player: manages player inventory