# leo4bits/whiteboard architecture

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

- Interactive diagram: https://gitdiagram.com/leo4bits/whiteboard
- Repository: https://github.com/leo4bits/whiteboard

## Overview

This is a Tkinter whiteboard for drawing and editing canvas objects, with undo/redo history persisted in JSON. The main workflow is to choose a drawing or editing tool, interact with the canvas, and record changes for later undo or redo. The excerpts show the UI wiring and portions of the interaction and persistence logic; omitted source may contain additional details, and no README was provided.

Main entry points: [`main.py`](https://github.com/leo4bits/whiteboard/blob/master/main.py) (Tkinter UI), [`FuncDataProcessing.py`](https://github.com/leo4bits/whiteboard/blob/master/FuncDataProcessing.py) (JSON Operations), [`function.py`](https://github.com/leo4bits/whiteboard/blob/master/function.py) (Drawing Tools), [`picture_button`](https://github.com/leo4bits/whiteboard/tree/master/picture_button) (UI Images)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_ui["Whiteboard UI"]
  node_app["Tkinter UI<br/>[main.py]"]
  node_assets["UI Images"]
  node_branding["Branding Images"]
end

subgraph group_canvas["Canvas Tools"]
  node_tools["Drawing Tools<br/>[function.py]"]
  node_editing["Erase and Move<br/>[function.py]"]
  node_history_ops["Undo and Redo<br/>[function.py]"]
end

subgraph group_history["History Storage"]
  node_data_helpers["JSON Operations"]
  node_history_file[("History Data<br/>[data_id.json]")]
end

node_user(("User"))

node_user -->|"uses controls"| node_app
node_app -->|"loads icons"| node_assets
node_app -->|"loads branding"| node_branding
node_app -->|"dispatches draw"| node_tools
node_app -->|"dispatches edit"| node_editing
node_app -->|"dispatches history"| node_history_ops
node_app -->|"resets data"| node_data_helpers
node_tools -->|"records objects"| node_data_helpers
node_editing -->|"updates erased items"| node_data_helpers
node_history_ops -->|"reads and rewrites"| node_data_helpers
node_data_helpers -->|"reads and writes"| node_history_file

click node_app "https://github.com/leo4bits/whiteboard/blob/master/main.py"
click node_assets "https://github.com/leo4bits/whiteboard/tree/master/picture_button"
click node_branding "https://github.com/leo4bits/whiteboard/tree/master/Picture"
click node_tools "https://github.com/leo4bits/whiteboard/blob/master/function.py"
click node_editing "https://github.com/leo4bits/whiteboard/blob/master/function.py"
click node_history_ops "https://github.com/leo4bits/whiteboard/blob/master/function.py"
click node_data_helpers "https://github.com/leo4bits/whiteboard/blob/master/FuncDataProcessing.py"
click node_history_file "https://github.com/leo4bits/whiteboard/blob/master/data_id.json"

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_app,node_assets,node_branding,node_user toneBlue
class node_tools,node_editing,node_history_ops toneAmber
class node_data_helpers,node_history_file toneMint
```

## Components

### Whiteboard UI

- [Tkinter UI](https://github.com/leo4bits/whiteboard/blob/master/main.py): `main.py`
- [UI Images](https://github.com/leo4bits/whiteboard/tree/master/picture_button): `picture_button`
- [Branding Images](https://github.com/leo4bits/whiteboard/tree/master/Picture): `Picture`

### Canvas Tools

- [Drawing Tools](https://github.com/leo4bits/whiteboard/blob/master/function.py): `function.py`
- [Erase and Move](https://github.com/leo4bits/whiteboard/blob/master/function.py): `function.py`
- [Undo and Redo](https://github.com/leo4bits/whiteboard/blob/master/function.py): `function.py`

### History Storage

- [JSON Operations](https://github.com/leo4bits/whiteboard/blob/master/FuncDataProcessing.py): `FuncDataProcessing.py`
- [History Data](https://github.com/leo4bits/whiteboard/blob/master/data_id.json): `data_id.json`

### Other components

- **User**

## Connections

- User → Tkinter UI: uses controls
- Tkinter UI → UI Images: loads icons
- Tkinter UI → Branding Images: loads branding
- Tkinter UI → Drawing Tools: dispatches draw
- Tkinter UI → Erase and Move: dispatches edit
- Tkinter UI → Undo and Redo: dispatches history
- Tkinter UI → JSON Operations: resets data
- Drawing Tools → JSON Operations: records objects
- Erase and Move → JSON Operations: updates erased items
- Undo and Redo → JSON Operations: reads and rewrites
- JSON Operations → History Data: reads and writes