# flowhartigan/brigada-game architecture

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

- Interactive diagram: https://gitdiagram.com/flowhartigan/brigada-game
- Repository: https://github.com/flowhartigan/brigada-game

## Overview

BRIGADA FIGHT is a mobile-first browser fighting game. The main flow is fighter selection, a versus matchup, then a real-time fight with touch-friendly actions, opponent AI, and a result. The React prototype coordinates game state and presentation; a deterministic combat engine handles rules separately from Phaser rendering. Fighter definitions and visual assets support both gameplay and character display. The graph reflects the sampled source and README; some matchup and result details are only visible as responsibilities within the prototype, so uncertain internal wiring is omitted.

Main entry points: [`src/components/game/GamePrototype.tsx`](https://github.com/flowhartigan/brigada-game/blob/main/src/components/game/GamePrototype.tsx) (Game prototype), [`src/game/engine/combat.ts`](https://github.com/flowhartigan/brigada-game/blob/main/src/game/engine/combat.ts) (Combat engine), [`src/components/game/PhaserCombatStage.tsx`](https://github.com/flowhartigan/brigada-game/blob/main/src/components/game/PhaserCombatStage.tsx) (Phaser combat stage), [`src/components/game/fighterPresentation.ts`](https://github.com/flowhartigan/brigada-game/blob/main/src/components/game/fighterPresentation.ts) (Presentation tuning)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_experience["Game experience"]
  node_prototype["Game prototype<br/>[GamePrototype.tsx]"]
end

subgraph group_rules["Combat rules"]
  node_combat["Combat engine<br/>[combat.ts]"]
  node_ai["Opponent AI<br/>[opponent-ai.ts]"]
  node_formulas["Combat formulas<br/>[formulas.ts]"]
  node_spatial["Movement and range<br/>[spatial.ts]"]
  node_rng["Combat randomness<br/>[runtimeRng.ts]"]
end

subgraph group_presentation["Visual presentation"]
  node_phaser["Phaser combat stage"]
  node_sprite["Fighter sprite<br/>[FighterSprite.tsx]"]
  node_fighterart["Fighter artwork<br/>[FighterArt.tsx]"]
  node_sprite_state["Sprite state mapping"]
  node_presentation_tuning["Presentation tuning"]
  node_animation_assets["Animation assets"]
  node_animation_frames["Action frame maps"]
  node_timing["Impact timing"]
  node_fighter_images["Fighter image lookup<br/>[fighterImages.ts]"]
end

subgraph group_content["Fighter content"]
  node_fighterdata["Fighter definitions<br/>[fighters.ts]"]
  node_fighter_files["Fighter image files"]
end

node_player(("Player"))

node_player -->|"chooses and acts"| node_prototype
node_prototype -->|"reads roster"| node_fighterdata
node_prototype -->|"updates match"| node_combat
node_prototype -->|"requests opponent action"| node_ai
node_prototype -->|"passes fight state"| node_phaser
node_prototype -->|"resolves visuals"| node_sprite_state
node_prototype -->|"renders fighters"| node_sprite
node_prototype -->|"renders portraits"| node_fighterart
node_prototype -->|"styles matchup"| node_presentation_tuning
node_combat -->|"reads fighter stats"| node_fighterdata
node_combat -->|"calculates combat values"| node_formulas
node_combat -->|"checks movement and range"| node_spatial
node_phaser -->|"loads animation images"| node_animation_assets
node_phaser -->|"loads idle images"| node_fighter_images
node_phaser -->|"gets impact duration"| node_timing
node_animation_assets -->|"uses frame maps"| node_animation_frames
node_fighter_images -->|"selects image files"| node_fighter_files
node_sprite -->|"uses presentation styles"| node_presentation_tuning
node_fighterart -->|"uses presentation styles"| node_presentation_tuning

click node_prototype "https://github.com/flowhartigan/brigada-game/blob/main/src/components/game/GamePrototype.tsx"
click node_combat "https://github.com/flowhartigan/brigada-game/blob/main/src/game/engine/combat.ts"
click node_ai "https://github.com/flowhartigan/brigada-game/blob/main/src/game/engine/opponent-ai.ts"
click node_formulas "https://github.com/flowhartigan/brigada-game/blob/main/src/game/engine/formulas.ts"
click node_spatial "https://github.com/flowhartigan/brigada-game/blob/main/src/game/engine/spatial.ts"
click node_fighterdata "https://github.com/flowhartigan/brigada-game/blob/main/src/game/data/fighters.ts"
click node_rng "https://github.com/flowhartigan/brigada-game/blob/main/src/game/runtimeRng.ts"
click node_phaser "https://github.com/flowhartigan/brigada-game/blob/main/src/components/game/PhaserCombatStage.tsx"
click node_sprite "https://github.com/flowhartigan/brigada-game/blob/main/src/components/game/FighterSprite.tsx"
click node_fighterart "https://github.com/flowhartigan/brigada-game/blob/main/src/components/game/FighterArt.tsx"
click node_sprite_state "https://github.com/flowhartigan/brigada-game/blob/main/src/components/game/fighterSpriteState.ts"
click node_presentation_tuning "https://github.com/flowhartigan/brigada-game/blob/main/src/components/game/fighterPresentation.ts"
click node_animation_assets "https://github.com/flowhartigan/brigada-game/blob/main/src/components/game/fighterAnimationAssets.ts"
click node_animation_frames "https://github.com/flowhartigan/brigada-game/tree/main/src/components/game/animationFrames"
click node_timing "https://github.com/flowhartigan/brigada-game/blob/main/src/components/game/combatPresentationTiming.ts"
click node_fighter_images "https://github.com/flowhartigan/brigada-game/blob/main/src/components/game/fighterImages.ts"
click node_fighter_files "https://github.com/flowhartigan/brigada-game/tree/main/public/fighters"

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_prototype toneBlue
class node_combat,node_ai,node_formulas,node_spatial,node_rng toneAmber
class node_phaser,node_sprite,node_fighterart,node_sprite_state,node_presentation_tuning,node_animation_assets,node_animation_frames,node_timing,node_fighter_images toneMint
class node_fighterdata,node_fighter_files toneRose
class node_player toneIndigo
```

## Components

### Game experience

- [Game prototype](https://github.com/flowhartigan/brigada-game/blob/main/src/components/game/GamePrototype.tsx): `src/components/game/GamePrototype.tsx`

### Combat rules

- [Combat engine](https://github.com/flowhartigan/brigada-game/blob/main/src/game/engine/combat.ts): `src/game/engine/combat.ts`
- [Opponent AI](https://github.com/flowhartigan/brigada-game/blob/main/src/game/engine/opponent-ai.ts): `src/game/engine/opponent-ai.ts`
- [Combat formulas](https://github.com/flowhartigan/brigada-game/blob/main/src/game/engine/formulas.ts): `src/game/engine/formulas.ts`
- [Movement and range](https://github.com/flowhartigan/brigada-game/blob/main/src/game/engine/spatial.ts): `src/game/engine/spatial.ts`
- [Combat randomness](https://github.com/flowhartigan/brigada-game/blob/main/src/game/runtimeRng.ts): `src/game/runtimeRng.ts`

### Visual presentation

- [Phaser combat stage](https://github.com/flowhartigan/brigada-game/blob/main/src/components/game/PhaserCombatStage.tsx): `src/components/game/PhaserCombatStage.tsx`
- [Fighter sprite](https://github.com/flowhartigan/brigada-game/blob/main/src/components/game/FighterSprite.tsx): `src/components/game/FighterSprite.tsx`
- [Fighter artwork](https://github.com/flowhartigan/brigada-game/blob/main/src/components/game/FighterArt.tsx): `src/components/game/FighterArt.tsx`
- [Sprite state mapping](https://github.com/flowhartigan/brigada-game/blob/main/src/components/game/fighterSpriteState.ts): `src/components/game/fighterSpriteState.ts`
- [Presentation tuning](https://github.com/flowhartigan/brigada-game/blob/main/src/components/game/fighterPresentation.ts): `src/components/game/fighterPresentation.ts`
- [Animation assets](https://github.com/flowhartigan/brigada-game/blob/main/src/components/game/fighterAnimationAssets.ts): `src/components/game/fighterAnimationAssets.ts`
- [Action frame maps](https://github.com/flowhartigan/brigada-game/tree/main/src/components/game/animationFrames): `src/components/game/animationFrames`
- [Impact timing](https://github.com/flowhartigan/brigada-game/blob/main/src/components/game/combatPresentationTiming.ts): `src/components/game/combatPresentationTiming.ts`
- [Fighter image lookup](https://github.com/flowhartigan/brigada-game/blob/main/src/components/game/fighterImages.ts): `src/components/game/fighterImages.ts`

### Fighter content

- [Fighter definitions](https://github.com/flowhartigan/brigada-game/blob/main/src/game/data/fighters.ts): `src/game/data/fighters.ts`
- [Fighter image files](https://github.com/flowhartigan/brigada-game/tree/main/public/fighters): `public/fighters`

### Other components

- **Player**

## Connections

- Player → Game prototype: chooses and acts
- Game prototype → Fighter definitions: reads roster
- Game prototype → Combat engine: updates match
- Game prototype → Opponent AI: requests opponent action
- Game prototype → Phaser combat stage: passes fight state
- Game prototype → Sprite state mapping: resolves visuals
- Game prototype → Fighter sprite: renders fighters
- Game prototype → Fighter artwork: renders portraits
- Game prototype → Presentation tuning: styles matchup
- Combat engine → Fighter definitions: reads fighter stats
- Combat engine → Combat formulas: calculates combat values
- Combat engine → Movement and range: checks movement and range
- Phaser combat stage → Animation assets: loads animation images
- Phaser combat stage → Fighter image lookup: loads idle images
- Phaser combat stage → Impact timing: gets impact duration
- Animation assets → Action frame maps: uses frame maps
- Fighter image lookup → Fighter image files: selects image files
- Fighter sprite → Presentation tuning: uses presentation styles
- Fighter artwork → Presentation tuning: uses presentation styles