# gustavosoriano/game-canvas architecture

> Architecture diagram of the GitHub repository gustavosoriano/game-canvas, 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/gustavosoriano/game-canvas
- Repository: https://github.com/gustavosoriano/game-canvas

## Overview

Game-canvas is a small native JavaScript canvas game. The player jumps over moving obstacles; collisions trigger a loss and restart delay, while passed obstacles increase the score and the score can affect game speed. The sampled code shows gameplay, drawing, and sprite responsibilities, but not the main loop or input-handler implementation, so those connections are omitted.

Main entry points: [`pedras.js`](https://github.com/gustavosoriano/game-canvas/blob/master/pedras.js) (Obstacles), [`samurai.js`](https://github.com/gustavosoriano/game-canvas/blob/master/samurai.js) (Samurai), [`chao.js`](https://github.com/gustavosoriano/game-canvas/blob/master/chao.js) (Ground), [`sprite.js`](https://github.com/gustavosoriano/game-canvas/blob/master/sprite.js) (Sprite assets)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_gameplay["Gameplay"]
  node_player["Samurai<br/>[samurai.js]"]
  node_obstacles["Obstacles<br/>[pedras.js]"]
  node_ground["Ground<br/>[chao.js]"]
end

subgraph group_rendering["Rendering"]
  node_sprites["Sprite assets<br/>[sprite.js]"]
end

subgraph group_state["Game state"]
  node_score["Score and speed<br/>[score.js]"]
end

node_canvas["Canvas context"]
node_browser["Browser timer and events"]

node_player -->|"checks landing"| node_ground
node_player -->|"draws frame"| node_sprites
node_player -->|"draws via"| node_canvas
node_obstacles -->|"checks collision"| node_player
node_obstacles -->|"positions on"| node_ground
node_obstacles -->|"increments"| node_score
node_obstacles -->|"draws obstacles"| node_sprites
node_obstacles -->|"schedules restart"| node_browser
node_score -->|"draws via"| node_canvas
node_sprites -->|"draws via"| node_canvas
node_ground -->|"draws via"| node_canvas

click node_player "https://github.com/gustavosoriano/game-canvas/blob/master/samurai.js"
click node_obstacles "https://github.com/gustavosoriano/game-canvas/blob/master/pedras.js"
click node_ground "https://github.com/gustavosoriano/game-canvas/blob/master/chao.js"
click node_sprites "https://github.com/gustavosoriano/game-canvas/blob/master/sprite.js"
click node_score "https://github.com/gustavosoriano/game-canvas/blob/master/score.js"

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_player,node_obstacles,node_ground,node_browser toneBlue
class node_sprites toneAmber
class node_score toneMint
class node_canvas toneIndigo
```

## Components

### Gameplay

- [Samurai](https://github.com/gustavosoriano/game-canvas/blob/master/samurai.js): `samurai.js`
- [Obstacles](https://github.com/gustavosoriano/game-canvas/blob/master/pedras.js): `pedras.js`
- [Ground](https://github.com/gustavosoriano/game-canvas/blob/master/chao.js): `chao.js`

### Rendering

- [Sprite assets](https://github.com/gustavosoriano/game-canvas/blob/master/sprite.js): `sprite.js`

### Game state

- [Score and speed](https://github.com/gustavosoriano/game-canvas/blob/master/score.js): `score.js`

### Other components

- **Canvas context**
- **Browser timer and events**

## Connections

- Samurai → Ground: checks landing
- Samurai → Sprite assets: draws frame
- Samurai → Canvas context: draws via
- Obstacles → Samurai: checks collision
- Obstacles → Ground: positions on
- Obstacles → Score and speed: increments
- Obstacles → Sprite assets: draws obstacles
- Obstacles → Browser timer and events: schedules restart
- Score and speed → Canvas context: draws via
- Sprite assets → Canvas context: draws via
- Ground → Canvas context: draws via
