From 8958e09624bee1b43029a2dd8f3c3b5461daf7c5 Mon Sep 17 00:00:00 2001
From: Mikhail Artamonov <mailtoartamonov@gmail.com>
Date: Mon, 4 May 2026 04:13:48 +0700
Subject: [PATCH] docs: add Mermaid architecture diagram to README
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Renders inline on GitHub. Visual summary of how the project's pieces
fit together — was missing from this repo.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
---
 README.md | 20 ++++++++++++++++++++
 1 file changed, 20 insertions(+)

diff --git a/README.md b/README.md
index d5a9b3b..c5a3ac3 100644
--- a/README.md
+++ b/README.md
@@ -2,6 +2,26 @@
 
 Cross-platform voice and video messaging plugin for Mattermost with full support for web, desktop, iOS and Android.
 
+## Recording → playback flow
+
+```mermaid
+flowchart LR
+    A[User taps mic / cam<br/>or types /voice or /video] --> B[Permission prompt<br/>navigator.mediaDevices]
+    B -->|granted| C[MediaRecorder<br/>WebM Opus / VP9]
+    C --> D{Pause / resume<br/>during recording}
+    D --> E[Encode to Blob<br/>≤ 50 MB audio<br/>≤ 100 MB video]
+    E --> F[POST /api/v4/files<br/>multipart upload]
+    F --> G[Mattermost file store]
+    G --> H[Post message<br/>with file_ids]
+    H --> I[Recipient renders<br/>waveform / circle preview<br/>+ 1× / 1.25× / 1.5× / 2× speed]
+```
+
+Recording happens entirely in the browser — the plugin never proxies
+the audio. Only the final encoded Blob crosses the wire, via the
+standard Mattermost file-upload API. iOS Safari 14.3+ and Android
+Chrome both expose `MediaRecorder`, so the same code path works on
+mobile, desktop and web.
+
 ## Features
 
 ### Voice Messages