Docs refresh: add user manual & architecture review; update README with accurate details
This commit is contained in:
Win Dictation Dev
@@ -1,411 +0,0 @@
|
||||
# Win Dictation — Architecture Analysis & Dev Guide (Build 4)
|
||||
|
||||
Two parts:
|
||||
|
||||
- **Part A — Architecture analysis & recommendations.** Where the app stands now (post-fixes) and what's worth hardening.
|
||||
- **Part B — Dev guide** for the two things you asked for: (1) removing the leftover Windows chrome (combo dropdown buttons, button hairlines, the line around *Pinned*), and (2) showing real transcription progress + a time estimate instead of a static "Transcribing…".
|
||||
|
||||
Context: native C++ / Win32 + SDL2 + whisper.cpp, CPU-only (i5-7th-gen, 2c/4t). Companion docs: `MODERN-UI-AND-FIXES.md`, `FINDINGS-FIXES-TESTS.md`.
|
||||
|
||||
---
|
||||
|
||||
# Part A — Architecture Analysis & Recommendations
|
||||
|
||||
## A1. Current architecture (it's in good shape)
|
||||
|
||||
```
|
||||
┌── UI thread (message loop) ───────────────┐ ┌── Audio thread (SDL callback) ──┐
|
||||
│ • window, hotkeys, tray, GDI+ paint │ │ • append f32 samples to │
|
||||
│ • owns Transcriber │◀────│ m_capture (mutex) │
|
||||
│ • marshals worker results via PostMessage│ │ • update VU energy (atomic) │
|
||||
└──────────────┬────────────────────────────┘ └─────────────────────────────────┘
|
||||
│ stop_and_transcribe()
|
||||
▼
|
||||
┌── Worker thread (one per utterance) ──────┐
|
||||
│ • run_inference(): whisper_full() ONCE │
|
||||
│ • PostMessage(WM_APP_RESULT, text) │
|
||||
└────────────────────────────────────────────┘
|
||||
```
|
||||
|
||||
State machine: **Idle → Recording → Transcribing → Idle**, with the model preloaded on a detached thread at startup.
|
||||
|
||||
**What's genuinely good now:**
|
||||
- **Clean thread boundaries.** Audio capture, inference, and UI never block each other; all cross-thread hand-offs are atomics or `PostMessage`. This is the right shape.
|
||||
- **Batch (record-then-transcribe).** The correct model for dictation on a slow CPU — no real-time deadline, latency independent of clip length.
|
||||
- **Core is decoupled and unit-testable** (`Transcriber` + `run_inference`/`transcribe_sync`, `text_util.h`). The UI is a thin shell over it.
|
||||
- **Robust startup** (single-instance, honest `g_modelOk`, `g_initializing` guard, `m_cfg_mtx`) — the earlier crashes are designed out, not patched over.
|
||||
|
||||
The remaining issues are **polish and hardening**, not structural. No rewrite needed.
|
||||
|
||||
## A2. Recommendations (ranked by impact ÷ effort)
|
||||
|
||||
| # | Recommendation | Why | Effort |
|
||||
|---|---|---|---|
|
||||
| 1 | **Transcription progress + ETA** (Part B2) | The #1 UX gap: a 1:40 clip shows a static "Transcribing…" with no sign of life. whisper.cpp already exposes a progress callback — wire it up. | S |
|
||||
| 2 | **De-theme the stock controls** (Part B1.1) | The hairlines around the buttons / *Pinned* are themed-edge leftovers. `SetWindowTheme(h, L"", L"")` + `WS_CLIPCHILDREN` + hide-focus removes them. | S |
|
||||
| 3 | **Replace the comboboxes with custom dropdowns** (Part B1.2) | A `CBS_OWNERDRAWFIXED` combo *cannot* hide its native dropdown button — that's the "second arrow" you see. The only clean fix is to not use a combobox. | M |
|
||||
| 4 | **Persist settings** | Mic, model, pin, auto-paste, window position all reset every launch. A tiny INI (`WritePrivateProfileStringW`) or registry blob fixes it. | S |
|
||||
| 5 | **Cancel/abort during transcription** | Pairs with #1 — if a long clip is wrong, let the user abort via `whisper_full_params.abort_callback`. | S |
|
||||
| 6 | **Delete the stale `src/CMakeLists.txt`** | It references removed APIs (`init`, `is_using_gpu`) and a `test-audio` target the root build ignores. It's a trap for the next contributor. | XS |
|
||||
| 7 | **Bound the capture buffer** | `m_capture` grows ~1.9 MB/30 s with no cap. Add a soft limit (e.g. auto-stop at 10 min) so a forgotten recording can't grow unbounded. | XS |
|
||||
| 8 | **Configurable hotkeys + conflict check** | `Ctrl+Shift+Space`/`H` are hard-coded; `RegisterHotKey` failures are silently ignored. Surface a warning and allow remap. | M |
|
||||
| 9 | **Lightweight logging** | A single rotating log line per session (model, threads, last error) makes field issues diagnosable without a debugger. | S |
|
||||
|
||||
**Architectural note for the future:** the app leans on owner-drawing *stock* controls (buttons, combos). That's fine at this size, but every stock control fights you on chrome (edges, focus cues, dropdown buttons). If the UI grows, the higher-leverage move is a small set of **fully custom controls** (a `Button`, a `Select`, a `ProgressBar` you paint entirely in `WM_PAINT` and hit-test yourself) rather than more owner-draw patches. Part B1.2's custom dropdown is the first step down that path.
|
||||
|
||||
---
|
||||
|
||||
# Part B — Dev Guide
|
||||
|
||||
## B1. Remove the leftover Windows chrome
|
||||
|
||||
There are **three** separate sources of "Windows-y" pixels, each with a different cause:
|
||||
|
||||
| What you see | Cause |
|
||||
|---|---|
|
||||
| Thin light line around *Pinned*; vertical line left + horizontal line top of Copy/Paste/Clear | The visual-style **themed edge** drawn behind owner-draw buttons, plus **focus rectangles** |
|
||||
| Two arrows / a boxy button on the mic + model selectors | A `CBS_OWNERDRAWFIXED` combo still lets the **system draw the dropdown button** and field border — owner-draw only covers the text/items |
|
||||
|
||||
### B1.1 Kill the button hairlines + focus rectangles (quick, high-impact)
|
||||
|
||||
Three changes, all small:
|
||||
|
||||
**(a) De-theme the owner-draw controls.** `SetWindowTheme(h, L"", L"")` strips the UxTheme styling from a control so Windows stops painting its themed border/edge behind your `WM_DRAWITEM`. Add the header/lib and call it on every owner-draw control right after you create it:
|
||||
|
||||
```cpp
|
||||
#include <uxtheme.h>
|
||||
#pragma comment(lib, "uxtheme.lib")
|
||||
|
||||
// after creating each owner-draw button (Record, Pin, Copy, Paste, Clear):
|
||||
SetWindowTheme(hBtn, L"", L""); // remove themed edges
|
||||
SetWindowSubclass(hBtn, BtnProc, 1, 0);
|
||||
```
|
||||
|
||||
**(b) Stop the parent painting under the children.** Add `WS_CLIPCHILDREN` to the main window so its double-buffered `WM_PAINT` never bleeds a pixel into a child's rectangle:
|
||||
|
||||
```cpp
|
||||
hMainWnd = CreateWindowExW(
|
||||
WS_EX_TOPMOST,
|
||||
L"WhisperDictationClass", L"Dictation",
|
||||
WS_OVERLAPPEDWINDOW | WS_CLIPCHILDREN, // <- add WS_CLIPCHILDREN
|
||||
CW_USEDEFAULT, CW_USEDEFAULT, 400, 340,
|
||||
nullptr, nullptr, hInstance, nullptr);
|
||||
```
|
||||
|
||||
**(c) Hide focus rectangles app-wide.** The dotted/thin rect that appears on whichever control has keyboard focus (often *Pinned* after you click it). Tell the UI-state machine to keep focus cues hidden — once, after the controls exist:
|
||||
|
||||
```cpp
|
||||
SendMessageW(hMainWnd, WM_CHANGEUISTATE, MAKEWPARAM(UIS_SET, UISF_HIDEFOCUS), 0);
|
||||
```
|
||||
|
||||
After (a)+(b)+(c), the only remaining stock chrome is the combo dropdown button, handled next.
|
||||
|
||||
### B1.2 Replace the comboboxes with a custom dropdown (removes the native button)
|
||||
|
||||
A combobox always owns its dropdown button — you can't draw it away. Replace each combo with a **flat owner-draw "select" button** (you already draw exactly this look in `DrawCombo`) that opens a **custom dark popup window**. No native button, no field edge, fully on-theme.
|
||||
|
||||
**Data model** (replace `g_modelComboPaths` usage as needed; keep a label list + selection per selector):
|
||||
|
||||
```cpp
|
||||
std::vector<std::wstring> g_audioItems; int g_audioSel = 0;
|
||||
std::vector<std::wstring> g_modelItems; int g_modelSel = 0; // parallel to g_modelComboPaths
|
||||
```
|
||||
Populate these in `RefreshAudioDevices` / `RefreshModelList` instead of `CB_ADDSTRING`. Create `ID_SEL_AUDIO` / `ID_SEL_MODEL` as `BS_OWNERDRAW` buttons (not comboboxes) and draw them with a field renderer:
|
||||
|
||||
```cpp
|
||||
void DrawSelect(LPDRAWITEMSTRUCT d, const std::wstring& text) {
|
||||
Graphics g(d->hDC); g.SetSmoothingMode(SmoothingModeAntiAlias);
|
||||
Rect rc(d->rcItem.left, d->rcItem.top, d->rcItem.right-d->rcItem.left, d->rcItem.bottom-d->rcItem.top);
|
||||
SolidBrush bg(C_BG); g.FillRectangle(&bg, rc);
|
||||
Rect field = rc; field.Inflate(-1,-1);
|
||||
bool hover = GetWindowLongPtr(d->hwndItem, GWLP_USERDATA) != 0;
|
||||
FillRound(g, hover ? C_SURFACEHI : C_SURFACE, field, 9);
|
||||
StrokeRound(g, C_BORDER, field, 9, 1.0f);
|
||||
Font f(d->hDC, g_fUI);
|
||||
RectF tb((REAL)field.X+10, (REAL)field.Y, (REAL)(field.Width-28), (REAL)field.Height);
|
||||
DrawTextC(g, text.c_str(), f, C_TEXT, tb, StringAlignmentNear, StringAlignmentCenter);
|
||||
int cx = field.GetRight()-16, cy = field.Y + field.Height/2; // our chevron, the only one now
|
||||
Pen pen(C_TEXTDIM, 1.6f);
|
||||
g.DrawLine(&pen, cx-4, cy-2, cx, cy+2); g.DrawLine(&pen, cx, cy+2, cx+4, cy-2);
|
||||
}
|
||||
// in WM_DRAWITEM:
|
||||
// case ID_SEL_AUDIO: DrawSelect(d, g_audioItems.empty()?L"No devices":g_audioItems[g_audioSel]); return TRUE;
|
||||
// case ID_SEL_MODEL: DrawSelect(d, g_modelItems.empty()?L"—":g_modelItems[g_modelSel]); return TRUE;
|
||||
```
|
||||
|
||||
**The popup window** — a small borderless top-level you paint yourself; closes on pick or focus loss:
|
||||
|
||||
```cpp
|
||||
struct PopupState { std::vector<std::wstring> items; int sel; int hot; HWND owner; int ctrlId; };
|
||||
static PopupState g_pop;
|
||||
|
||||
LRESULT CALLBACK PopupProc(HWND h, UINT m, WPARAM w, LPARAM l) {
|
||||
switch (m) {
|
||||
case WM_MOUSEMOVE: {
|
||||
int row = GET_Y_LPARAM(l) / 30;
|
||||
if (row != g_pop.hot) { g_pop.hot = row; InvalidateRect(h, nullptr, FALSE); }
|
||||
TRACKMOUSEEVENT t{ sizeof(t), TME_LEAVE, h, 0 }; TrackMouseEvent(&t);
|
||||
return 0;
|
||||
}
|
||||
case WM_MOUSELEAVE: g_pop.hot = -1; InvalidateRect(h, nullptr, FALSE); return 0;
|
||||
case WM_LBUTTONUP: {
|
||||
int row = GET_Y_LPARAM(l) / 30;
|
||||
if (row >= 0 && row < (int)g_pop.items.size())
|
||||
PostMessageW(g_pop.owner, WM_APP_SELECT, (WPARAM)g_pop.ctrlId, (LPARAM)row);
|
||||
DestroyWindow(h); return 0;
|
||||
}
|
||||
case WM_KILLFOCUS: DestroyWindow(h); return 0;
|
||||
case WM_ERASEBKGND: return 1;
|
||||
case WM_PAINT: {
|
||||
PAINTSTRUCT ps; HDC hdc = BeginPaint(h, &ps);
|
||||
RECT rc; GetClientRect(h, &rc);
|
||||
HDC mem = CreateCompatibleDC(hdc);
|
||||
HBITMAP bmp = CreateCompatibleBitmap(hdc, rc.right, rc.bottom);
|
||||
HBITMAP old = (HBITMAP)SelectObject(mem, bmp);
|
||||
{
|
||||
Graphics g(mem); g.SetSmoothingMode(SmoothingModeAntiAlias);
|
||||
Rect all(0,0,rc.right,rc.bottom);
|
||||
FillRound(g, C_SURFACE, all, 10); StrokeRound(g, C_BORDER, all, 10, 1.0f);
|
||||
Font f(mem, g_fUI);
|
||||
for (int i = 0; i < (int)g_pop.items.size(); ++i) {
|
||||
Rect row(3, i*30+3, rc.right-6, 28);
|
||||
if (i == g_pop.hot) FillRound(g, C_SURFACEHI, row, 7);
|
||||
RectF tb((REAL)row.X+9,(REAL)row.Y,(REAL)row.Width-12,(REAL)row.Height);
|
||||
DrawTextC(g, g_pop.items[i].c_str(), f, (i==g_pop.sel)?C_ACCENT:C_TEXT,
|
||||
tb, StringAlignmentNear, StringAlignmentCenter);
|
||||
}
|
||||
}
|
||||
BitBlt(hdc,0,0,rc.right,rc.bottom,mem,0,0,SRCCOPY);
|
||||
SelectObject(mem, old); DeleteObject(bmp); DeleteDC(mem);
|
||||
EndPaint(h, &ps); return 0;
|
||||
}
|
||||
}
|
||||
return DefWindowProc(h, m, w, l);
|
||||
}
|
||||
|
||||
void ShowSelectPopup(HWND owner, int ctrlId, const std::vector<std::wstring>& items, int sel) {
|
||||
static bool reg = false;
|
||||
if (!reg) { WNDCLASSEXW wc{ sizeof(wc) }; wc.lpfnWndProc = PopupProc; wc.hInstance = hInst;
|
||||
wc.hCursor = LoadCursor(nullptr, IDC_ARROW); wc.lpszClassName = L"DictPopup";
|
||||
RegisterClassExW(&wc); reg = true; }
|
||||
g_pop = { items, sel, -1, owner, ctrlId };
|
||||
RECT rc; GetWindowRect(GetDlgItem(owner, ctrlId), &rc);
|
||||
int h = (int)items.size()*30 + 6, wdt = rc.right - rc.left;
|
||||
HWND p = CreateWindowExW(WS_EX_TOOLWINDOW | WS_EX_TOPMOST, L"DictPopup", L"",
|
||||
WS_POPUP, rc.left, rc.bottom+2, wdt, h, owner, nullptr, hInst, nullptr);
|
||||
int corner = DWMWCP_ROUND; DwmSetWindowAttribute(p, DWMWA_WINDOW_CORNER_PREFERENCE, &corner, sizeof(corner));
|
||||
ShowWindow(p, SW_SHOWNA); SetForegroundWindow(p); SetFocus(p);
|
||||
}
|
||||
```
|
||||
|
||||
Wire it up: clicking a selector opens the popup; the popup posts the chosen row back:
|
||||
|
||||
```cpp
|
||||
// WM_COMMAND:
|
||||
case ID_SEL_AUDIO: ShowSelectPopup(hWnd, ID_SEL_AUDIO, g_audioItems, g_audioSel); break;
|
||||
case ID_SEL_MODEL: ShowSelectPopup(hWnd, ID_SEL_MODEL, g_modelItems, g_modelSel); break;
|
||||
|
||||
// new message handler:
|
||||
case WM_APP_SELECT: { // #define WM_APP_SELECT (WM_USER + 5)
|
||||
int ctrlId = (int)wParam, idx = (int)lParam;
|
||||
if (ctrlId == ID_SEL_AUDIO) { g_audioSel = idx; g_config.capture_id = idx; }
|
||||
else if (ctrlId == ID_SEL_MODEL && idx < (int)g_modelComboPaths.size()) {
|
||||
g_modelSel = idx;
|
||||
g_config.model_path = exe_dir() + "\\" + g_modelComboPaths[idx];
|
||||
g_modelLoaded = false; g_modelOk = false; SetStatus(hWnd, L"Loading model…");
|
||||
std::thread([]{ bool ok=g_tx.reload(g_config); g_modelOk=ok; g_modelLoaded=true; }).detach();
|
||||
}
|
||||
InvalidateRect(GetDlgItem(hWnd, ctrlId), nullptr, FALSE);
|
||||
} break;
|
||||
```
|
||||
|
||||
You can now delete the `CBS_*`/`WM_MEASUREITEM`/`DrawCombo` combo code and the `WM_CTLCOLORLISTBOX` handler. The selectors are now pixel-identical to your other controls with exactly one (your) chevron.
|
||||
|
||||
> Lighter alternative if you don't want a popup window yet: keep the combos but call `SetWindowTheme(hCombo, L"", L"")` — it flattens the dropdown button to a plain square. It's *less* boxy but the button is still there, so the popup-window route above is the real fix.
|
||||
|
||||
---
|
||||
|
||||
## B2. Transcription progress + time estimate
|
||||
|
||||
You don't have to guess the timing — **whisper.cpp reports real progress.** `whisper_full_params` has a `progress_callback` that fires repeatedly during inference with an `int` 0–100 (fraction of the audio processed). Feed that to a determinate progress bar + a live ETA, so "Transcribing…" becomes "Transcribing 1:40 of audio · 45% · ~9s left".
|
||||
|
||||
### B2.1 transcriber — expose progress + audio length
|
||||
|
||||
`transcriber.h` (public):
|
||||
|
||||
```cpp
|
||||
using ProgressCb = std::function<void(int)>; // 0..100
|
||||
void set_progress_callback(ProgressCb cb) { m_on_progress = std::move(cb); }
|
||||
float audio_seconds() const { return m_audio_seconds.load(); }
|
||||
void request_cancel() { m_abort = true; } // optional (B2.4)
|
||||
```
|
||||
`transcriber.h` (private):
|
||||
|
||||
```cpp
|
||||
ProgressCb m_on_progress;
|
||||
std::atomic<float> m_audio_seconds{0.0f};
|
||||
std::atomic<bool> m_abort{false};
|
||||
static void s_progress(struct whisper_context*, struct whisper_state*, int p, void* ud);
|
||||
static bool s_abort(void* ud);
|
||||
```
|
||||
|
||||
`transcriber.cpp` — the static trampolines and the `run_inference` hook:
|
||||
|
||||
```cpp
|
||||
void Transcriber::s_progress(whisper_context*, whisper_state*, int p, void* ud) {
|
||||
auto* self = static_cast<Transcriber*>(ud);
|
||||
if (self && self->m_on_progress) self->m_on_progress(p);
|
||||
}
|
||||
bool Transcriber::s_abort(void* ud) {
|
||||
auto* self = static_cast<Transcriber*>(ud);
|
||||
return self && self->m_abort.load();
|
||||
}
|
||||
|
||||
std::string Transcriber::run_inference(std::vector<float>& audio) {
|
||||
if (!m_ctx) return "";
|
||||
m_abort = false;
|
||||
if (m_cfg.trim_silence) trim_silence(audio);
|
||||
m_audio_seconds = (float)(audio.size() / (double)WHISPER_SAMPLE_RATE); // for the UI
|
||||
|
||||
whisper_full_params wp = whisper_full_default_params(WHISPER_SAMPLING_GREEDY);
|
||||
wp.print_progress = false; wp.print_realtime = false; wp.print_timestamps = false;
|
||||
wp.no_timestamps = true; wp.translate = false;
|
||||
wp.language = m_cfg.language.c_str();
|
||||
wp.n_threads = m_cfg.n_threads;
|
||||
wp.no_context = true; wp.suppress_blank = true; wp.suppress_nst = true; wp.temperature = 0.0f;
|
||||
wp.progress_callback = &Transcriber::s_progress; // <- live progress
|
||||
wp.progress_callback_user_data = this;
|
||||
wp.abort_callback = &Transcriber::s_abort; // <- optional cancel
|
||||
wp.abort_callback_user_data = this;
|
||||
|
||||
std::string out;
|
||||
if (whisper_full(m_ctx, wp, audio.data(), (int)audio.size()) == 0) {
|
||||
int n = whisper_full_n_segments(m_ctx);
|
||||
for (int i = 0; i < n; ++i) { const char* t = whisper_full_get_segment_text(m_ctx, i); if (t) out += t; }
|
||||
out = clean_text(out);
|
||||
}
|
||||
return out;
|
||||
}
|
||||
```
|
||||
|
||||
> If your `whisper.h` predates `abort_callback`, drop those two lines — `progress_callback` has been in whisper.cpp far longer and is what matters here.
|
||||
|
||||
### B2.2 main.cpp — progress state + ETA
|
||||
|
||||
```cpp
|
||||
#define WM_APP_PROGRESS (WM_USER + 6)
|
||||
std::atomic<int> g_progress{0};
|
||||
DWORD g_busyStart = 0;
|
||||
|
||||
// at startup, next to set_result_callback:
|
||||
g_tx.set_progress_callback([](int p){ PostMessage(hMainWnd, WM_APP_PROGRESS, (WPARAM)p, 0); });
|
||||
```
|
||||
|
||||
Start the clock when transcription begins (HK_TOGGLE stop branch):
|
||||
|
||||
```cpp
|
||||
} else { // was recording -> stop
|
||||
g_busyStart = GetTickCount();
|
||||
g_progress = 0;
|
||||
g_tx.stop_and_transcribe();
|
||||
SetStatus(hWnd, L"Transcribing…");
|
||||
}
|
||||
```
|
||||
|
||||
Receive progress and repaint the bar:
|
||||
|
||||
```cpp
|
||||
case WM_APP_PROGRESS:
|
||||
g_progress = (int)wParam;
|
||||
InvalidateRect(hWnd, &g_vuRect, FALSE);
|
||||
return 0;
|
||||
```
|
||||
|
||||
ETA text (replace the `is_busy()` branch in `UpdateStatus`):
|
||||
|
||||
```cpp
|
||||
} else if (g_tx.is_busy()) {
|
||||
int p = g_progress.load();
|
||||
float total = g_tx.audio_seconds();
|
||||
float elapsed = (GetTickCount() - g_busyStart) / 1000.0f;
|
||||
int mm = (int)total / 60, ss = (int)total % 60;
|
||||
if (p >= 3) {
|
||||
float est = elapsed * 100.0f / p; // projected total
|
||||
float remain = est - elapsed; if (remain < 0) remain = 0;
|
||||
swprintf_s(buf, L"Transcribing %d:%02d • %d%% • ~%ds left", mm, ss, p, (int)(remain + 0.5f));
|
||||
} else {
|
||||
swprintf_s(buf, L"Transcribing %d:%02d of audio…", mm, ss);
|
||||
}
|
||||
SetStatus(hwnd, buf);
|
||||
}
|
||||
```
|
||||
|
||||
### B2.3 Reuse the VU strip as a determinate progress bar
|
||||
|
||||
While recording the strip shows the VU; while transcribing it shows progress. Add a renderer and branch in `WM_PAINT`:
|
||||
|
||||
```cpp
|
||||
void DrawProgress(Graphics& g, const RECT& r, float frac) {
|
||||
Rect track(r.left, r.top, r.right - r.left, r.bottom - r.top);
|
||||
FillRound(g, C_SURFACEHI, track, 4);
|
||||
frac = frac < 0 ? 0 : (frac > 1 ? 1 : frac);
|
||||
int w = (int)((r.right - r.left) * frac);
|
||||
if (w > 0) { Rect fill(r.left, r.top, w, r.bottom - r.top); FillRound(g, C_ACCENT, fill, 4); }
|
||||
}
|
||||
```
|
||||
```cpp
|
||||
// in WM_PAINT, where you currently call DrawVU:
|
||||
if (g_tx.is_busy()) DrawProgress(g, g_vuRect, g_progress.load() / 100.0f);
|
||||
else DrawVU(g, g_vuRect, g_energy);
|
||||
```
|
||||
|
||||
Keep it ticking between callbacks so the ETA counts down smoothly — in `WM_TIMER`, add:
|
||||
|
||||
```cpp
|
||||
else if (g_tx.is_busy()) {
|
||||
InvalidateRect(hWnd, &g_vuRect, FALSE); // (UpdateStatus already runs each tick below)
|
||||
}
|
||||
```
|
||||
|
||||
That's it: a moving bar, a percentage, and a shrinking "~Ns left" — the user can see it's alive and roughly how long is left. The estimate self-corrects as real progress arrives (the first few percent are rougher; it tightens quickly).
|
||||
|
||||
### B2.4 (Optional) Cancel a long transcription
|
||||
|
||||
You added `request_cancel()` + the abort callback in B2.1. Hook it so that pressing the button **while busy** aborts instead of being ignored, and treat the empty result as "Cancelled":
|
||||
|
||||
```cpp
|
||||
// top of the HK_TOGGLE handler:
|
||||
if (g_tx.is_busy()) { g_tx.request_cancel(); SetStatus(hWnd, L"Cancelling…"); break; }
|
||||
```
|
||||
`whisper_full` returns promptly with no/aborted segments → your existing `WM_APP_RESULT` empty-string path shows "No speech detected"; change that label to "Cancelled" when a cancel was requested if you want to distinguish them.
|
||||
|
||||
---
|
||||
|
||||
## B3. Build & test
|
||||
|
||||
- **New link deps:** `uxtheme.lib` (added via `#pragma comment` in B1.1). GDI+ is already linked.
|
||||
- **New files:** none required for B2; B1.2 adds the popup window proc inside `main.cpp` (no new translation unit).
|
||||
- **Rebuild:** `cmake --build build --config Release` as usual.
|
||||
|
||||
**Verify:**
|
||||
- [ ] No hairline around *Pinned*; no left/top lines on Copy/Paste/Clear; focus no longer draws a dotted rect.
|
||||
- [ ] Mic + model selectors show a single (your) chevron, open a dark rounded popup, and selecting reloads the model / switches device.
|
||||
- [ ] Record a ~1–2 min clip → the strip fills as a progress bar, the status shows `%` and a shrinking `~Ns left`, and it completes (no static "Transcribing…").
|
||||
- [ ] (If added) pressing the button mid-transcription cancels promptly.
|
||||
|
||||
**Headless regression (extends `tests/test_core.cpp` from `FINDINGS-FIXES-TESTS.md`):**
|
||||
- Set a progress callback that records the max value seen; assert it reaches ~100 for `samples/jfk.wav`, and that callbacks arrive in non-decreasing order. This locks in that progress reporting keeps working across whisper.cpp upgrades.
|
||||
|
||||
```cpp
|
||||
int last = -1, maxp = 0; bool monotonic = true;
|
||||
t.set_progress_callback([&](int p){ if (p < last) monotonic = false; last = p; if (p > maxp) maxp = p; });
|
||||
t.transcribe_sync(audio);
|
||||
CHECK(monotonic, "progress is non-decreasing");
|
||||
CHECK(maxp >= 95, "progress reaches ~100%");
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
*Apply order: B1.1 (5 min, instant visual win) → B2 (progress, the big UX gain) → B1.2 (custom dropdowns) → optional B2.4 cancel. Each is independent and safe to ship on its own.*
|
||||
|
||||
|
||||
@@ -1,8 +1,6 @@
|
||||
# Win Dictation - AI Voice to Text for Windows
|
||||
# Win Dictation — Voice to Text for Windows
|
||||
|
||||
A push-to-talk speech-to-text utility for Windows using OpenAI's Whisper model. Record, transcribe, and paste with a single hotkey.
|
||||
|
||||
|
||||
A push-to-talk speech-to-text utility for Windows. Press a hotkey, speak, and your words land in whatever app you were just using — fully offline, powered by Whisper.
|
||||
|
||||
## Quick Download
|
||||
|
||||
@@ -12,12 +10,18 @@ Extract the ZIP file and run `win-dictation.exe`. The release includes all requi
|
||||
|
||||
---
|
||||
|
||||
## Documentation
|
||||
|
||||
- **[User Manual](win-dictation-user-manual.html)** — How to use every feature
|
||||
- **[Architecture & Engineering Review](win-dictation-architecture-engineering-review.html)** — Deep dive into the codebase for developers
|
||||
|
||||
---
|
||||
|
||||
## Features
|
||||
|
||||
### Performance
|
||||
- **Physical-core threading**: Uses one thread per physical core for efficient batch transcription
|
||||
- **CPU-only**: Optimised for the target Intel i5-7th-gen 2-core/4-thread machine
|
||||
- **Smart model selection**: Auto-selects tiny.en for CPU-only, base.en when GPU is present
|
||||
- **CPU-only**: Optimised for ordinary laptops — no GPU required
|
||||
- **Self-calibrating progress**: Learns transcription speed per model and machine, delivering a smooth countdown
|
||||
|
||||
### User Interface
|
||||
@@ -28,23 +32,25 @@ Extract the ZIP file and run `win-dictation.exe`. The release includes all requi
|
||||
|
||||
### Audio Processing
|
||||
- **Push-to-talk**: Press Ctrl+Shift+Space, speak, press again to transcribe
|
||||
- **500ms auto-end**: Stops recording after 500ms of silence
|
||||
- **Multiple microphones**: Select from all available input devices
|
||||
- **16kHz sample rate**: Optimised for Whisper
|
||||
- **16 kHz sample rate**: Optimised for Whisper
|
||||
- **Silence trimming**: Leading and trailing silence is trimmed before transcription
|
||||
|
||||
## Usage
|
||||
## Quick Start
|
||||
|
||||
1. Launch `win-dictation.exe`
|
||||
2. Click into wherever you want text, then press `Ctrl+Shift+Space`
|
||||
3. Speak, then press `Ctrl+Shift+Space` again
|
||||
4. Your words appear in the app you were using
|
||||
|
||||
Full instructions in the [User Manual](win-dictation-user-manual.html).
|
||||
|
||||
### Controls
|
||||
- **Record**: Click the Record pill or press `Ctrl+Shift+Space`
|
||||
- **Record/Stop**: Click the pill or press `Ctrl+Shift+Space`
|
||||
- **Hide window**: `Ctrl+Shift+H`
|
||||
- **Pin**: Keep window always-on-top
|
||||
- **Copy / Paste / Clear**: Text actions
|
||||
- **Model / Mic**: Select from popup menus
|
||||
- **Hide**: `Ctrl+Shift+H` hides the window
|
||||
|
||||
### Indicators
|
||||
- **Level**: Live audio energy during recording
|
||||
- **Progress bar**: Smooth, counting-down estimate during transcription
|
||||
- **Status**: Thread count at idle, elapsed time during recording
|
||||
- **Copy / Paste / Clear**: Text actions below the transcript
|
||||
- **Model / Mic / History**: Select from popup menus
|
||||
|
||||
## Building from Source
|
||||
|
||||
@@ -52,13 +58,13 @@ Extract the ZIP file and run `win-dictation.exe`. The release includes all requi
|
||||
|
||||
- **Windows 10/11**
|
||||
- **CMake** 3.5+
|
||||
- **Visual Studio 2022/2026** with C++ workload
|
||||
- **Visual Studio 2022** with C++ workload
|
||||
- **SDL2** (included in deps/)
|
||||
|
||||
### Build Steps
|
||||
|
||||
```powershell
|
||||
cmake -S . -B build -G "Visual Studio 18 2026" \
|
||||
cmake -S . -B build -G "Visual Studio 17 2022" ^
|
||||
-DSDL2_DIR="deps/SDL2-2.28.5/cmake"
|
||||
cmake --build build --config Release
|
||||
```
|
||||
@@ -73,36 +79,45 @@ The executable will be at `build\bin\Release\win-dictation.exe`.
|
||||
Hotkey → SDL Capture → Stop → Batch whisper_full → Text → Auto-paste
|
||||
```
|
||||
|
||||
1. **SDL audio capture**: 16kHz mono recording into memory
|
||||
2. **Stop-and-transcribe**: Press stop or hit max length (600s), then one `whisper_full` call
|
||||
3. **Progress estimation**: Linear model fitted per machine/model, fused with whisper's chunk progress
|
||||
4. **Text output**: Appended to transcript, copied to clipboard, optionally auto-pasted
|
||||
1. **SDL audio capture**: 16 kHz mono recording into memory. CPU stays near idle while recording.
|
||||
2. **Stop-and-transcribe**: One `whisper_full` call processes the full clip at once.
|
||||
3. **Progress estimation**: Decayed online least-squares model per machine/model, fused with whisper's chunk progress into a strictly monotonic countdown.
|
||||
4. **Text output**: Inserted at cursor with smart spacing, copied to clipboard, and optionally auto-pasted into the window you came from.
|
||||
|
||||
### Model
|
||||
### Models
|
||||
|
||||
Place `.bin` files in `models/` next to the executable. The app auto-detects available models:
|
||||
Place `.bin` files in `models/` next to the executable, or download them from the Settings screen in-app:
|
||||
|
||||
| Model | Size | Params | Best for |
|
||||
|-------|------|--------|----------|
|
||||
| tiny.en | 75 MB | 39M | CPU-only systems |
|
||||
| base.en | 140 MB | 74M | GPU-accelerated systems |
|
||||
| Model | Size | Best for |
|
||||
|-------|------|----------|
|
||||
| tiny.en | ~75 MB | Fastest — everyday dictation |
|
||||
| tiny.en-q8_0 | ~42 MB | Same speed, smaller file |
|
||||
| base.en-q5_1 | ~59 MB | Good accuracy bump for little cost |
|
||||
| base.en | ~142 MB | More accurate; still reasonable on two cores |
|
||||
| small.en-q5_1 | ~182 MB | Accurate, but slower |
|
||||
| small.en | ~466 MB | Most accurate — and slowest |
|
||||
|
||||
## Project Structure
|
||||
|
||||
```
|
||||
win-dictation/
|
||||
├── src/ # Application source
|
||||
│ ├── main.cpp # UI and message handling
|
||||
│ ├── transcriber.* # Recording and transcription
|
||||
│ ├── timing.h # Progress estimation engine
|
||||
│ ├── settings.h # INI persistence
|
||||
│ ├── text_util.h # Transcript helpers
|
||||
│ └── logging.h # Log utilities
|
||||
├── whisper/ # Whisper.cpp library
|
||||
├── ggml/ # GGML tensor library
|
||||
├── models/ # Whisper model files
|
||||
├── release/ # Pre-built package
|
||||
└── CMakeLists.txt # Build configuration
|
||||
├── src/ # Application source
|
||||
│ ├── main.cpp # Window, painting, interaction, settings, clipboard, popups
|
||||
│ ├── transcriber.* # SDL capture, Whisper preload/inference, progress callbacks
|
||||
│ ├── timing.h # Learned timing model + live progress estimator
|
||||
│ ├── history.h # Session text files, index, pruning
|
||||
│ ├── downloader.h # WinHTTP model downloader (background thread)
|
||||
│ ├── stats.h # Lifetime usage totals + derived figures
|
||||
│ ├── settings.h # INI persistence
|
||||
│ ├── text_util.h # Transcript concatenation helpers
|
||||
│ ├── logging.h # Timestamped file log
|
||||
│ └── tests/ # Unit tests (test-core.exe)
|
||||
├── whisper/ # Whisper.cpp library
|
||||
├── ggml/ # GGML tensor library
|
||||
├── models/ # Whisper model files
|
||||
├── history/ # Saved dictation sessions
|
||||
├── release/ # Pre-built package
|
||||
└── CMakeLists.txt # Build configuration
|
||||
```
|
||||
|
||||
## License
|
||||
@@ -111,5 +126,7 @@ MIT — follows [whisper.cpp](https://github.com/ggerganov/whisper.cpp).
|
||||
|
||||
## Resources
|
||||
|
||||
- [User Manual](win-dictation-user-manual.html)
|
||||
- [Architecture & Engineering Review](win-dictation-architecture-engineering-review.html)
|
||||
- [Whisper.cpp](https://github.com/ggerganov/whisper.cpp)
|
||||
- [Model Download](https://huggingface.co/ggerganov/whisper.cpp)
|
||||
- [Model Downloads](https://huggingface.co/ggerganov/whisper.cpp)
|
||||
|
||||
@@ -0,0 +1,366 @@
|
||||
# Fix 06 — Delete individual history entries from the popup (✕ on hover)
|
||||
|
||||
**Builds on:** Fix-03/04 (popup) and **Fix-05 (live session archiving) — apply Fix-05 first.**
|
||||
One block below references `g_sessionPath` from Fix-05; it is clearly marked in case you
|
||||
must build without it.
|
||||
**Files touched:** `src/main.cpp` only. `history.h` unchanged.
|
||||
**Estimated effort:** 45–60 minutes including testing.
|
||||
|
||||
---
|
||||
|
||||
## 1. What we're building
|
||||
|
||||
- Hovering a row in the **History** popup reveals a small `✕` at the row's right edge.
|
||||
- Clicking the `✕` deletes that entry's file from `history\` and refreshes the list
|
||||
**in place — the popup stays open**, so you can clean out several entries in one go.
|
||||
- Clicking anywhere else on the row still loads the entry (unchanged behaviour).
|
||||
- The `Delete` key also deletes the hovered row (the popup already owns keyboard focus).
|
||||
- The **microphone popup is untouched** — it shares the same code, so the feature is
|
||||
gated by a `canDelete` flag that is only true for `ID_SEL_HISTORY`.
|
||||
|
||||
### Design decisions (so the dev doesn't relitigate them)
|
||||
|
||||
1. **Popup stays open after a delete.** Closing after each delete would make cleaning
|
||||
up 10–50 entries miserable. The list, scrollbar, and popup height all refresh in
|
||||
place; deleting the last entry closes the popup.
|
||||
2. **No confirmation dialog — and this is load-bearing, not laziness.** The popup
|
||||
destroys itself on `WM_ACTIVATE / WA_INACTIVE` (that's the click-away-to-close
|
||||
behaviour). A `MessageBox` shown from inside `PopupProc` would *deactivate the
|
||||
popup, destroy it mid-handler, and then resume the handler with a dead `HWND`* —
|
||||
undefined behaviour. **Never open a modal dialog from `PopupProc`.** If a safety
|
||||
net is wanted later, use the soft-delete variant in §8 instead.
|
||||
3. **Deleting the LIVE session's entry detaches the session** (see §7) so Clear/exit
|
||||
don't instantly resurrect the file you just deleted.
|
||||
|
||||
---
|
||||
|
||||
## 2. Step 1 — Extend `PopupState`
|
||||
|
||||
Find the `PopupState` struct and add the two marked fields:
|
||||
|
||||
```cpp
|
||||
struct PopupState {
|
||||
std::vector<std::wstring> items;
|
||||
int sel = -1;
|
||||
int hot = -1;
|
||||
HWND owner = nullptr;
|
||||
int ctrlId = 0;
|
||||
int scroll = 0;
|
||||
int visRows = 0;
|
||||
int rowH = 30;
|
||||
int pad = 3;
|
||||
int wheelAccum = 0;
|
||||
bool canDelete = false; // NEW: rows show a ✕ delete button (history popup only)
|
||||
int hotX = -1; // NEW: ABSOLUTE index of the row whose ✕ is hovered, -1 = none
|
||||
};
|
||||
```
|
||||
|
||||
(`g_pop = PopupState{};` in `ShowSelectPopup` already resets the new fields each open —
|
||||
no extra reset code needed.)
|
||||
|
||||
## 3. Step 2 — Three small helpers
|
||||
|
||||
Paste these **between `PopupRowFromY` and `PopupProc`** (they must be above `PopupProc`;
|
||||
`PopupRowFromY` itself is unchanged):
|
||||
|
||||
```cpp
|
||||
// The ✕ hit square for a VISIBLE row (0..visRows-1), in popup client coords.
|
||||
// Sits at the right edge of the row, inside the scrollbar gutter if present.
|
||||
static Rect PopupDeleteRect(const RECT& rc, int visIdx) {
|
||||
int n = (int)g_pop.items.size();
|
||||
bool hasBar = n > g_pop.visRows;
|
||||
int barW = std::max(3, (int)(4 * g_dpiScale));
|
||||
int rowW = rc.right - 2 * g_pop.pad - (hasBar ? barW + g_pop.pad : 0);
|
||||
int xW = g_pop.rowH; // square zone, one row tall
|
||||
return Rect(g_pop.pad + rowW - xW, g_pop.pad + visIdx * g_pop.rowH, xW, g_pop.rowH - 2);
|
||||
}
|
||||
|
||||
// Recompute hot row + hovered-✕ from the current cursor position. Used after
|
||||
// scrolling and after a delete (the list moved under a stationary cursor).
|
||||
static void PopupRefreshHotFromCursor(HWND h) {
|
||||
POINT pt; GetCursorPos(&pt); ScreenToClient(h, &pt);
|
||||
int row = PopupRowFromY(pt.y);
|
||||
int hx = -1;
|
||||
if (g_pop.canDelete && row >= 0) {
|
||||
RECT rc; GetClientRect(h, &rc);
|
||||
if (PopupDeleteRect(rc, row - g_pop.scroll).Contains(pt.x, pt.y)) hx = row;
|
||||
}
|
||||
g_pop.hot = row; g_pop.hotX = hx;
|
||||
}
|
||||
|
||||
// Delete the history file behind ABSOLUTE row `row`, then refresh the popup
|
||||
// in place. The popup stays open so several entries can be deleted in a row.
|
||||
static void PopupDeleteRow(HWND h, int row) {
|
||||
if (row < 0 || row >= (int)g_history.size()) return;
|
||||
std::wstring path = g_history[row].path;
|
||||
bool ok = DeleteFileW(path.c_str()) != FALSE;
|
||||
|
||||
// ---- Requires Fix-05 (g_sessionPath). Omit this block ONLY if building
|
||||
// ---- without Fix-05, and apply it when Fix-05 lands.
|
||||
if (ok && path == g_sessionPath) {
|
||||
// The LIVE session's file was deleted: detach the session so Clear/exit
|
||||
// don't immediately re-archive the same text. If the user dictates MORE,
|
||||
// a new file is created — history always mirrors the transcript box.
|
||||
g_sessionPath.clear();
|
||||
g_lastLoadedText = GetEditText(g_pop.owner);
|
||||
}
|
||||
// ---- end Fix-05-dependent block
|
||||
|
||||
g_history = LoadHistoryIndex(); // re-scan the folder
|
||||
g_pop.items.clear();
|
||||
g_pop.items.reserve(g_history.size());
|
||||
for (const auto& e : g_history) g_pop.items.push_back(e.label);
|
||||
|
||||
SetStatus(g_pop.owner, ok ? L"Deleted" : L"Delete failed");
|
||||
|
||||
int n = (int)g_pop.items.size();
|
||||
if (n == 0) { DestroyWindow(h); return; } // nothing left to show
|
||||
|
||||
// Shrink the popup when fewer rows remain than were visible. It opens
|
||||
// upward, so keep the BOTTOM edge fixed and move the top edge down.
|
||||
if (n < g_pop.visRows) {
|
||||
g_pop.visRows = n;
|
||||
int newH = n * g_pop.rowH + 2 * g_pop.pad;
|
||||
RECT wr; GetWindowRect(h, &wr);
|
||||
SetWindowPos(h, nullptr, wr.left, wr.bottom - newH,
|
||||
wr.right - wr.left, newH, SWP_NOZORDER | SWP_NOACTIVATE);
|
||||
}
|
||||
int maxScroll = std::max(0, n - g_pop.visRows);
|
||||
g_pop.scroll = std::min(g_pop.scroll, maxScroll);
|
||||
|
||||
PopupRefreshHotFromCursor(h);
|
||||
InvalidateRect(h, nullptr, FALSE);
|
||||
}
|
||||
```
|
||||
|
||||
Why this is safe to do from `PopupProc`: everything here runs on the UI thread,
|
||||
`g_history` / `g_sessionPath` / `g_lastLoadedText` are main-thread globals declared
|
||||
earlier in the file, and `GetEditText` / `SetStatus` / `LoadHistoryIndex` are all
|
||||
declared above the popup code already. Indices stay valid because `g_pop.items` is
|
||||
rebuilt 1:1 from the freshly reloaded `g_history` — the existing `WM_APP_SELECT`
|
||||
handler keeps working unchanged.
|
||||
|
||||
## 4. Step 3 — Replace `PopupProc` (entire function)
|
||||
|
||||
Replace the whole `LRESULT CALLBACK PopupProc(...)` with the version below. Changes vs
|
||||
Fix-04: ✕ hover tracking in `WM_MOUSEMOVE`, `WM_MOUSEWHEEL` now uses
|
||||
`PopupRefreshHotFromCursor`, `WM_KEYDOWN` gains `VK_DELETE`, `WM_LBUTTONUP` routes
|
||||
✕-clicks to `PopupDeleteRow` (and does NOT close), and `WM_PAINT` draws the ✕ and
|
||||
reserves label space for it. Everything else is byte-for-byte the Fix-04 code.
|
||||
|
||||
```cpp
|
||||
LRESULT CALLBACK PopupProc(HWND h, UINT m, WPARAM w, LPARAM l) {
|
||||
switch (m) {
|
||||
case WM_MOUSEMOVE: {
|
||||
int row = PopupRowFromY(GET_Y_LPARAM(l));
|
||||
int hx = -1;
|
||||
if (g_pop.canDelete && row >= 0) {
|
||||
RECT rc; GetClientRect(h, &rc);
|
||||
if (PopupDeleteRect(rc, row - g_pop.scroll).Contains(GET_X_LPARAM(l), GET_Y_LPARAM(l)))
|
||||
hx = row;
|
||||
}
|
||||
if (row != g_pop.hot || hx != g_pop.hotX) {
|
||||
g_pop.hot = row; g_pop.hotX = hx;
|
||||
InvalidateRect(h, nullptr, FALSE);
|
||||
}
|
||||
TRACKMOUSEEVENT t{ sizeof(t), TME_LEAVE, h, 0 }; TrackMouseEvent(&t);
|
||||
return 0;
|
||||
}
|
||||
case WM_MOUSELEAVE:
|
||||
g_pop.hot = -1; g_pop.hotX = -1; InvalidateRect(h, nullptr, FALSE);
|
||||
return 0;
|
||||
case WM_MOUSEWHEEL: {
|
||||
int maxScroll = (int)g_pop.items.size() - g_pop.visRows;
|
||||
if (maxScroll <= 0) return 0;
|
||||
g_pop.wheelAccum += GET_WHEEL_DELTA_WPARAM(w);
|
||||
int steps = g_pop.wheelAccum / WHEEL_DELTA;
|
||||
if (steps != 0) {
|
||||
g_pop.wheelAccum -= steps * WHEEL_DELTA;
|
||||
g_pop.scroll -= steps * 3;
|
||||
g_pop.scroll = std::max(0, std::min(g_pop.scroll, maxScroll));
|
||||
PopupRefreshHotFromCursor(h);
|
||||
InvalidateRect(h, nullptr, FALSE);
|
||||
}
|
||||
return 0;
|
||||
}
|
||||
case WM_KEYDOWN:
|
||||
if (w == VK_ESCAPE) DestroyWindow(h);
|
||||
else if (w == VK_DELETE && g_pop.canDelete && g_pop.hot >= 0)
|
||||
PopupDeleteRow(h, g_pop.hot);
|
||||
return 0;
|
||||
case WM_LBUTTONUP: {
|
||||
int row = PopupRowFromY(GET_Y_LPARAM(l));
|
||||
if (g_pop.canDelete && row >= 0) {
|
||||
RECT rc; GetClientRect(h, &rc);
|
||||
if (PopupDeleteRect(rc, row - g_pop.scroll).Contains(GET_X_LPARAM(l), GET_Y_LPARAM(l))) {
|
||||
PopupDeleteRow(h, row); // delete — popup STAYS OPEN
|
||||
return 0;
|
||||
}
|
||||
}
|
||||
if (row >= 0)
|
||||
PostMessageW(g_pop.owner, WM_APP_SELECT, (WPARAM)g_pop.ctrlId, (LPARAM)row);
|
||||
DestroyWindow(h);
|
||||
return 0;
|
||||
}
|
||||
case WM_ACTIVATE:
|
||||
if (LOWORD(w) == WA_INACTIVE) DestroyWindow(h);
|
||||
return 0;
|
||||
case WM_ERASEBKGND: return 1;
|
||||
case WM_PAINT: {
|
||||
PAINTSTRUCT ps; HDC hdc = BeginPaint(h, &ps);
|
||||
RECT rc; GetClientRect(h, &rc);
|
||||
HDC mem = CreateCompatibleDC(hdc);
|
||||
HBITMAP bmp = CreateCompatibleBitmap(hdc, rc.right, rc.bottom);
|
||||
HBITMAP old = (HBITMAP)SelectObject(mem, bmp);
|
||||
{
|
||||
Graphics g(mem);
|
||||
g.SetSmoothingMode(SmoothingModeAntiAlias);
|
||||
g.SetTextRenderingHint(TextRenderingHintClearTypeGridFit);
|
||||
Rect all(0, 0, rc.right, rc.bottom);
|
||||
FillRound(g, T_CARD, all, 10);
|
||||
StrokeRound(g, T_FAINT, all, 10, 1.0f);
|
||||
int n = (int)g_pop.items.size();
|
||||
bool hasBar = n > g_pop.visRows;
|
||||
int barW = std::max(3, (int)(4 * g_dpiScale));
|
||||
int rowW = rc.right - 2 * g_pop.pad - (hasBar ? barW + g_pop.pad : 0);
|
||||
int reserve = g_pop.canDelete ? g_pop.rowH : 0; // keep labels clear of the ✕ zone
|
||||
int last = std::min(n, g_pop.scroll + g_pop.visRows);
|
||||
for (int i = g_pop.scroll; i < last; ++i) {
|
||||
int vis = i - g_pop.scroll;
|
||||
Rect row(g_pop.pad, g_pop.pad + vis * g_pop.rowH, rowW, g_pop.rowH - 2);
|
||||
if (i == g_pop.hot) FillRound(g, T_CARD_HI, row, 7);
|
||||
RectF tb((REAL)row.X + 9, (REAL)row.Y, (REAL)(row.Width - 12 - reserve), (REAL)row.Height);
|
||||
DrawTextC(g, g_pop.items[i].c_str(), *g_gpUI,
|
||||
(i == g_pop.sel) ? T_ACCENT : T_TEXT,
|
||||
tb, StringAlignmentNear, StringAlignmentCenter);
|
||||
if (g_pop.canDelete && i == g_pop.hot) { // ✕ only on the hovered row
|
||||
Rect xr = PopupDeleteRect(rc, vis);
|
||||
if (i == g_pop.hotX) FillRound(g, T_CARD_LO, xr, 6);
|
||||
RectF xb((REAL)xr.X, (REAL)xr.Y, (REAL)xr.Width, (REAL)xr.Height);
|
||||
DrawTextC(g, L"✕", *g_gpUI,
|
||||
(i == g_pop.hotX) ? T_DANGER : T_FAINT,
|
||||
xb, StringAlignmentCenter, StringAlignmentCenter);
|
||||
}
|
||||
}
|
||||
if (hasBar) {
|
||||
int trackH = rc.bottom - 2 * g_pop.pad;
|
||||
int thumbH = std::max((int)(20 * g_dpiScale), trackH * g_pop.visRows / n);
|
||||
int maxScroll = n - g_pop.visRows;
|
||||
int thumbY = g_pop.pad + (trackH - thumbH) * g_pop.scroll / maxScroll;
|
||||
Rect thumb(rc.right - g_pop.pad - barW, thumbY, barW, thumbH);
|
||||
FillRound(g, T_DIM, thumb, barW / 2);
|
||||
}
|
||||
}
|
||||
BitBlt(hdc, 0, 0, rc.right, rc.bottom, mem, 0, 0, SRCCOPY);
|
||||
SelectObject(mem, old); DeleteObject(bmp); DeleteDC(mem);
|
||||
EndPaint(h, &ps);
|
||||
return 0;
|
||||
}
|
||||
}
|
||||
return DefWindowProc(h, m, w, l);
|
||||
}
|
||||
```
|
||||
|
||||
Visual spec, matching the app's design language: the ✕ (`✕`) appears only on the
|
||||
hovered row, drawn in `T_FAINT`; when the cursor is over the ✕ itself it turns
|
||||
`T_DANGER` red on a subtle `T_CARD_LO` chip. Labels always reserve the ✕ column in the
|
||||
history popup so text doesn't shift when hover reveals the button.
|
||||
|
||||
## 5. Step 4 — Enable it for the History popup only
|
||||
|
||||
In `ShowSelectPopup`, find:
|
||||
|
||||
```cpp
|
||||
g_pop.ctrlId = ctrlId;
|
||||
```
|
||||
|
||||
Add one line directly below it:
|
||||
|
||||
```cpp
|
||||
g_pop.ctrlId = ctrlId;
|
||||
g_pop.canDelete = (ctrlId == ID_SEL_HISTORY); // ✕ delete buttons: history only
|
||||
```
|
||||
|
||||
That's the entire gating — the mic popup keeps `canDelete == false` and renders/behaves
|
||||
exactly as before.
|
||||
|
||||
## 6. No other changes
|
||||
|
||||
- `OnClick` (History / SelAudio cases), `ShowSelectPopup`'s sizing/placement,
|
||||
`WM_APP_SELECT`, `history.h` — all untouched.
|
||||
- No new message IDs, no new globals beyond the two `PopupState` fields.
|
||||
|
||||
## 7. Interaction with the live session (Fix-05) — read this
|
||||
|
||||
Fix-05 keeps the current dictation session mirrored to a history file
|
||||
(`g_sessionPath`). If the user deletes THAT entry from the popup:
|
||||
|
||||
- Without special handling, `FinalizeSession` would re-archive the box text on the next
|
||||
Clear/exit — the file the user just deleted would instantly come back.
|
||||
- The marked block in `PopupDeleteRow` prevents that: it clears `g_sessionPath` and sets
|
||||
`g_lastLoadedText` to the current box text, so Clear/exit treat the box content as
|
||||
"already accounted for" and do NOT re-archive it. (This is the same guard mechanism
|
||||
Fix-05 documented — used deliberately here, because the user explicitly said
|
||||
"forget this".)
|
||||
- **Documented behaviour, not a bug:** if the user deletes the live entry and then
|
||||
dictates *more*, a NEW history file is created containing the box's full text —
|
||||
history always mirrors the transcript box. To make a session vanish completely:
|
||||
delete the entry, then Clear.
|
||||
|
||||
## 8. Optional variant — soft delete (trash folder)
|
||||
|
||||
If you ever want an undo path, change ONE line in `PopupDeleteRow`. Replace:
|
||||
|
||||
```cpp
|
||||
bool ok = DeleteFileW(path.c_str()) != FALSE;
|
||||
```
|
||||
|
||||
with:
|
||||
|
||||
```cpp
|
||||
std::wstring trashDir = HistoryDir() + L"\\trash";
|
||||
CreateDirectoryW(trashDir.c_str(), nullptr);
|
||||
std::wstring dest = trashDir + path.substr(path.find_last_of(L'\\'));
|
||||
bool ok = MoveFileExW(path.c_str(), dest.c_str(), MOVEFILE_REPLACE_EXISTING) != FALSE;
|
||||
```
|
||||
|
||||
`LoadHistoryIndex` only scans `history\*.txt` (not subfolders), so trashed entries
|
||||
disappear from the popup but remain recoverable by hand. Not wired to any UI — purely a
|
||||
safety net. Skip this for v1 unless asked.
|
||||
|
||||
## 9. Build & test checklist
|
||||
|
||||
1. **Reveal:** open History, move the mouse down the rows — a faint ✕ appears at the
|
||||
right edge of the hovered row only; it turns red when the cursor reaches it.
|
||||
2. **Delete:** click a ✕ → the row disappears, the file is gone from the `history\`
|
||||
folder, status shows "Deleted", and the **popup stays open**.
|
||||
3. **Multi-delete:** delete 3–4 entries in a row without the popup closing; hover
|
||||
highlight stays correct after each (the list shifts under the cursor).
|
||||
4. **Row click still loads:** clicking a row anywhere left of the ✕ loads the entry and
|
||||
closes the popup, exactly as before.
|
||||
5. **Scrollbar transition:** with 9+ entries, delete down to 8 → the scrollbar
|
||||
disappears and rows widen slightly; scrolled state stays sane (no blank gaps).
|
||||
6. **Shrink:** with ≤7 entries left, delete more — the popup gets shorter with its
|
||||
bottom edge fixed just above the selects row (it shrinks downward-in-place, never
|
||||
floats away).
|
||||
7. **Last entry:** deleting the final entry closes the popup; clicking History again
|
||||
shows "No history yet".
|
||||
8. **Delete key:** hover a row, press `Delete` → same as clicking its ✕.
|
||||
9. **Live session:** dictate (entry appears per Fix-05) → open History → delete that
|
||||
entry → press Clear → status "Cleared" and the entry does NOT come back. Then
|
||||
dictate again → a new entry appears (documented in §7).
|
||||
10. **Mic popup regression:** the Microphone popup shows NO ✕, full-width labels,
|
||||
selection works — completely unchanged.
|
||||
11. **Esc / click-away:** still close the popup; no delete is triggered.
|
||||
12. **DPI 125/150%:** ✕ hit zone lines up with the drawn glyph.
|
||||
|
||||
## 10. Do NOT touch / do NOT add
|
||||
|
||||
- **Do NOT add a `MessageBox` confirmation inside `PopupProc`** — the popup destroys
|
||||
itself on deactivation (`WM_ACTIVATE`/`WA_INACTIVE`), so a modal dialog kills the
|
||||
popup mid-handler and the code resumes with a destroyed `HWND`. If confirmation is
|
||||
ever required, use the §8 trash variant or build it into the popup's own surface.
|
||||
- `PopupRowFromY`, `ShowSelectPopup` (besides the one-line flag), `history.h`,
|
||||
`WM_APP_SELECT`, `FinalizeSession` — unchanged.
|
||||
- `g_pop.sel` needs no remapping on delete: the history popup always opens with
|
||||
`sel = -1`, and the mic popup (which uses `sel`) can't delete.
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 43 KiB |
+96
-12
@@ -218,6 +218,8 @@ struct PopupState {
|
||||
int rowH = 30;
|
||||
int pad = 3;
|
||||
int wheelAccum = 0;
|
||||
bool canDelete = false;
|
||||
int hotX = -1;
|
||||
};
|
||||
static PopupState g_pop;
|
||||
|
||||
@@ -659,16 +661,79 @@ static int PopupRowFromY(int y) {
|
||||
return abs;
|
||||
}
|
||||
|
||||
static Rect PopupDeleteRect(const RECT& rc, int visIdx) {
|
||||
int n = (int)g_pop.items.size();
|
||||
bool hasBar = n > g_pop.visRows;
|
||||
int barW = std::max(3, (int)(4 * g_dpiScale));
|
||||
int rowW = rc.right - 2 * g_pop.pad - (hasBar ? barW + g_pop.pad : 0);
|
||||
int xW = g_pop.rowH;
|
||||
return Rect(g_pop.pad + rowW - xW, g_pop.pad + visIdx * g_pop.rowH, xW, g_pop.rowH - 2);
|
||||
}
|
||||
|
||||
static void PopupRefreshHotFromCursor(HWND h) {
|
||||
POINT pt; GetCursorPos(&pt); ScreenToClient(h, &pt);
|
||||
int row = PopupRowFromY(pt.y);
|
||||
int hx = -1;
|
||||
if (g_pop.canDelete && row >= 0) {
|
||||
RECT rc; GetClientRect(h, &rc);
|
||||
if (PopupDeleteRect(rc, row - g_pop.scroll).Contains(pt.x, pt.y)) hx = row;
|
||||
}
|
||||
g_pop.hot = row; g_pop.hotX = hx;
|
||||
}
|
||||
|
||||
static void PopupDeleteRow(HWND h, int row) {
|
||||
if (row < 0 || row >= (int)g_history.size()) return;
|
||||
std::wstring path = g_history[row].path;
|
||||
bool ok = DeleteFileW(path.c_str()) != FALSE;
|
||||
|
||||
if (ok && path == g_sessionPath) {
|
||||
g_sessionPath.clear();
|
||||
g_lastLoadedText = GetEditText(g_pop.owner);
|
||||
}
|
||||
|
||||
g_history = LoadHistoryIndex();
|
||||
g_pop.items.clear();
|
||||
g_pop.items.reserve(g_history.size());
|
||||
for (const auto& e : g_history) g_pop.items.push_back(e.label);
|
||||
|
||||
SetStatus(g_pop.owner, ok ? L"Deleted" : L"Delete failed");
|
||||
|
||||
int n = (int)g_pop.items.size();
|
||||
if (n == 0) { DestroyWindow(h); return; }
|
||||
|
||||
if (n < g_pop.visRows) {
|
||||
g_pop.visRows = n;
|
||||
int newH = n * g_pop.rowH + 2 * g_pop.pad;
|
||||
RECT wr; GetWindowRect(h, &wr);
|
||||
SetWindowPos(h, nullptr, wr.left, wr.bottom - newH,
|
||||
wr.right - wr.left, newH, SWP_NOZORDER | SWP_NOACTIVATE);
|
||||
}
|
||||
int maxScroll = std::max(0, n - g_pop.visRows);
|
||||
g_pop.scroll = std::min(g_pop.scroll, maxScroll);
|
||||
|
||||
PopupRefreshHotFromCursor(h);
|
||||
InvalidateRect(h, nullptr, FALSE);
|
||||
}
|
||||
|
||||
LRESULT CALLBACK PopupProc(HWND h, UINT m, WPARAM w, LPARAM l) {
|
||||
switch (m) {
|
||||
case WM_MOUSEMOVE: {
|
||||
int row = PopupRowFromY(GET_Y_LPARAM(l));
|
||||
if (row != g_pop.hot) { g_pop.hot = row; InvalidateRect(h, nullptr, FALSE); }
|
||||
int hx = -1;
|
||||
if (g_pop.canDelete && row >= 0) {
|
||||
RECT rc; GetClientRect(h, &rc);
|
||||
if (PopupDeleteRect(rc, row - g_pop.scroll).Contains(GET_X_LPARAM(l), GET_Y_LPARAM(l)))
|
||||
hx = row;
|
||||
}
|
||||
if (row != g_pop.hot || hx != g_pop.hotX) {
|
||||
g_pop.hot = row; g_pop.hotX = hx;
|
||||
InvalidateRect(h, nullptr, FALSE);
|
||||
}
|
||||
TRACKMOUSEEVENT t{ sizeof(t), TME_LEAVE, h, 0 }; TrackMouseEvent(&t);
|
||||
return 0;
|
||||
}
|
||||
case WM_MOUSELEAVE:
|
||||
g_pop.hot = -1; InvalidateRect(h, nullptr, FALSE);
|
||||
g_pop.hot = -1; g_pop.hotX = -1; InvalidateRect(h, nullptr, FALSE);
|
||||
return 0;
|
||||
case WM_MOUSEWHEEL: {
|
||||
int maxScroll = (int)g_pop.items.size() - g_pop.visRows;
|
||||
@@ -679,17 +744,25 @@ LRESULT CALLBACK PopupProc(HWND h, UINT m, WPARAM w, LPARAM l) {
|
||||
g_pop.wheelAccum -= steps * WHEEL_DELTA;
|
||||
g_pop.scroll -= steps * 3;
|
||||
g_pop.scroll = std::max(0, std::min(g_pop.scroll, maxScroll));
|
||||
POINT pt; GetCursorPos(&pt); ScreenToClient(h, &pt);
|
||||
g_pop.hot = PopupRowFromY(pt.y);
|
||||
PopupRefreshHotFromCursor(h);
|
||||
InvalidateRect(h, nullptr, FALSE);
|
||||
}
|
||||
return 0;
|
||||
}
|
||||
case WM_KEYDOWN:
|
||||
if (w == VK_ESCAPE) DestroyWindow(h);
|
||||
else if (w == VK_DELETE && g_pop.canDelete && g_pop.hot >= 0)
|
||||
PopupDeleteRow(h, g_pop.hot);
|
||||
return 0;
|
||||
case WM_LBUTTONUP: {
|
||||
int row = PopupRowFromY(GET_Y_LPARAM(l));
|
||||
if (g_pop.canDelete && row >= 0) {
|
||||
RECT rc; GetClientRect(h, &rc);
|
||||
if (PopupDeleteRect(rc, row - g_pop.scroll).Contains(GET_X_LPARAM(l), GET_Y_LPARAM(l))) {
|
||||
PopupDeleteRow(h, row);
|
||||
return 0;
|
||||
}
|
||||
}
|
||||
if (row >= 0)
|
||||
PostMessageW(g_pop.owner, WM_APP_SELECT, (WPARAM)g_pop.ctrlId, (LPARAM)row);
|
||||
DestroyWindow(h);
|
||||
@@ -712,21 +785,31 @@ LRESULT CALLBACK PopupProc(HWND h, UINT m, WPARAM w, LPARAM l) {
|
||||
Rect all(0, 0, rc.right, rc.bottom);
|
||||
FillRound(g, T_CARD, all, 10);
|
||||
StrokeRound(g, T_FAINT, all, 10, 1.0f);
|
||||
|
||||
int n = (int)g_pop.items.size();
|
||||
bool hasBar = n > g_pop.visRows;
|
||||
int barW = std::max(3, (int)(4 * g_dpiScale));
|
||||
int rowW = rc.right - 2 * g_pop.pad - (hasBar ? barW + g_pop.pad : 0);
|
||||
int last = std::min(n, g_pop.scroll + g_pop.visRows);
|
||||
|
||||
int n = (int)g_pop.items.size();
|
||||
bool hasBar = n > g_pop.visRows;
|
||||
int barW = std::max(3, (int)(4 * g_dpiScale));
|
||||
int rowW = rc.right - 2 * g_pop.pad - (hasBar ? barW + g_pop.pad : 0);
|
||||
int reserve = g_pop.canDelete ? g_pop.rowH : 0;
|
||||
int last = std::min(n, g_pop.scroll + g_pop.visRows);
|
||||
for (int i = g_pop.scroll; i < last; ++i) {
|
||||
int vis = i - g_pop.scroll;
|
||||
Rect row(g_pop.pad, g_pop.pad + vis * g_pop.rowH, rowW, g_pop.rowH - 2);
|
||||
if (i == g_pop.hot) FillRound(g, T_CARD_HI, row, 7);
|
||||
RectF tb((REAL)row.X + 9, (REAL)row.Y, (REAL)row.Width - 12, (REAL)row.Height);
|
||||
RectF tb((REAL)row.X + 9, (REAL)row.Y, (REAL)(row.Width - 12 - reserve), (REAL)row.Height);
|
||||
DrawTextC(g, g_pop.items[i].c_str(), *g_gpUI,
|
||||
(i == g_pop.sel) ? T_ACCENT : T_TEXT,
|
||||
tb, StringAlignmentNear, StringAlignmentCenter);
|
||||
if (g_pop.canDelete && i == g_pop.hot) {
|
||||
Rect xr = PopupDeleteRect(rc, vis);
|
||||
if (i == g_pop.hotX) FillRound(g, T_CARD_LO, xr, 6);
|
||||
Color xc = (i == g_pop.hotX) ? T_DANGER : T_FAINT;
|
||||
Pen xpen(xc, 1.8f);
|
||||
int xpad = std::max(6, (int)(8 * g_dpiScale));
|
||||
g.DrawLine(&xpen, xr.X + xpad, xr.Y + xpad,
|
||||
xr.X + xr.Width - xpad, xr.Y + xr.Height - xpad);
|
||||
g.DrawLine(&xpen, xr.X + xr.Width - xpad, xr.Y + xpad,
|
||||
xr.X + xpad, xr.Y + xr.Height - xpad);
|
||||
}
|
||||
}
|
||||
if (hasBar) {
|
||||
int trackH = rc.bottom - 2 * g_pop.pad;
|
||||
@@ -785,6 +868,7 @@ void ShowSelectPopup(HWND owner, int ctrlId, const std::vector<std::wstring>& it
|
||||
g_pop.sel = sel;
|
||||
g_pop.owner = owner;
|
||||
g_pop.ctrlId = ctrlId;
|
||||
g_pop.canDelete = (ctrlId == ID_SEL_HISTORY);
|
||||
g_pop.visRows = visRows;
|
||||
g_pop.rowH = rowH;
|
||||
g_pop.pad = pad;
|
||||
|
||||
@@ -0,0 +1,520 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Win Dictation — Architecture & Engineering Review</title>
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
||||
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=JetBrains+Mono:wght@400;500;600;700&display=swap" rel="stylesheet">
|
||||
<style>
|
||||
:root{
|
||||
--bg:#0E1014; --card:#16191F; --card-hi:#1E222B; --card-lo:#12151B;
|
||||
--text:#ECEEF2; --dim:#8A909C; --faint:#5A606C;
|
||||
--accent:#6E8BFF; --accent-hi:#839CFF; --danger:#FF5C5C; --good:#46D39A; --warn:#E8B84B;
|
||||
--border:#262B36; --hair:rgba(255,255,255,.06);
|
||||
--mono:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
|
||||
--sans:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
|
||||
}
|
||||
*{box-sizing:border-box}
|
||||
html{scroll-behavior:smooth}
|
||||
body{margin:0; background:var(--bg); color:var(--text); font-family:var(--sans);
|
||||
font-size:16.5px; line-height:1.72; -webkit-font-smoothing:antialiased; letter-spacing:.1px}
|
||||
.wrap{max-width:960px; margin:0 auto; padding:0 6vw 140px}
|
||||
a{color:var(--accent-hi); text-decoration:none} a:hover{text-decoration:underline}
|
||||
|
||||
.hero{padding:88px 0 34px; border-bottom:1px solid var(--border); margin-bottom:50px}
|
||||
.eyebrow{font-family:var(--mono); font-size:12.5px; letter-spacing:.32em; text-transform:uppercase; color:var(--accent); margin:0 0 22px}
|
||||
h1{font-size:clamp(32px,5.6vw,52px); line-height:1.05; margin:0; font-weight:800; letter-spacing:-1.2px; max-width:840px}
|
||||
.sub{font-size:20px; color:var(--dim); max-width:720px; margin:20px 0 0; font-weight:400}
|
||||
.metarow{display:flex; flex-wrap:wrap; gap:10px; margin-top:30px}
|
||||
.chip{font-family:var(--mono); font-size:12.5px; color:var(--dim); background:var(--card); border:1px solid var(--border); border-radius:999px; padding:7px 15px}
|
||||
.chip b{color:var(--text); font-weight:600}
|
||||
|
||||
.toc{background:linear-gradient(180deg,var(--card),var(--card-lo)); border:1px solid var(--border); border-radius:18px; padding:30px 34px; margin-bottom:60px}
|
||||
.toc h4{margin:0 0 18px; font-family:var(--mono); font-size:12px; letter-spacing:.28em; text-transform:uppercase; color:var(--faint)}
|
||||
.toc ol{margin:0; padding:0; list-style:none; counter-reset:t; columns:2; column-gap:46px}
|
||||
.toc li{counter-increment:t; padding:7px 0; break-inside:avoid}
|
||||
.toc li a{color:var(--text); font-weight:500; font-size:15.5px}
|
||||
.toc li a::before{content:counter(t,decimal-leading-zero); font-family:var(--mono); color:var(--accent); font-size:12px; margin-right:13px; font-weight:600}
|
||||
|
||||
section{margin:0 0 72px; scroll-margin-top:30px}
|
||||
.sec-h{display:flex; align-items:baseline; gap:16px; margin:0 0 10px}
|
||||
.sec-n{font-family:var(--mono); font-size:14px; color:var(--accent); font-weight:600; flex:none}
|
||||
h2{font-size:29px; font-weight:700; margin:0; letter-spacing:-.5px}
|
||||
h3{font-size:19px; font-weight:650; margin:38px 0 12px; letter-spacing:-.2px}
|
||||
.lead{color:var(--dim); font-size:18px; margin:0 0 26px; max-width:740px}
|
||||
p{margin:0 0 17px} .muted{color:var(--dim)} strong{color:#fff; font-weight:650}
|
||||
ul,ol{margin:0 0 18px; padding-left:22px} li{margin:9px 0}
|
||||
|
||||
code{font-family:var(--mono); font-size:14px; background:var(--card-hi); color:#cfe0ff; padding:2px 7px; border-radius:6px; border:1px solid var(--border)}
|
||||
.path{font-family:var(--mono); font-size:13.5px; color:var(--good)}
|
||||
pre{background:var(--card-lo); border:1px solid var(--border); border-radius:13px; padding:20px 22px; overflow-x:auto; margin:20px 0;
|
||||
font-family:var(--mono); font-size:13.5px; line-height:1.7; color:#c8d2e0}
|
||||
pre .c{color:var(--faint)} pre .k{color:#c98bff} pre .s{color:var(--good)} pre .n{color:var(--accent-hi)} pre .f{color:#ffd479}
|
||||
|
||||
/* verdict box */
|
||||
.verdict{background:linear-gradient(135deg,rgba(110,139,255,.12),rgba(70,211,154,.06)); border:1px solid var(--border);
|
||||
border-radius:18px; padding:30px 34px; margin:6px 0 10px; position:relative; overflow:hidden}
|
||||
.verdict::before{content:""; position:absolute; left:0; top:0; bottom:0; width:4px; background:linear-gradient(180deg,var(--accent),var(--good))}
|
||||
.verdict .vh{font-family:var(--mono); font-size:11.5px; letter-spacing:.2em; text-transform:uppercase; color:var(--accent); margin:0 0 12px}
|
||||
.verdict p{font-size:18.5px; line-height:1.66; margin:0 0 14px; color:var(--text)}
|
||||
.verdict p:last-child{margin:0}
|
||||
.verdict .big{font-size:22px; font-weight:700; letter-spacing:-.3px}
|
||||
|
||||
/* pipeline */
|
||||
.pipe{display:flex; flex-wrap:wrap; align-items:stretch; gap:0; margin:26px 0; border:1px solid var(--border); border-radius:14px; overflow:hidden; background:var(--card-lo)}
|
||||
.stage{flex:1 1 120px; min-width:120px; padding:18px 16px; border-right:1px solid var(--border); position:relative}
|
||||
.stage:last-child{border-right:0}
|
||||
.stage .si{font-family:var(--mono); font-size:11px; color:var(--faint); margin:0 0 8px}
|
||||
.stage .sn{font-weight:650; font-size:14.5px; margin:0 0 4px; color:var(--text)}
|
||||
.stage .sd{font-size:12.5px; color:var(--dim); line-height:1.5; margin:0}
|
||||
.stage.hot{background:linear-gradient(180deg,rgba(110,139,255,.1),transparent)}
|
||||
.stage.work{background:linear-gradient(180deg,rgba(70,211,154,.1),transparent)}
|
||||
|
||||
.tbl{width:100%; border-collapse:collapse; margin:20px 0; font-size:14.5px; border-radius:12px; overflow:hidden; border:1px solid var(--border)}
|
||||
.tbl th{text-align:left; font-family:var(--mono); font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--dim); padding:12px 15px; background:var(--card-lo); border-bottom:1px solid var(--border); font-weight:600}
|
||||
.tbl td{padding:12px 15px; border-bottom:1px solid var(--border); vertical-align:top}
|
||||
.tbl tr:last-child td{border-bottom:0}
|
||||
.tbl td code{font-size:13px}
|
||||
.tbl .r{color:var(--dim); font-size:13.5px}
|
||||
|
||||
.note{border:1px solid var(--border); border-left:3px solid var(--accent); background:linear-gradient(90deg,rgba(110,139,255,.08),transparent 60%); border-radius:12px; padding:17px 20px; margin:22px 0}
|
||||
.note.warn{border-left-color:var(--warn); background:linear-gradient(90deg,rgba(232,184,75,.09),transparent 60%)}
|
||||
.note.bad{border-left-color:var(--danger); background:linear-gradient(90deg,rgba(255,92,92,.08),transparent 60%)}
|
||||
.note.good{border-left-color:var(--good); background:linear-gradient(90deg,rgba(70,211,154,.08),transparent 60%)}
|
||||
.note .nt{font-family:var(--mono); font-size:11.5px; letter-spacing:.18em; text-transform:uppercase; color:var(--dim); margin:0 0 6px}
|
||||
.note p:last-child{margin:0}
|
||||
|
||||
/* assessment cards */
|
||||
.assess{display:grid; gap:14px; margin:22px 0}
|
||||
.ac{border:1px solid var(--border); border-radius:13px; padding:18px 20px; background:var(--card)}
|
||||
.ac .ah{display:flex; align-items:center; gap:11px; margin:0 0 7px}
|
||||
.ac .dot{width:9px;height:9px;border-radius:50%; flex:none}
|
||||
.ac.pos .dot{background:var(--good)} .ac.neg .dot{background:var(--danger)} .ac.neu .dot{background:var(--warn)}
|
||||
.ac h4{margin:0; font-size:16.5px; font-weight:650}
|
||||
.ac p{margin:0; color:var(--dim); font-size:14.5px; line-height:1.62}
|
||||
.ac .ref{font-family:var(--mono); font-size:12px; color:var(--faint); margin-top:7px}
|
||||
|
||||
/* scorecard */
|
||||
.score{background:var(--card); border:1px solid var(--border); border-radius:16px; padding:28px 30px; margin:24px 0}
|
||||
.srow{display:grid; grid-template-columns:200px 1fr 50px; align-items:center; gap:18px; padding:11px 0; border-bottom:1px solid var(--border)}
|
||||
.srow:last-child{border-bottom:0}
|
||||
.srow .sl{font-size:14.5px; font-weight:500}
|
||||
.srow .sb{height:9px; background:var(--card-hi); border-radius:99px; overflow:hidden}
|
||||
.srow .sf{height:100%; border-radius:99px; background:linear-gradient(90deg,var(--accent),var(--accent-hi))}
|
||||
.srow .sf.hi{background:linear-gradient(90deg,#46D39A,#6ee0b0)}
|
||||
.srow .sf.lo{background:linear-gradient(90deg,#E8B84B,#f0cd77)}
|
||||
.srow .sf.vlo{background:linear-gradient(90deg,#FF5C5C,#ff8585)}
|
||||
.srow .sv{font-family:var(--mono); font-size:14px; font-weight:600; text-align:right; color:var(--text)}
|
||||
.overall{display:flex; align-items:baseline; gap:16px; margin-top:22px; padding-top:22px; border-top:1px solid var(--border)}
|
||||
.overall .num{font-size:46px; font-weight:800; letter-spacing:-2px; color:var(--accent-hi); font-family:var(--mono)}
|
||||
.overall .ot{color:var(--dim); font-size:15px}
|
||||
|
||||
/* recommendations */
|
||||
.rec{counter-reset:r; margin:22px 0; padding:0; list-style:none}
|
||||
.rec li{counter-increment:r; position:relative; padding:16px 18px 16px 60px; margin:0 0 12px; background:var(--card); border:1px solid var(--border); border-radius:12px}
|
||||
.rec li::before{content:counter(r); position:absolute; left:16px; top:16px; width:30px;height:30px;border-radius:9px; background:var(--card-hi); color:var(--accent); font-family:var(--mono); font-weight:700; display:flex; align-items:center; justify-content:center; font-size:14px}
|
||||
.rec h4{margin:0 0 4px; font-size:16px; font-weight:650}
|
||||
.rec p{margin:0; color:var(--dim); font-size:14.5px}
|
||||
.pri{font-family:var(--mono); font-size:10.5px; letter-spacing:.1em; text-transform:uppercase; padding:2px 8px; border-radius:5px; margin-left:9px; vertical-align:middle}
|
||||
.pri.hi{background:rgba(255,92,92,.16); color:var(--danger)}
|
||||
.pri.md{background:rgba(232,184,75,.16); color:var(--warn)}
|
||||
.pri.lo{background:rgba(138,144,156,.16); color:var(--dim)}
|
||||
|
||||
.stackgrid{display:grid; grid-template-columns:repeat(2,1fr); gap:14px; margin:22px 0}
|
||||
.scell{background:var(--card); border:1px solid var(--border); border-radius:12px; padding:16px 18px}
|
||||
.scell .sk{font-family:var(--mono); font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--faint); margin:0 0 6px}
|
||||
.scell .sv{font-size:15px; color:var(--text); font-weight:500}
|
||||
.scell .sv span{color:var(--dim); font-weight:400; font-size:13.5px}
|
||||
|
||||
.footer{border-top:1px solid var(--border); margin-top:80px; padding-top:30px; color:var(--faint); font-size:13.5px; font-family:var(--mono)}
|
||||
.footer b{color:var(--dim); font-weight:500}
|
||||
|
||||
@media(max-width:680px){
|
||||
.toc ol,.stackgrid{columns:1; grid-template-columns:1fr}
|
||||
.srow{grid-template-columns:1fr; gap:6px}
|
||||
.srow .sv{text-align:left}
|
||||
.pipe .stage{flex-basis:100%; border-right:0; border-bottom:1px solid var(--border)}
|
||||
body{font-size:16px}
|
||||
}
|
||||
</style>
|
||||
<style>
|
||||
.ha-img-placeholder{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:6px;background:#f4f4f5;border:1px dashed #d4d4d8;border-radius:8px;color:#71717a;font-size:12px;font-family:system-ui,sans-serif;min-height:80px;padding:16px;box-sizing:border-box;animation:ha-img-pulse 1.5s ease-in-out infinite}
|
||||
.ha-img-placeholder.ha-failed{animation:none;opacity:.7}
|
||||
@keyframes ha-img-pulse{0%,100%{opacity:1}50%{opacity:.5}}
|
||||
@media(prefers-color-scheme:dark){.ha-img-placeholder{background:#27272a;border-color:#3f3f46;color:#a1a1aa}}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="wrap">
|
||||
|
||||
<header class="hero">
|
||||
<p class="eyebrow">Architecture · Code Analysis · Engineering Verdict</p>
|
||||
<h1>Win Dictation: under the hood</h1>
|
||||
<p class="sub">A guided walk through a native Win32 C++ speech-to-text app — how it's built, why it's built that way, and an honest assessment of the code for anyone picking it up for the first time.</p>
|
||||
<div class="metarow">
|
||||
<span class="chip"><b>~3,400</b> lines C++ (app)</span>
|
||||
<span class="chip"><b>Win32</b> + GDI+ + SDL2 + whisper.cpp</span>
|
||||
<span class="chip"><b>Single .exe</b>, no runtime deps</span>
|
||||
<span class="chip"><b>Target</b> 2-core i5, CPU-only</span>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<nav class="toc">
|
||||
<h4>Contents</h4>
|
||||
<ol>
|
||||
<li><a href="#tldr">The verdict, up front</a></li>
|
||||
<li><a href="#stack">Stack at a glance</a></li>
|
||||
<li><a href="#arch">Architecture & data flow</a></li>
|
||||
<li><a href="#decision">The defining decision</a></li>
|
||||
<li><a href="#threads">Threading model</a></li>
|
||||
<li><a href="#map">Source map, file by file</a></li>
|
||||
<li><a href="#ui">Deep dive: the UI engine</a></li>
|
||||
<li><a href="#timing">Deep dive: the progress estimator</a></li>
|
||||
<li><a href="#transcriber">Deep dive: the transcriber</a></li>
|
||||
<li><a href="#persistence">History, downloads & persistence</a></li>
|
||||
<li><a href="#anatomy">Anatomy of one dictation</a></li>
|
||||
<li><a href="#strengths">What's done well</a></li>
|
||||
<li><a href="#weaknesses">What holds it back</a></li>
|
||||
<li><a href="#recs">Recommendations</a></li>
|
||||
<li><a href="#scorecard">Scorecard & final word</a></li>
|
||||
</ol>
|
||||
</nav>
|
||||
|
||||
<!-- 1 -->
|
||||
<section id="tldr">
|
||||
<div class="sec-h"><span class="sec-n">01</span><h2>The verdict, up front</h2></div>
|
||||
<div class="verdict">
|
||||
<p class="vh">Bottom line</p>
|
||||
<p class="big">A genuinely strong, characterful single-purpose tool that punches well above hobby grade.</p>
|
||||
<p>The hard engineering — the architecture choice, the self-calibrating progress estimator, the seam-free single-surface renderer — is thoughtful and well-executed. The app does exactly one thing and does it well on hardware most tools would choke on.</p>
|
||||
<p>What holds it back is <strong>organizational debt, not algorithmic weakness</strong>: a 1,500-line <code>main.cpp</code>, a layer of vestigial child-window controls left over from an earlier design, and a pile of stale documentation that describes a GPU-streaming app this no longer is. None of it breaks the running product — but all of it raises the cost of the next person walking in.</p>
|
||||
</div>
|
||||
<p class="muted">The sections below back up every part of that judgement with specifics from the source.</p>
|
||||
</section>
|
||||
|
||||
<!-- 2 -->
|
||||
<section id="stack">
|
||||
<div class="sec-h"><span class="sec-n">02</span><h2>Stack at a glance</h2></div>
|
||||
<p class="lead">Deliberately lean. No UI framework, no managed runtime, no garbage collector — just the OS and three libraries.</p>
|
||||
<div class="stackgrid">
|
||||
<div class="scell"><p class="sk">Language</p><p class="sv">C++ <span>(MSVC, Release /O2 /GL /LTCG, AVX2/FMA/F16C)</span></p></div>
|
||||
<div class="scell"><p class="sk">UI</p><p class="sv">Raw Win32 + GDI+ <span>immediate-mode painted surface</span></p></div>
|
||||
<div class="scell"><p class="sk">Audio capture</p><p class="sv">SDL2 <span>16 kHz mono, F32</span></p></div>
|
||||
<div class="scell"><p class="sk">Inference</p><p class="sv">whisper.cpp <span>whisper_full, CPU backend</span></p></div>
|
||||
<div class="scell"><p class="sk">Networking</p><p class="sv">WinHTTP <span>model downloads, system proxy aware</span></p></div>
|
||||
<div class="scell"><p class="sk">Persistence</p><p class="sv">Plain INI + UTF-8 text files <span>no database</span></p></div>
|
||||
<div class="scell"><p class="sk">Build</p><p class="sv">CMake <span>+ a PowerShell convenience script</span></p></div>
|
||||
<div class="scell"><p class="sk">Footprint</p><p class="sv">One .exe + a few DLLs + model <span>tiny RAM, no install</span></p></div>
|
||||
</div>
|
||||
<p>The whole product is native code with no framework abstraction between it and the Win32 API. That's the source of both its biggest strength (a tiny, fast, dependency-light binary) and its biggest cost (everything is hand-rolled, including the widgets).</p>
|
||||
</section>
|
||||
|
||||
<!-- 3 -->
|
||||
<section id="arch">
|
||||
<div class="sec-h"><span class="sec-n">03</span><h2>Architecture & data flow</h2></div>
|
||||
<p class="lead">A linear pipeline with a single inference step. Audio in, text out, no streaming loop.</p>
|
||||
<div class="pipe">
|
||||
<div class="stage hot"><p class="si">trigger</p><p class="sn">Hotkey</p><p class="sd">Global <code>RegisterHotKey</code>. Captures the previously focused window.</p></div>
|
||||
<div class="stage"><p class="si">capture</p><p class="sn">SDL2 mic</p><p class="sd">16 kHz mono into an in-memory buffer. Near-zero CPU.</p></div>
|
||||
<div class="stage"><p class="si">buffer</p><p class="sn">PCM in RAM</p><p class="sd">Accumulated under a mutex; RMS energy tracked for the meter.</p></div>
|
||||
<div class="stage work"><p class="si">inference</p><p class="sn">whisper_full</p><p class="sd">One pass on a worker thread when you stop. Trim → transcribe → clean.</p></div>
|
||||
<div class="stage"><p class="si">deliver</p><p class="sn">Insert + paste</p><p class="sd">Text to caret, to clipboard, into the prior window.</p></div>
|
||||
</div>
|
||||
<p>Two side channels run alongside the main pipeline: a <strong>progress estimator</strong> that predicts and smooths the transcription countdown, and a <strong>timing model</strong> that learns this machine's speed and feeds back into the next prediction. Results return to the UI thread exclusively via <code>PostMessage</code>; shared flags are <code>std::atomic</code>.</p>
|
||||
<div class="note">
|
||||
<p class="nt">Mental model</p>
|
||||
<p>Think of it as a tape recorder with a transcription button, not a live captioner. The architecture has no per-frame transcription loop at all — which, on a 2-core CPU, is the whole point.</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- 4 -->
|
||||
<section id="decision">
|
||||
<div class="sec-h"><span class="sec-n">04</span><h2>The defining decision</h2></div>
|
||||
<p class="lead">The single most important thing to understand: this app was rebuilt from a live-streaming design into a push-to-talk batch design — and that was the right call.</p>
|
||||
<p>An earlier version used the classic whisper.cpp streaming approach: a rolling 5–6 second window re-transcribed every ~0.4 seconds. That technique <em>assumes</em> spare cores. On the target machine — an Intel i5-7th-gen with two physical cores — the buffer backlogged, audio was re-transcribed, and the UI starved. The symptom looked like "the model is slow"; the real cause was an architecture that needed hardware the target didn't have.</p>
|
||||
<p>The fix wasn't a faster model. It was removing the streaming loop entirely:</p>
|
||||
<table class="tbl">
|
||||
<tr><th>Aspect</th><th>Old: streaming window</th><th>New: push-to-talk batch</th></tr>
|
||||
<tr><td>CPU while speaking</td><td class="r">Pinned — constant re-inference</td><td>Near idle — just buffering</td></tr>
|
||||
<tr><td>Inference calls</td><td class="r">Many per second</td><td>Exactly one, on stop</td></tr>
|
||||
<tr><td>Accuracy</td><td class="r">Lower — partial context windows</td><td>Higher — full clip, full context</td></tr>
|
||||
<tr><td>UI responsiveness</td><td class="r">Starved under load</td><td>Free until the single pass</td></tr>
|
||||
<tr><td>Predictability</td><td class="r">Variable lag</td><td>Predictable few-second wait</td></tr>
|
||||
</table>
|
||||
<p>This is textbook root-cause engineering: the team correctly diagnosed that the bottleneck was the <em>shape</em> of the work, not its size, and changed the shape. Everything else in the codebase — the batch worker, the progress estimator, the physical-core thread default — follows from this one decision.</p>
|
||||
</section>
|
||||
|
||||
<!-- 5 -->
|
||||
<section id="threads">
|
||||
<div class="sec-h"><span class="sec-n">05</span><h2>Threading model</h2></div>
|
||||
<p class="lead">Four threads, one rule: only the UI thread touches the UI. Everything else reports back by message.</p>
|
||||
<table class="tbl">
|
||||
<tr><th>Thread</th><th>Lifetime</th><th>Job</th></tr>
|
||||
<tr><td><b>UI thread</b></td><td class="r">Whole app</td><td>Message loop, all painting, the 16 ms animation timer and 50 ms update timer.</td></tr>
|
||||
<tr><td><b>Model preload</b></td><td class="r">Detached, once</td><td>Loads the Whisper context off the UI thread at startup so the window appears instantly.</td></tr>
|
||||
<tr><td><b>Transcribe worker</b></td><td class="r">Per clip</td><td>Runs <code>whisper_full</code>; posts <code>WM_APP_PROGRESS</code> during and <code>WM_APP_RESULT</code> when done.</td></tr>
|
||||
<tr><td><b>Downloader</b></td><td class="r">Per download</td><td>WinHTTP fetch on its own thread; posts <code>WM_APP_DLPROGRESS</code>.</td></tr>
|
||||
</table>
|
||||
<p>Cross-thread state is handled with discipline rather than locks where possible: <code>std::atomic</code> booleans (<code>m_recording</code>, <code>m_busy</code>, <code>m_abort</code>, <code>g_modelLoaded</code>, <code>g_modelOk</code>) gate state transitions, and the only shared buffer — the captured PCM — is protected by a dedicated mutex. The audio callback (driven by SDL's own thread) appends under that mutex; <code>stop_and_transcribe</code> swaps the buffer out under the same lock before handing it to the worker. That swap-not-copy handoff is a nice touch.</p>
|
||||
<pre><span class="c">// transcriber.cpp — physical cores, not logical, by design</span>
|
||||
<span class="k">int</span> Transcriber::<span class="f">default_threads</span>() {
|
||||
<span class="k">unsigned</span> hc = std::thread::<span class="f">hardware_concurrency</span>();
|
||||
<span class="k">if</span> (hc <= 2) <span class="k">return</span> (<span class="k">int</span>)std::<span class="f">max</span>(1u, hc);
|
||||
<span class="k">return</span> (<span class="k">int</span>)(hc / 2); <span class="c">// 4 logical → 2 worker threads</span>
|
||||
}</pre>
|
||||
<p>Defaulting to physical cores rather than <code>hardware_concurrency()</code> is the correct choice for compute-bound SIMD inference — hyperthreads contend for the same execution units and would only add scheduling overhead.</p>
|
||||
</section>
|
||||
|
||||
<!-- 6 -->
|
||||
<section id="map">
|
||||
<div class="sec-h"><span class="sec-n">06</span><h2>Source map, file by file</h2></div>
|
||||
<p class="lead">The app is small and mostly header-only outside the two big translation units. Here's where everything lives.</p>
|
||||
<table class="tbl">
|
||||
<tr><th>File</th><th>Role</th><th>Notes</th></tr>
|
||||
<tr><td><code>main.cpp</code></td><td>Window, painting, interaction, settings view, clipboard, paste, model selection, popups</td><td class="r">~1,500 lines. The monolith — see §13.</td></tr>
|
||||
<tr><td><code>transcriber.{h,cpp}</code></td><td>SDL capture, Whisper preload/inference, progress & abort callbacks</td><td class="r">Clean, well-scoped class. The model layer.</td></tr>
|
||||
<tr><td><code>timing.h</code></td><td>Per-model least-squares timing model + live progress estimator + INI persistence</td><td class="r">The standout module. See §08.</td></tr>
|
||||
<tr><td><code>history.h</code></td><td>Session text files, UTF-8 r/w with BOM, index, pruning to 100</td><td class="r">Self-contained, header-only.</td></tr>
|
||||
<tr><td><code>downloader.h</code></td><td>WinHTTP model downloader on a background thread</td><td class="r">.part + atomic rename, cancel, proxy-aware.</td></tr>
|
||||
<tr><td><code>stats.h</code></td><td>Lifetime usage totals + derived figures (wpm, real-time factor, time saved)</td><td class="r">INI-backed, header-only.</td></tr>
|
||||
<tr><td><code>settings.h</code></td><td>App settings read/write via <code>GetPrivateProfile*</code></td><td class="r">Simple and transparent.</td></tr>
|
||||
<tr><td><code>text_util.h</code> · <code>logging.h</code></td><td>Transcript concatenation; timestamped file log</td><td class="r">Tiny helpers.</td></tr>
|
||||
<tr><td><code>tests/test_core.cpp</code></td><td>Unit checks: append logic, bad-model handling, real-WAV transcription, progress monotonicity</td><td class="r">Modest but meaningful. Built as <code>test-core</code>.</td></tr>
|
||||
</table>
|
||||
<p>The decision to make most subsystems <strong>header-only and independent</strong> (<code>timing.h</code>, <code>stats.h</code>, <code>history.h</code>, <code>downloader.h</code>, <code>settings.h</code>) is a good one for a project this size: each is cohesive, individually readable, and free of cross-dependencies. The contrast with <code>main.cpp</code> — which absorbs everything else — is stark.</p>
|
||||
</section>
|
||||
|
||||
<!-- 7 -->
|
||||
<section id="ui">
|
||||
<div class="sec-h"><span class="sec-n">07</span><h2>Deep dive: the single-surface UI engine</h2></div>
|
||||
<p class="lead">There are no buttons. Everything you see is painted onto one double-buffered surface — and that's a deliberate fix, not a shortcut.</p>
|
||||
<p>The previous UI composited around nine separate themed child windows (buttons, statics, an edit). That produced thin hairline seams around every control — the hard-edged holes <code>WS_CLIPCHILDREN</code> punches per child, plus the edit's themed border. Rather than chase pixel borders, the rebuild eliminated the cause: <strong>collapse the controls into one painted region.</strong></p>
|
||||
<p>The model is a small immediate-mode system:</p>
|
||||
<ul>
|
||||
<li>A flat <code>Widget g_w[]</code> array — each entry is a <em>kind</em>, a rectangle, and <code>hover/pressed/anim</code> state. No HWNDs.</li>
|
||||
<li><code>LayoutWidgets()</code> positions them; <code>PaintSurface()</code> draws each into an off-screen DC with GDI+, then blits once (no flicker).</li>
|
||||
<li><code>HitTest()</code> maps a click point to a widget; <code>OnClick()</code> dispatches the action.</li>
|
||||
<li>An animation clock eases each widget's <code>anim</code> toward a target (hover 0.6, active 1.0) on a 16 ms timer that <em>stops itself</em> when nothing is moving — no idle CPU burn.</li>
|
||||
</ul>
|
||||
<p>Two "views" — Main and Settings — render onto the same surface, toggled by <code>SwitchView()</code>. Dropdowns (mic, history) are the one exception: they're real top-level <code>WS_POPUP</code> windows, because a surface-painted dropdown would render <em>behind</em> the transcript edit (a child HWND always paints above its parent's surface). That's a correct, well-reasoned exception.</p>
|
||||
<div class="note good">
|
||||
<p class="nt">A sign of maturity</p>
|
||||
<p>The popup code carries a comment never to open a <code>MessageBox</code> from inside it — because <code>WA_INACTIVE</code> self-destroys the popup mid-handler, causing a use-after-free. Recognising that class of Win32 lifetime bug, and the GDI+ "<code>GetHDC</code> locks the Graphics object" trap documented elsewhere, shows real depth.</p>
|
||||
</div>
|
||||
<p>The one real child window that survives is the transcript <code>EDIT</code> — kept because a hand-rolled text editor with selection, scrolling, IME and undo is genuinely not worth rebuilding. Pragmatic.</p>
|
||||
<h3>The cost of this approach</h3>
|
||||
<p>Custom-painted controls are invisible to screen readers and UI Automation, and the app explicitly hides focus rectangles. The transcript box is accessible; the buttons are not. For a personal productivity tool this is a defensible trade, but it's the kind of thing worth stating out loud.</p>
|
||||
</section>
|
||||
|
||||
<!-- 8 -->
|
||||
<section id="timing">
|
||||
<div class="sec-h"><span class="sec-n">08</span><h2>Deep dive: the progress estimator</h2></div>
|
||||
<p class="lead">The crown jewel. Most apps fake a progress bar; this one runs a small statistical model that learns your machine.</p>
|
||||
<p>Whisper only reports coarse progress (per 30-second chunk), so a naive bar jumps — 0, 34, 72, 100 — and a naive "time left" computed from stale percentages actually counts <em>up</em>. <code>timing.h</code> solves both. It has two parts.</p>
|
||||
<h3>1 — A learned timing model</h3>
|
||||
<p>Processing time is modelled as a linear function of audio length, <code>proc = a + b·audio</code>, fitted by <strong>decayed online least-squares</strong>. Each completed transcription feeds back a real sample; older samples decay (factor 0.97) so the model tracks the current machine state. Defaults are seeded per model family (tiny/base/small) so even the very first clip has a sane estimate, and the accumulators persist per-model in the INI.</p>
|
||||
<pre><span class="k">void</span> <span class="f">add_sample</span>(<span class="k">double</span> audio_sec, <span class="k">double</span> proc_sec) {
|
||||
<span class="k">const double</span> decay = <span class="n">0.97</span>;
|
||||
n*=decay; sx*=decay; sy*=decay; sxx*=decay; sxy*=decay;
|
||||
n+=<span class="n">1</span>; sx+=audio_sec; sy+=proc_sec;
|
||||
sxx+=audio_sec*audio_sec; sxy+=audio_sec*proc_sec;
|
||||
<span class="f">recompute</span>(); <span class="c">// closed-form slope/intercept</span>
|
||||
}</pre>
|
||||
<h3>2 — A live estimator that only counts down</h3>
|
||||
<p>On stop, <code>begin(predict)</code> seeds a predicted total. As Whisper reports chunk progress, <code>on_whisper()</code> folds it in as a <em>measurement</em> via an EMA (α = 0.5) — nudging the estimate without the jumpy jumps. Meanwhile <code>tick()</code> advances a displayed "remaining" value that is <strong>strictly monotonic downward</strong>, with a clamped catch-up rate so it can speed up but never lurch backward, easing to 95% and snapping to 100% only on the real result.</p>
|
||||
<pre><span class="k">void</span> <span class="f">tick</span>(<span class="k">double</span> dt, <span class="k">float</span>& out_frac, <span class="k">float</span>& out_remaining) {
|
||||
t += dt; disp_rem -= dt;
|
||||
<span class="k">double</span> raw_rem = std::<span class="f">max</span>(<span class="n">0.0</span>, T_hat - t);
|
||||
<span class="k">double</span> err = raw_rem - disp_rem;
|
||||
<span class="k">if</span> (err < <span class="n">0</span>) disp_rem += std::<span class="f">max</span>(err, -maxCatchUp*dt); <span class="c">// catch up, never jump back</span>
|
||||
<span class="k">double</span> frac = t/(t+disp_rem);
|
||||
<span class="k">if</span> (frac > <span class="n">0.95</span>) frac = <span class="n">0.95</span>; <span class="c">// park at 95% until done</span>
|
||||
out_frac = (<span class="k">float</span>)frac; out_remaining = (<span class="k">float</span>)disp_rem;
|
||||
}</pre>
|
||||
<p>This is more thought than most commercial apps put into a progress bar, and the test suite even asserts the progress is non-decreasing. It's the clearest signal in the codebase that someone cared about the <em>feel</em> of the product, not just its function.</p>
|
||||
</section>
|
||||
|
||||
<!-- 9 -->
|
||||
<section id="transcriber">
|
||||
<div class="sec-h"><span class="sec-n">09</span><h2>Deep dive: the transcriber</h2></div>
|
||||
<p class="lead">The cleanest class in the project — a tidy boundary between the OS/model and the rest of the app.</p>
|
||||
<p><code>Transcriber</code> owns the Whisper context and the SDL device, and exposes a small, sensible surface: <code>preload</code>, <code>reload</code>, <code>start_recording</code>, <code>stop_and_transcribe</code>, <code>cancel</code>, plus state queries and two callbacks (<code>result</code>, <code>progress</code>). Inference parameters are configured sensibly for dictation — greedy sampling, no timestamps, no prior context, blank/non-speech suppression, temperature 0 — and an <code>abort_callback</code> lets a long transcription be cancelled mid-flight.</p>
|
||||
<p>Two small details worth calling out:</p>
|
||||
<ul>
|
||||
<li><strong>Silence trimming.</strong> Before inference, leading/trailing silence is trimmed from the clip — cheaper and more accurate than transcribing dead air. (Note: this trims the <em>buffer</em>; it does not auto-stop recording — see the doc-drift note in §13.)</li>
|
||||
<li><strong>Output cleanup.</strong> <code>clean_text()</code> strips Whisper's <code>[BLANK_AUDIO]</code> / <code>[NOISE]</code> artifacts and trims whitespace, so the user never sees model noise.</li>
|
||||
</ul>
|
||||
<p>The class is also defensively coded: a missing model file makes <code>preload</code> return false cleanly (the test suite verifies this), <code>start_recording</code> bails if a device won't open, and clips under ~0.3 s short-circuit to an empty result rather than invoking the model.</p>
|
||||
</section>
|
||||
|
||||
<!-- 10 -->
|
||||
<section id="persistence">
|
||||
<div class="sec-h"><span class="sec-n">10</span><h2>History, downloads & persistence</h2></div>
|
||||
<p class="lead">No database, no registry sprawl — everything is a file next to the executable. Transparent and portable.</p>
|
||||
<h3>Session history</h3>
|
||||
<p>Each session is one UTF-8 text file in <span class="path">history\</span>, named by timestamp. The clever bit is <em>live</em> archiving: the first clip of a session creates the file; subsequent clips rewrite the <em>same</em> file with the full text. So a session is always one tidy, crash-safe file — not a scatter of fragments — and it appears in the History popup immediately. A <code>g_sessionPath</code> global plus a <code>FinalizeSession()</code> helper handle the edge cases (manual edits, typed-only sessions, loading an old entry without resurrecting it). The list is capped at 100 with automatic pruning.</p>
|
||||
<div class="note">
|
||||
<p class="nt">A real bug was fixed here</p>
|
||||
<p>An earlier version stamped every fresh transcription as "loaded from history," so the duplicate-guard silently skipped archiving — sessions never reached disk while the UI claimed "Saved." The fix (live archiving + a corrected guard) is documented and shows the team chasing subtle state bugs to ground.</p>
|
||||
</div>
|
||||
<h3>Model downloads</h3>
|
||||
<p>The downloader is more robust than it needed to be, in a good way: it streams to a <code>.part</code> file then does an atomic rename on success (no half-files), honors the system proxy, follows the Hugging Face → CDN redirects, supports cancellation, allows only one download at a time, and sweeps up stray <code>.part</code> files at startup.</p>
|
||||
<h3>Settings, timing & stats</h3>
|
||||
<p>All three live in a single <span class="path">win-dictation.ini</span> under different sections — app settings, per-model timing accumulators, and lifetime stats. Using the OS's own <code>GetPrivateProfile*</code> API means zero parsing code and a file a user can read and edit by hand. For an app of this scope, that's exactly the right level of machinery.</p>
|
||||
</section>
|
||||
|
||||
<!-- 11 -->
|
||||
<section id="anatomy">
|
||||
<div class="sec-h"><span class="sec-n">11</span><h2>Anatomy of one dictation</h2></div>
|
||||
<p class="lead">Following a single clip end-to-end ties the whole system together.</p>
|
||||
<ol>
|
||||
<li><code>WM_HOTKEY</code> fires → the app records <code>g_prevForeground</code> and the current selection (<code>EM_GETSEL</code>) so it knows where to paste and where to insert.</li>
|
||||
<li><code>g_tx.start_recording()</code> opens the SDL device; the audio callback appends PCM under the capture mutex and updates the RMS energy meter.</li>
|
||||
<li>The 50 ms UI timer animates the level meter and ticks the on-screen recording clock.</li>
|
||||
<li>Second <code>WM_HOTKEY</code> → <code>g_est.begin(g_timing.predict(len))</code> seeds the progress estimate; <code>g_tx.stop_and_transcribe()</code> swaps the buffer to a worker thread.</li>
|
||||
<li>The worker runs <code>run_inference()</code> → <code>whisper_full</code>. Whisper's progress callback posts <code>WM_APP_PROGRESS</code>; the estimator's <code>on_whisper()</code> EMA-folds it in.</li>
|
||||
<li>On completion the worker posts <code>WM_APP_RESULT</code>.</li>
|
||||
<li>The UI thread then, in order: snaps progress to 100%, records a real timing sample (<code>add_sample</code> + <code>SaveTiming</code>), updates lifetime stats, inserts the text at the saved caret with smart spacing via <code>EM_REPLACESEL</code> (undoable), archives the session, copies to the clipboard, and pastes into <code>g_prevForeground</code>.</li>
|
||||
</ol>
|
||||
<p>Every piece of the architecture shows up in that one trip: the atomics, the message hand-back, the estimator, the learned timing feedback loop, the editable transcript, the live history. It's a coherent design.</p>
|
||||
</section>
|
||||
|
||||
<!-- 12 -->
|
||||
<section id="strengths">
|
||||
<div class="sec-h"><span class="sec-n">12</span><h2>What's done well</h2></div>
|
||||
<div class="assess">
|
||||
<div class="ac pos"><div class="ah"><span class="dot"></span><h4>The architecture fits the hardware</h4></div><p>Push-to-talk batch over streaming is the correct response to a 2-core CPU, reached by genuine root-cause analysis rather than knob-twiddling.</p></div>
|
||||
<div class="ac pos"><div class="ah"><span class="dot"></span><h4>The progress estimator is exceptional</h4></div><p>Decayed online least-squares + EMA fusion + a strictly monotonic countdown is far beyond what the task demanded — and it shows in the feel.</p></div>
|
||||
<div class="ac pos"><div class="ah"><span class="dot"></span><h4>Seam-free UI by elimination, not patching</h4></div><p>Collapsing nine child windows into one painted, double-buffered, DPI-aware, self-throttling surface removed the problem at its source.</p></div>
|
||||
<div class="ac pos"><div class="ah"><span class="dot"></span><h4>Clean module boundaries (outside main)</h4></div><p>Header-only, dependency-free subsystems (timing, history, downloader, stats, settings) are each individually readable and testable.</p></div>
|
||||
<div class="ac pos"><div class="ah"><span class="dot"></span><h4>Robustness in the right places</h4></div><p>Atomic rename downloads, crash-safe live history, graceful missing-model handling, cancellable inference, single-instance mutex, model preload off the UI thread.</p></div>
|
||||
<div class="ac pos"><div class="ah"><span class="dot"></span><h4>Real product thoughtfulness</h4></div><p>Smart insertion spacing, undoable edits, auto-paste into the prior window, auto-hide, learned timing, friendly stats. These are details a careful builder adds.</p></div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- 13 -->
|
||||
<section id="weaknesses">
|
||||
<div class="sec-h"><span class="sec-n">13</span><h2>What holds it back</h2></div>
|
||||
<p class="lead">All fixable, and none of it affects the running app. But it's exactly what a newcomer trips over.</p>
|
||||
<div class="assess">
|
||||
<div class="ac neu"><div class="ah"><span class="dot"></span><h4><code>main.cpp</code> is a 1,500-line god object</h4></div><p>UI, layout, painting, the entire settings screen, clipboard, paste mechanics, model selection, the popup window class, and stats formatting all live in one translation unit with dozens of globals. It works, but it's the hardest part of the codebase to onboard into. Splitting the settings view, the popup, and the painting helpers into their own files would pay for itself quickly.</p></div>
|
||||
<div class="ac neu"><div class="ah"><span class="dot"></span><h4>Vestigial child windows & duplicate code paths</h4></div><p>Startup still creates ~9 owner-draw child controls (record, pin, copy, paste, clear, two selects, two statics) and then immediately hides all but the transcript edit. Their dead <code>WM_COMMAND</code> handlers duplicate the painted-widget <code>OnClick</code> logic — e.g. the Copy action exists in two near-identical places. Leftovers from the rebuild that should be deleted.</p><p class="ref">main.cpp — CreateWindow(...) blocks then ShowWindow(..., SW_HIDE)</p></div>
|
||||
<div class="ac neg"><div class="ah"><span class="dot"></span><h4>Documentation describes a different app</h4></div><p>This is the most actively misleading issue. <code>CUDA-SETUP.md</code>, <code>QUICK-REBUILD-GPU.md</code> and <code>FIXES-APPLIED.md</code> describe a streaming, VAD, ring-buffer, 24-thread, RTX 3090 design that no longer exists. <code>build.ps1</code> still hunts for CUDA and downloads <code>base.en</code> though the product is a CPU-only <code>tiny.en</code> app. <code>TESTING.md</code> references a <code>test-audio.exe</code> the CMake doesn't build (it builds <code>test-core</code>). A newcomer reading the docs would form a completely wrong mental model.</p></div>
|
||||
<div class="ac neg"><div class="ah"><span class="dot"></span><h4>The README claims a feature that isn't there</h4></div><p>Both <code>README.md</code> and <code>CHANGES.md</code> describe a "500 ms silence auto-end timer." The recording loop has no such logic — it only auto-stops at the 10-minute safety cap. (Silence is <em>trimmed</em> before inference, which is likely the source of the confusion.) Either implement it or remove the claim.</p><p class="ref">main.cpp WM_TIMER recording branch vs README "Audio Processing"</p></div>
|
||||
<div class="ac neu"><div class="ah"><span class="dot"></span><h4>Heavy reliance on global mutable state</h4></div><p>The UI is coordinated through dozens of file-scope globals (<code>g_*</code>), a mix of atomics and plain values. It's manageable at this size and the threading is disciplined, but it makes the code hard to reason about in isolation and easy to break with a careless edit.</p></div>
|
||||
<div class="ac neu"><div class="ah"><span class="dot"></span><h4>Build declares C++11 but uses C++17</h4></div><p><code>CMakeLists.txt</code> sets <code>CMAKE_CXX_STANDARD 11</code>, yet the code uses <code>std::size()</code> (C++17). It compiles only because MSVC's default is newer. Set the standard to 17 explicitly so the build is honest and portable.</p></div>
|
||||
<div class="ac neu"><div class="ah"><span class="dot"></span><h4>Minor: redundant color systems & no in-app hotkey editor</h4></div><p>Three overlapping palettes coexist (<code>CR_*</code> COLORREF, <code>T_*</code> GDI+ Color, <code>C_*</code> aliases). And changing the hotkey requires hand-editing the INI — a natural gap given the polished Settings screen already exists.</p></div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- 14 -->
|
||||
<section id="recs">
|
||||
<div class="sec-h"><span class="sec-n">14</span><h2>Recommendations</h2></div>
|
||||
<p class="lead">If the next session had a short to-do list, this would be it — ordered by payoff for effort.</p>
|
||||
<ol class="rec">
|
||||
<li><h4>Purge or archive the stale docs <span class="pri hi">high</span></h4><p>Delete or clearly mark <code>CUDA-SETUP.md</code>, <code>QUICK-REBUILD-GPU.md</code>, <code>FIXES-APPLIED.md</code>, <code>TESTING.md</code> and <code>DESIGN.md</code> as describing the retired streaming design. This is the single biggest improvement to onboarding, and it's nearly free.</p></li>
|
||||
<li><h4>Reconcile the README with reality <span class="pri hi">high</span></h4><p>Remove the "500 ms silence auto-end" claim (or implement it). Update the model table and build commands to match the CPU-only product.</p></li>
|
||||
<li><h4>Delete the vestigial child windows <span class="pri md">medium</span></h4><p>Remove the hidden owner-draw controls and their dead <code>WM_COMMAND</code> handlers so there's exactly one code path per action. De-duplicate Copy.</p></li>
|
||||
<li><h4>Break up <code>main.cpp</code> <span class="pri md">medium</span></h4><p>Lift the Settings view, the popup window, and the GDI+ drawing helpers into their own files. Even a mechanical split dramatically improves navigability.</p></li>
|
||||
<li><h4>Fix the build standard & align <code>build.ps1</code> <span class="pri md">medium</span></h4><p>Set <code>CMAKE_CXX_STANDARD 17</code>. Strip the CUDA detection from the build script and default it to fetching <code>tiny.en</code>.</p></li>
|
||||
<li><h4>Add an in-app hotkey picker <span class="pri lo">low</span></h4><p>The Settings surface already exists; surfacing the hotkey there closes an obvious UX gap and removes a troubleshooting step.</p></li>
|
||||
</ol>
|
||||
</section>
|
||||
|
||||
<!-- 15 -->
|
||||
<section id="scorecard">
|
||||
<div class="sec-h"><span class="sec-n">15</span><h2>Scorecard & final word</h2></div>
|
||||
<div class="score">
|
||||
<div class="srow"><span class="sl">Architecture & design</span><span class="sb"><span class="sf hi" style="width:92%"></span></span><span class="sv">9.2</span></div>
|
||||
<div class="srow"><span class="sl">Performance fit for target</span><span class="sb"><span class="sf hi" style="width:93%"></span></span><span class="sv">9.3</span></div>
|
||||
<div class="srow"><span class="sl">UX & polish</span><span class="sb"><span class="sf hi" style="width:87%"></span></span><span class="sv">8.7</span></div>
|
||||
<div class="srow"><span class="sl">Robustness & error handling</span><span class="sb"><span class="sf" style="width:75%"></span></span><span class="sv">7.5</span></div>
|
||||
<div class="srow"><span class="sl">Code organization</span><span class="sb"><span class="sf lo" style="width:55%"></span></span><span class="sv">5.5</span></div>
|
||||
<div class="srow"><span class="sl">Maintainability</span><span class="sb"><span class="sf lo" style="width:58%"></span></span><span class="sv">5.8</span></div>
|
||||
<div class="srow"><span class="sl">Testing</span><span class="sb"><span class="sf lo" style="width:48%"></span></span><span class="sv">4.8</span></div>
|
||||
<div class="srow"><span class="sl">Documentation accuracy</span><span class="sb"><span class="sf vlo" style="width:38%"></span></span><span class="sv">3.8</span></div>
|
||||
<div class="overall"><span class="num">7.1</span><span class="ot"><strong style="color:var(--text)">Strong, with cleanup debt.</strong><br>An impressive core wrapped in organizational and documentation drift. The engineering earns a high mark; the housekeeping pulls the average down.</span></div>
|
||||
</div>
|
||||
<div class="verdict" style="margin-top:30px">
|
||||
<p class="vh">Final word</p>
|
||||
<p>Win Dictation is a <strong>good codebase — at its core, an impressive one</strong>. The architectural judgement (batch over streaming), the standout progress estimator, and the seam-free renderer are the work of someone who diagnoses root causes and cares about how software feels. Those are the hard parts, and they're done right.</p>
|
||||
<p>What separates it from "great" is entirely recoverable: a monolithic main file, dead code from a prior design, and documentation that actively describes a different application. A focused day of cleanup — most of it deletion — would lift this from "strong for its niche" to "exemplary small-app code." The good news for anyone inheriting it: the bones are excellent, and the to-do list is short.</p>
|
||||
</div>
|
||||
<div class="footer">
|
||||
<b>Win Dictation — Architecture & Engineering Review</b><br>
|
||||
Native Win32 C++ · GDI+ · SDL2 · whisper.cpp · CPU-only · target Intel i5-7th-gen (2C/4T)<br>
|
||||
Assessment based on a full read of the current source tree.
|
||||
</div>
|
||||
</section>
|
||||
|
||||
</div>
|
||||
<script>
|
||||
document.addEventListener('keydown', function(e) {
|
||||
if (e.key === 'Escape' && window.parent !== window) {
|
||||
window.parent.postMessage({ type: 'close-fullscreen' }, '*');
|
||||
}
|
||||
});
|
||||
</script>
|
||||
<!-- broken-img-handler -->
|
||||
<script>
|
||||
(function(){
|
||||
if(window.__brokenImgHandler)return;
|
||||
window.__brokenImgHandler=true;
|
||||
var MAX=5,DELAYS=[2000,4000,8000,16000,32000];
|
||||
document.addEventListener('error',function(e){
|
||||
var img=e.target;
|
||||
if(!img||img.tagName!=='IMG')return;
|
||||
var liveSrc=img.getAttribute('src');
|
||||
var src=img.dataset.haOriginalSrc||liveSrc;
|
||||
if(!src)return;
|
||||
if(img.dataset.haOriginalSrc&&liveSrc&&liveSrc!==img.dataset.haOriginalSrc&&liveSrc.indexOf('_r=')<0){src=liveSrc;img.dataset.haOriginalSrc=src;img.dataset.haRetryCount='0'}
|
||||
else if(!img.dataset.haOriginalSrc){img.dataset.haOriginalSrc=src}
|
||||
var attempt=parseInt(img.dataset.haRetryCount||'0',10);
|
||||
if(img.dataset.haPhId){var old=document.getElementById(img.dataset.haPhId);if(old)old.remove()}
|
||||
var ph=document.createElement('div');
|
||||
ph.className='ha-img-placeholder'+(attempt>=MAX?' ha-failed':'');
|
||||
ph.id='ha-ph-'+Math.random().toString(36).slice(2,9);
|
||||
var w=img.getAttribute('width');var h=img.getAttribute('height');
|
||||
if(w)ph.style.width=w+(isNaN(Number(w))?'':'px');
|
||||
else if(img.style.width)ph.style.width=img.style.width;
|
||||
else if(img.width>1)ph.style.width=img.width+'px';
|
||||
if(h)ph.style.height=h+(isNaN(Number(h))?'':'px');
|
||||
else if(img.style.height)ph.style.height=img.style.height;
|
||||
else if(img.height>1)ph.style.height=img.height+'px';
|
||||
ph.textContent=attempt>=MAX?'Image unavailable':'Loading image\u2026';
|
||||
img.dataset.haPhId=ph.id;
|
||||
if(img.dataset.haOrigDisplay==null)img.dataset.haOrigDisplay=img.style.display||'';
|
||||
img.style.display='none';
|
||||
img.insertAdjacentElement('afterend',ph);
|
||||
if(attempt<MAX){
|
||||
img.dataset.haRetryCount=String(attempt+1);
|
||||
setTimeout(function(){
|
||||
if(!img.isConnected)return;
|
||||
if(img.dataset.haOriginalSrc!==src)return;
|
||||
if(img.complete&&img.naturalWidth>0)return;
|
||||
var curSrc=img.getAttribute('src');
|
||||
if(curSrc&&curSrc.indexOf(src)!==0)return;
|
||||
var fresh=src+(src.indexOf('?')>=0?'&':'?')+'_r='+(attempt+1)+'_'+Date.now();
|
||||
img.src=fresh;
|
||||
},DELAYS[attempt]);
|
||||
}
|
||||
},true);
|
||||
document.addEventListener('load',function(e){
|
||||
var img=e.target;
|
||||
if(!img||img.tagName!=='IMG')return;
|
||||
if(img.dataset.haPhId){
|
||||
var ph=document.getElementById(img.dataset.haPhId);
|
||||
if(ph)ph.remove();
|
||||
delete img.dataset.haPhId;
|
||||
img.style.display=img.dataset.haOrigDisplay||'';
|
||||
delete img.dataset.haOrigDisplay;
|
||||
delete img.dataset.haOriginalSrc;
|
||||
delete img.dataset.haRetryCount;
|
||||
}
|
||||
},true);
|
||||
})();
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,567 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Win Dictation — User Manual</title>
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
||||
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=JetBrains+Mono:wght@400;500;600&display=swap" rel="stylesheet">
|
||||
<style>
|
||||
:root{
|
||||
--bg:#0E1014; --card:#16191F; --card-hi:#1E222B; --card-lo:#12151B;
|
||||
--text:#ECEEF2; --dim:#8A909C; --faint:#5A606C;
|
||||
--accent:#6E8BFF; --accent-hi:#839CFF; --danger:#FF5C5C; --good:#46D39A;
|
||||
--border:#262B36; --hair:rgba(255,255,255,.06);
|
||||
--mono:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
|
||||
--sans:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
|
||||
}
|
||||
*{box-sizing:border-box}
|
||||
html{scroll-behavior:smooth}
|
||||
body{
|
||||
margin:0; background:var(--bg); color:var(--text);
|
||||
font-family:var(--sans); font-size:16.5px; line-height:1.72;
|
||||
-webkit-font-smoothing:antialiased; letter-spacing:.1px;
|
||||
}
|
||||
.wrap{max-width:940px; margin:0 auto; padding:0 6vw 140px;}
|
||||
a{color:var(--accent-hi); text-decoration:none}
|
||||
a:hover{text-decoration:underline}
|
||||
|
||||
/* Hero */
|
||||
.hero{padding:88px 0 30px; border-bottom:1px solid var(--border); margin-bottom:54px}
|
||||
.eyebrow{font-family:var(--mono); font-size:12.5px; letter-spacing:.32em; text-transform:uppercase; color:var(--accent); margin:0 0 20px}
|
||||
.brandrow{display:flex; align-items:center; gap:18px; margin-bottom:22px}
|
||||
.glyph{width:54px;height:54px;border-radius:14px;flex:none;
|
||||
background:linear-gradient(150deg,#6E8BFF,#4D67E0);
|
||||
display:flex;align-items:center;justify-content:center;
|
||||
box-shadow:0 8px 30px rgba(110,139,255,.35), inset 0 1px 0 rgba(255,255,255,.25)}
|
||||
.glyph svg{width:28px;height:28px}
|
||||
h1{font-size:clamp(34px,6vw,54px); line-height:1.04; margin:0; font-weight:800; letter-spacing:-1.2px}
|
||||
.sub{font-size:20px; color:var(--dim); max-width:660px; margin:18px 0 0; font-weight:400}
|
||||
.metarow{display:flex; flex-wrap:wrap; gap:10px; margin-top:30px}
|
||||
.chip{font-family:var(--mono); font-size:12.5px; color:var(--dim);
|
||||
background:var(--card); border:1px solid var(--border); border-radius:999px; padding:7px 15px}
|
||||
.chip b{color:var(--text); font-weight:600}
|
||||
|
||||
/* TOC */
|
||||
.toc{background:linear-gradient(180deg,var(--card),var(--card-lo));
|
||||
border:1px solid var(--border); border-radius:18px; padding:30px 34px; margin-bottom:62px;
|
||||
box-shadow:0 1px 0 var(--hair) inset}
|
||||
.toc h4{margin:0 0 18px; font-family:var(--mono); font-size:12px; letter-spacing:.28em; text-transform:uppercase; color:var(--faint)}
|
||||
.toc ol{margin:0; padding:0; list-style:none; counter-reset:t;
|
||||
columns:2; column-gap:46px}
|
||||
.toc li{counter-increment:t; padding:7px 0; break-inside:avoid}
|
||||
.toc li a{color:var(--text); font-weight:500; font-size:15.5px}
|
||||
.toc li a::before{content:counter(t,decimal-leading-zero); font-family:var(--mono); color:var(--accent);
|
||||
font-size:12px; margin-right:13px; font-weight:600}
|
||||
|
||||
/* Sections */
|
||||
section{margin:0 0 70px; scroll-margin-top:30px}
|
||||
.sec-h{display:flex; align-items:baseline; gap:16px; margin:0 0 8px}
|
||||
.sec-n{font-family:var(--mono); font-size:14px; color:var(--accent); font-weight:600; flex:none}
|
||||
h2{font-size:29px; font-weight:700; margin:0; letter-spacing:-.5px}
|
||||
h3{font-size:19px; font-weight:650; margin:36px 0 12px; letter-spacing:-.2px; color:var(--text)}
|
||||
.lead{color:var(--dim); font-size:18px; margin:0 0 26px; max-width:720px}
|
||||
p{margin:0 0 17px}
|
||||
.muted{color:var(--dim)}
|
||||
strong{color:#fff; font-weight:650}
|
||||
ul,ol{margin:0 0 18px; padding-left:22px}
|
||||
li{margin:9px 0}
|
||||
hr.soft{border:0;border-top:1px solid var(--border);margin:42px 0}
|
||||
|
||||
kbd{font-family:var(--mono); font-size:13px; background:var(--card-hi);
|
||||
border:1px solid var(--border); border-bottom-color:#000; border-radius:7px;
|
||||
padding:3px 9px; color:var(--text); white-space:nowrap; box-shadow:0 2px 0 rgba(0,0,0,.4)}
|
||||
code{font-family:var(--mono); font-size:14px; background:var(--card-hi); color:#cfe0ff;
|
||||
padding:2px 7px; border-radius:6px; border:1px solid var(--border)}
|
||||
.path{font-family:var(--mono); font-size:13.5px; color:var(--good)}
|
||||
|
||||
/* App mockup */
|
||||
.stage{background:radial-gradient(120% 120% at 50% 0%, #1a1d26 0%, #0b0d11 70%);
|
||||
border:1px solid var(--border); border-radius:20px; padding:46px 30px; margin:8px 0 14px;
|
||||
display:flex; justify-content:center}
|
||||
.appwin{width:380px; max-width:100%; background:var(--bg); border:1px solid #2a2f3a;
|
||||
border-radius:12px; overflow:hidden; box-shadow:0 30px 70px rgba(0,0,0,.6); font-size:14px}
|
||||
.titlebar{display:flex; align-items:center; gap:9px; padding:9px 12px; background:#0b0d11; border-bottom:1px solid #1c2027}
|
||||
.titlebar .ic{width:15px;height:15px;border-radius:4px;background:linear-gradient(150deg,#6E8BFF,#4D67E0)}
|
||||
.titlebar .tt{color:var(--dim); font-size:12.5px}
|
||||
.titlebar .tw{margin-left:auto; color:var(--faint); letter-spacing:3px; font-size:12px}
|
||||
.appbody{padding:16px}
|
||||
.rrow{display:flex; gap:9px; margin-bottom:13px}
|
||||
.rec{flex:1; background:linear-gradient(180deg,#7a93ff,#6E8BFF); border-radius:999px;
|
||||
display:flex; align-items:center; gap:11px; padding:11px 18px; color:#fff; font-weight:600; position:relative}
|
||||
.rec .d{width:13px;height:13px;border-radius:50%;background:#fff}
|
||||
.chipbtn{width:42px; border-radius:10px; background:var(--card); border:1px solid var(--border);
|
||||
display:flex; align-items:center; justify-content:center; position:relative}
|
||||
.chipbtn svg{width:17px;height:17px}
|
||||
.chipbtn.on svg{color:var(--accent)}
|
||||
.stat{color:var(--dim); font-size:12.5px; margin:2px 2px 13px; position:relative}
|
||||
.tbox{background:var(--card); border:1px solid var(--border); border-radius:12px;
|
||||
padding:14px 15px; min-height:104px; color:var(--text); font-size:13.5px; line-height:1.5; position:relative;
|
||||
box-shadow:0 1px 0 var(--hair) inset}
|
||||
.srow{display:flex; gap:9px; margin:13px 0}
|
||||
.sel{flex:1; background:var(--card); border:1px solid var(--border); border-radius:10px;
|
||||
padding:10px 13px; color:var(--text); font-size:12.5px; display:flex; align-items:center; position:relative}
|
||||
.sel .cv{margin-left:auto; color:var(--dim)}
|
||||
.arow{display:flex; justify-content:space-around; padding:8px 0 2px; color:var(--dim); font-size:13.5px; position:relative}
|
||||
.anno{position:absolute; top:-9px; right:-9px; width:21px;height:21px; border-radius:50%;
|
||||
background:var(--accent); color:#fff; font-family:var(--mono); font-size:11.5px; font-weight:700;
|
||||
display:flex; align-items:center; justify-content:center; box-shadow:0 2px 8px rgba(0,0,0,.5); z-index:3}
|
||||
.anno.l{left:-9px; right:auto}
|
||||
.arow .anno{top:-4px; right:8px}
|
||||
|
||||
.legend{display:grid; grid-template-columns:1fr 1fr; gap:13px 30px; margin:24px 0 0}
|
||||
.legend .li{display:flex; gap:13px; align-items:flex-start}
|
||||
.legend .bn{flex:none; width:22px;height:22px;border-radius:50%; background:var(--accent); color:#fff;
|
||||
font-family:var(--mono); font-size:12px; font-weight:700; display:flex; align-items:center; justify-content:center; margin-top:2px}
|
||||
.legend .lt{font-size:14.5px; color:var(--dim)}
|
||||
.legend .lt b{display:block; color:var(--text); font-weight:600; margin-bottom:1px; font-size:15px}
|
||||
|
||||
/* Steps */
|
||||
.steps{counter-reset:s; margin:0; padding:0; list-style:none}
|
||||
.steps li{counter-increment:s; position:relative; padding:0 0 26px 60px; margin:0}
|
||||
.steps li:not(:last-child)::after{content:""; position:absolute; left:21px; top:42px; bottom:6px; width:2px; background:var(--border)}
|
||||
.steps li::before{content:counter(s); position:absolute; left:0; top:0; width:43px;height:43px;border-radius:12px;
|
||||
background:var(--card); border:1px solid var(--border); color:var(--accent); font-family:var(--mono); font-weight:700; font-size:17px;
|
||||
display:flex; align-items:center; justify-content:center}
|
||||
.steps h4{margin:6px 0 5px; font-size:17.5px; font-weight:650}
|
||||
.steps p{margin:0; color:var(--dim); font-size:15.5px}
|
||||
|
||||
/* Callouts */
|
||||
.note{border:1px solid var(--border); border-left:3px solid var(--accent);
|
||||
background:linear-gradient(90deg,rgba(110,139,255,.08),transparent 60%); border-radius:12px; padding:17px 20px; margin:22px 0}
|
||||
.note.warn{border-left-color:var(--danger); background:linear-gradient(90deg,rgba(255,92,92,.08),transparent 60%)}
|
||||
.note.good{border-left-color:var(--good); background:linear-gradient(90deg,rgba(70,211,154,.08),transparent 60%)}
|
||||
.note .nt{font-family:var(--mono); font-size:11.5px; letter-spacing:.18em; text-transform:uppercase; color:var(--dim); margin:0 0 6px}
|
||||
.note p:last-child{margin:0}
|
||||
|
||||
/* Tables */
|
||||
.tbl{width:100%; border-collapse:collapse; margin:18px 0; font-size:15px; overflow:hidden; border-radius:12px; border:1px solid var(--border)}
|
||||
.tbl th{text-align:left; font-family:var(--mono); font-size:11.5px; letter-spacing:.12em; text-transform:uppercase;
|
||||
color:var(--dim); padding:13px 16px; background:var(--card-lo); border-bottom:1px solid var(--border); font-weight:600}
|
||||
.tbl td{padding:13px 16px; border-bottom:1px solid var(--border); vertical-align:top; color:var(--text)}
|
||||
.tbl tr:last-child td{border-bottom:0}
|
||||
.tbl tr:nth-child(even) td{background:rgba(255,255,255,.012)}
|
||||
.tbl td .sm{color:var(--dim); font-size:13.5px}
|
||||
.tag{font-family:var(--mono); font-size:12px; padding:2px 9px; border-radius:6px; white-space:nowrap}
|
||||
.tag.fast{background:rgba(70,211,154,.14); color:var(--good)}
|
||||
.tag.bal{background:rgba(110,139,255,.14); color:var(--accent-hi)}
|
||||
.tag.slow{background:rgba(255,92,92,.14); color:var(--danger)}
|
||||
|
||||
/* Feature grid */
|
||||
.grid{display:grid; grid-template-columns:1fr 1fr; gap:16px; margin:24px 0}
|
||||
.fcard{background:var(--card); border:1px solid var(--border); border-radius:14px; padding:22px; box-shadow:0 1px 0 var(--hair) inset}
|
||||
.fcard .fi{width:38px;height:38px;border-radius:10px;background:var(--card-hi); display:flex;align-items:center;justify-content:center; margin-bottom:14px}
|
||||
.fcard .fi svg{width:20px;height:20px;color:var(--accent)}
|
||||
.fcard h4{margin:0 0 7px; font-size:16.5px; font-weight:650}
|
||||
.fcard p{margin:0; color:var(--dim); font-size:14.5px; line-height:1.6}
|
||||
|
||||
.kv{display:flex; gap:14px; padding:14px 0; border-bottom:1px solid var(--border)}
|
||||
.kv:last-child{border-bottom:0}
|
||||
.kv .k{flex:none; width:190px}
|
||||
.kv .k kbd{font-size:13px}
|
||||
.kv .v{color:var(--dim); font-size:15.5px}
|
||||
|
||||
.footer{border-top:1px solid var(--border); margin-top:80px; padding-top:30px; color:var(--faint); font-size:13.5px; font-family:var(--mono)}
|
||||
.footer b{color:var(--dim); font-weight:500}
|
||||
|
||||
@media(max-width:680px){
|
||||
.toc ol{columns:1}
|
||||
.grid,.legend{grid-template-columns:1fr}
|
||||
.kv{flex-direction:column; gap:4px}
|
||||
.kv .k{width:auto}
|
||||
body{font-size:16px}
|
||||
}
|
||||
</style>
|
||||
<style>
|
||||
.ha-img-placeholder{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:6px;background:#f4f4f5;border:1px dashed #d4d4d8;border-radius:8px;color:#71717a;font-size:12px;font-family:system-ui,sans-serif;min-height:80px;padding:16px;box-sizing:border-box;animation:ha-img-pulse 1.5s ease-in-out infinite}
|
||||
.ha-img-placeholder.ha-failed{animation:none;opacity:.7}
|
||||
@keyframes ha-img-pulse{0%,100%{opacity:1}50%{opacity:.5}}
|
||||
@media(prefers-color-scheme:dark){.ha-img-placeholder{background:#27272a;border-color:#3f3f46;color:#a1a1aa}}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="wrap">
|
||||
|
||||
<!-- HERO -->
|
||||
<header class="hero">
|
||||
<p class="eyebrow">User Manual · v3</p>
|
||||
<div class="brandrow">
|
||||
<div class="glyph">
|
||||
<svg viewBox="0 0 24 24" fill="none" stroke="#fff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M12 2a3 3 0 0 0-3 3v7a3 3 0 0 0 6 0V5a3 3 0 0 0-3-3z"/><path d="M19 10v2a7 7 0 0 1-14 0v-2"/><line x1="12" y1="19" x2="12" y2="23"/></svg>
|
||||
</div>
|
||||
<h1>Win Dictation</h1>
|
||||
</div>
|
||||
<p class="sub">A push-to-talk speech-to-text utility for Windows. Press a hotkey, speak, and your words land in whatever app you were just using — fully offline, powered by Whisper.</p>
|
||||
<div class="metarow">
|
||||
<span class="chip"><b>Offline</b> · runs on your machine</span>
|
||||
<span class="chip"><b>Hotkey</b> Ctrl+Shift+Space</span>
|
||||
<span class="chip"><b>CPU-only</b> · no GPU required</span>
|
||||
<span class="chip"><b>Whisper</b> · tiny.en → small.en</span>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<!-- TOC -->
|
||||
<nav class="toc">
|
||||
<h4>Contents</h4>
|
||||
<ol>
|
||||
<li><a href="#what">What Win Dictation is</a></li>
|
||||
<li><a href="#quick">Quick start in 60 seconds</a></li>
|
||||
<li><a href="#tour">The interface, explained</a></li>
|
||||
<li><a href="#workflow">How dictation works</a></li>
|
||||
<li><a href="#hotkeys">Keyboard & hotkeys</a></li>
|
||||
<li><a href="#autopaste">Auto-paste & the active window</a></li>
|
||||
<li><a href="#history">History & sessions</a></li>
|
||||
<li><a href="#models">Models & the Settings screen</a></li>
|
||||
<li><a href="#tray">System tray & options</a></li>
|
||||
<li><a href="#stats">Your statistics</a></li>
|
||||
<li><a href="#tips">Tips for best results</a></li>
|
||||
<li><a href="#trouble">Troubleshooting</a></li>
|
||||
<li><a href="#faq">FAQ & where things live</a></li>
|
||||
</ol>
|
||||
</nav>
|
||||
|
||||
<!-- 1 -->
|
||||
<section id="what">
|
||||
<div class="sec-h"><span class="sec-n">01</span><h2>What Win Dictation is</h2></div>
|
||||
<p class="lead">A small, focused desktop tool that turns your voice into text anywhere on Windows — no browser, no cloud, no account.</p>
|
||||
<p>Win Dictation sits quietly in your system tray. When you want to dictate, you press a global hotkey, speak a sentence or a paragraph, then press the hotkey again. A second or two later the transcribed text is copied to your clipboard and — by default — automatically pasted into whatever window you were using: your email, a chat box, a code editor, a document.</p>
|
||||
<p>Everything happens <strong>on your computer</strong>. The audio never leaves the machine; transcription runs locally using <a href="https://github.com/ggerganov/whisper.cpp" target="_blank" rel="noopener noreferrer">whisper.cpp</a>, a compact build of OpenAI's Whisper model. That means it works on a plane, behind a firewall, or anywhere with no internet at all.</p>
|
||||
<div class="note good">
|
||||
<p class="nt">Built for modest hardware</p>
|
||||
<p>This build is tuned for an ordinary CPU-only laptop — the kind with two physical cores and no graphics card. It uses a fast, lightweight model by default and keeps your processor nearly idle while you speak, only working hard for a brief moment after you stop.</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- 2 -->
|
||||
<section id="quick">
|
||||
<div class="sec-h"><span class="sec-n">02</span><h2>Quick start in 60 seconds</h2></div>
|
||||
<p class="lead">Three steps. No setup, no sign-in.</p>
|
||||
<ol class="steps">
|
||||
<li>
|
||||
<h4>Launch <span class="path">win-dictation.exe</span></h4>
|
||||
<p>The window opens and a microphone icon appears in your system tray. Wait a moment for the status line to change from <em>“Loading model…”</em> to <strong>“Ready”</strong>.</p>
|
||||
</li>
|
||||
<li>
|
||||
<h4>Click into wherever you want the text, then press <kbd>Ctrl</kbd>+<kbd>Shift</kbd>+<kbd>Space</kbd></h4>
|
||||
<p>Put your cursor in the email, chat box, or document first. Then hit the hotkey. The Record button turns red and a green level meter shows it’s hearing you.</p>
|
||||
</li>
|
||||
<li>
|
||||
<h4>Speak, then press the hotkey again</h4>
|
||||
<p>Talk naturally. When you’re done, press <kbd>Ctrl</kbd>+<kbd>Shift</kbd>+<kbd>Space</kbd> once more. A short progress bar runs, and your words appear — pasted straight into the app you were using.</p>
|
||||
</li>
|
||||
</ol>
|
||||
<div class="note">
|
||||
<p class="nt">That's the whole loop</p>
|
||||
<p>Press to start, speak, press to finish. The text is on your clipboard <em>and</em> dropped into your previous window. You never have to click back into Win Dictation.</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- 3 -->
|
||||
<section id="tour">
|
||||
<div class="sec-h"><span class="sec-n">03</span><h2>The interface, explained</h2></div>
|
||||
<p class="lead">The whole app is a single window. Here is every control on it.</p>
|
||||
|
||||
<div class="stage">
|
||||
<div class="appwin">
|
||||
<div class="titlebar"><span class="ic"></span><span class="tt">Dictation</span><span class="tw">— ▢ ✕</span></div>
|
||||
<div class="appbody">
|
||||
<div class="rrow">
|
||||
<div class="rec"><span class="d"></span>Record<span class="anno">1</span></div>
|
||||
<div class="chipbtn on"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M9 4v6l-2 4v2h10v-2l-2-4V4"/><line x1="12" y1="16" x2="12" y2="22"/><line x1="8" y1="4" x2="16" y2="4"/></svg><span class="anno">2</span></div>
|
||||
<div class="chipbtn"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="3"/><path d="M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 1 1-2.83 2.83l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-4 0v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 1 1-2.83-2.83l.06-.06a1.65 1.65 0 0 0 .33-1.82 1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1 0-4h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 1 1 2.83-2.83l.06.06a1.65 1.65 0 0 0 1.82.33H9a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 4 0v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 1 1 2.83 2.83l-.06.06a1.65 1.65 0 0 0-.33 1.82V9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 0 4h-.09a1.65 1.65 0 0 0-1.51 1z"/></svg><span class="anno">3</span></div>
|
||||
</div>
|
||||
<div class="stat">Ready • 2 threads<span class="anno">4</span></div>
|
||||
<div class="tbox">Win-dictate is a desktop, whisper powered, speech to text application!<span class="anno">5</span></div>
|
||||
<div class="srow">
|
||||
<div class="sel">Microphone (Realtek Audio)<span class="cv">⌄</span><span class="anno">6</span></div>
|
||||
<div class="sel">History<span class="cv">⌄</span><span class="anno">7</span></div>
|
||||
</div>
|
||||
<div class="arow"><span>Copy</span><span>Paste</span><span>Clear</span><span class="anno">8</span></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="legend">
|
||||
<div class="li"><span class="bn">1</span><span class="lt"><b>Record / Stop</b>The big pill. Click to start; it turns red and reads “Stop” while recording. Same as the hotkey.</span></div>
|
||||
<div class="li"><span class="bn">2</span><span class="lt"><b>Pin</b>Keeps the window always on top. Blue when active. On by default.</span></div>
|
||||
<div class="li"><span class="bn">3</span><span class="lt"><b>Settings (cog)</b>Opens the Settings screen for choosing and downloading models, and viewing your stats.</span></div>
|
||||
<div class="li"><span class="bn">4</span><span class="lt"><b>Status line</b>Shows “Ready” and the thread count when idle, a timer while recording, and a live countdown while transcribing.</span></div>
|
||||
<div class="li"><span class="bn">5</span><span class="lt"><b>Transcript box</b>Where text appears. You can <strong>edit it freely</strong> — click in and type, fix, or delete.</span></div>
|
||||
<div class="li"><span class="bn">6</span><span class="lt"><b>Microphone selector</b>Choose which input device to record from. Opens a dropdown of all your mics.</span></div>
|
||||
<div class="li"><span class="bn">7</span><span class="lt"><b>History</b>Opens a list of past dictation sessions you can reload — or delete individually.</span></div>
|
||||
<div class="li"><span class="bn">8</span><span class="lt"><b>Copy · Paste · Clear</b>Copy the transcript, paste it into your last window, or clear the box (saving it to history first).</span></div>
|
||||
</div>
|
||||
|
||||
<h3>The status line is your dashboard</h3>
|
||||
<p>That one line of dim text under the Record button tells you everything about the app's state:</p>
|
||||
<table class="tbl">
|
||||
<tr><th>You see</th><th>It means</th></tr>
|
||||
<tr><td><code>Loading model…</code></td><td>Starting up — the speech model is being read into memory. Wait a second.</td></tr>
|
||||
<tr><td><code>Ready · 2 threads</code></td><td>Idle and ready to record. The number is how many CPU threads it will use.</td></tr>
|
||||
<tr><td><code>Recording 0:14</code></td><td>Listening. The timer counts how long you've been speaking. A green level meter pulses with your voice.</td></tr>
|
||||
<tr><td><code>Transcribing 0:14 · 62% · 3s left</code></td><td>Working on your audio. The bar fills and the countdown ticks <em>down</em> to zero.</td></tr>
|
||||
<tr><td><code>Pasted</code> / <code>Copied</code></td><td>Done. Your text went to the clipboard (and into your previous window if auto-paste is on).</td></tr>
|
||||
<tr><td><code>No speech detected</code></td><td>The clip was silent or too short to transcribe. Nothing was added.</td></tr>
|
||||
</table>
|
||||
</section>
|
||||
|
||||
<!-- 4 -->
|
||||
<section id="workflow">
|
||||
<div class="sec-h"><span class="sec-n">04</span><h2>How dictation works</h2></div>
|
||||
<p class="lead">Win Dictation is <strong>push-to-talk</strong>, not live streaming. You record a whole clip, then it transcribes the whole thing at once.</p>
|
||||
<p>This is a deliberate design choice. Instead of trying to transcribe word-by-word as you speak (which pins a CPU at 100% and stutters on a modest laptop), Win Dictation simply records your audio cheaply while you talk, then does one fast transcription pass the moment you stop. The result is calmer, more accurate, and far lighter on your battery.</p>
|
||||
|
||||
<h3>What happens when you record</h3>
|
||||
<ol>
|
||||
<li><strong>You press the hotkey.</strong> The app remembers which window you were in, and where your text cursor was sitting inside the transcript box.</li>
|
||||
<li><strong>It records.</strong> Audio is captured at 16 kHz and held in memory. CPU use stays near zero. The level meter shows it's hearing you.</li>
|
||||
<li><strong>You press the hotkey again.</strong> Recording stops. Silence at the start and end of your clip is trimmed away automatically.</li>
|
||||
<li><strong>It transcribes.</strong> The full clip is run through Whisper once. The progress bar shows a smooth, self-calibrating estimate of how long it will take.</li>
|
||||
<li><strong>The text lands.</strong> It's inserted at your cursor (with smart spacing so words don't run together), copied to the clipboard, and pasted into your previous window.</li>
|
||||
</ol>
|
||||
|
||||
<div class="note">
|
||||
<p class="nt">There is no “stop on silence”</p>
|
||||
<p>Recording continues until <em>you</em> press the hotkey again (or click Stop). Pausing to think won't end the session — take your time. The only automatic stop is a safety cap at <strong>10 minutes</strong> per clip.</p>
|
||||
</div>
|
||||
|
||||
<h3>The transcript box is editable</h3>
|
||||
<p>Unlike many dictation tools, the text area is fully editable. Click anywhere in it to fix a misheard word, delete a stray sentence, or type manually. When you dictate again, the new text is inserted <strong>at your cursor</strong> — so you can build up a document piece by piece, placing each new chunk exactly where you want it.</p>
|
||||
</section>
|
||||
|
||||
<!-- 5 -->
|
||||
<section id="hotkeys">
|
||||
<div class="sec-h"><span class="sec-n">05</span><h2>Keyboard & hotkeys</h2></div>
|
||||
<p class="lead">Two global shortcuts work from anywhere in Windows, even when the window is hidden.</p>
|
||||
<div class="kv"><div class="k"><kbd>Ctrl</kbd>+<kbd>Shift</kbd>+<kbd>Space</kbd></div><div class="v"><strong>Start / stop recording.</strong> The core hotkey. Press once to begin, once more to transcribe. If a transcription is already running, pressing it again cancels it.</div></div>
|
||||
<div class="kv"><div class="k"><kbd>Ctrl</kbd>+<kbd>Shift</kbd>+<kbd>H</kbd></div><div class="v"><strong>Hide the window.</strong> Tucks Win Dictation away to the tray (and cancels any recording in progress). The hotkeys still work while hidden.</div></div>
|
||||
<div class="kv"><div class="k"><kbd>Esc</kbd> <span class="muted">(in a dropdown)</span></div><div class="v">Closes an open Microphone or History popup without choosing anything.</div></div>
|
||||
<div class="kv"><div class="k"><kbd>Delete</kbd> <span class="muted">(in History)</span></div><div class="v">Deletes the history entry you're hovering over.</div></div>
|
||||
<div class="note warn">
|
||||
<p class="nt">If the hotkey doesn't work</p>
|
||||
<p>You may see <code>Hotkey in use — edit win-dictation.ini</code>. That means another program already grabbed <kbd>Ctrl</kbd>+<kbd>Shift</kbd>+<kbd>Space</kbd>. You can change it by editing the <code>hkMods</code> and <code>hkVk</code> values in the <span class="path">win-dictation.ini</span> file (see the <a href="#faq">FAQ</a>).</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- 6 -->
|
||||
<section id="autopaste">
|
||||
<div class="sec-h"><span class="sec-n">06</span><h2>Auto-paste & the active window</h2></div>
|
||||
<p class="lead">The feature that makes Win Dictation feel invisible: it types into <em>other</em> apps for you.</p>
|
||||
<p>When you trigger recording, the app notes which window had focus a moment before. After transcription, if <strong>Auto-paste</strong> is enabled (it is by default), it brings that window back to the front and pastes your text there automatically. You dictate, and the words appear in your email — you never touch Win Dictation's own window.</p>
|
||||
<p>If you'd rather paste manually, turn auto-paste off in the tray menu. The text is always still copied to your clipboard, and the <strong>Paste</strong> button will send it to your last window on demand.</p>
|
||||
<div class="note">
|
||||
<p class="nt">Pair it with Auto-hide</p>
|
||||
<p>Turn on <strong>Auto-hide</strong> (tray menu) and the window disappears the instant it pastes. Combined with the global hotkey, dictation becomes a pure overlay: tap, speak, tap, and your words flow into whatever you're doing.</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- 7 -->
|
||||
<section id="history">
|
||||
<div class="sec-h"><span class="sec-n">07</span><h2>History & sessions</h2></div>
|
||||
<p class="lead">Every dictation session is saved automatically, so you never lose a transcript.</p>
|
||||
<p>A <strong>session</strong> is everything you dictate between clears. As soon as you finish your first clip, Win Dictation writes it to a timestamped text file. Each additional clip in that session updates the same file — so one session is one tidy file, kept up to date as you go.</p>
|
||||
|
||||
<h3>Browsing and reloading</h3>
|
||||
<p>Click the <strong>History</strong> selector to open the list. Each entry shows its date, time, and a short preview of the text. Click one to load it back into the transcript box. The most recent sessions are at the top, and up to <strong>100</strong> sessions are kept (older ones are pruned automatically).</p>
|
||||
|
||||
<h3>Deleting entries</h3>
|
||||
<p>Hover over any history row and a small <strong>✕</strong> appears on its right edge — click it to delete that session's file. You can also press <kbd>Delete</kbd> on the hovered row. The list <em>stays open</em> after each delete so you can tidy up several at once. The window even shrinks to fit as the list gets shorter.</p>
|
||||
<div class="note warn">
|
||||
<p class="nt">Deletion is permanent</p>
|
||||
<p>Removing a history entry deletes its text file from disk immediately — there is no confirmation prompt and no undo. The files themselves live in a <span class="path">history\</span> folder next to the program, if you ever want to back them up.</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- 8 -->
|
||||
<section id="models">
|
||||
<div class="sec-h"><span class="sec-n">08</span><h2>Models & the Settings screen</h2></div>
|
||||
<p class="lead">A model is the AI that turns sound into words. Bigger models are more accurate but slower. Click the cog to manage them.</p>
|
||||
<p>The Settings screen lists every model Win Dictation can use. Each row shows the model's name, file size, and a short hint. Installed models have a filled radio button you can select; ones you don't have yet show a <strong>Download</strong> button that fetches them directly from Hugging Face with a live progress percentage.</p>
|
||||
|
||||
<table class="tbl">
|
||||
<tr><th>Model</th><th>Size</th><th>Character</th><th></th></tr>
|
||||
<tr><td><code>tiny.en</code></td><td class="sm">~75 MB</td><td class="sm">The default. Quick and light — ideal for this CPU.</td><td><span class="tag fast">fastest</span></td></tr>
|
||||
<tr><td><code>tiny.en-q8_0</code></td><td class="sm">~42 MB</td><td class="sm">Same speed, smaller file (compressed).</td><td><span class="tag fast">fastest</span></td></tr>
|
||||
<tr><td><code>base.en-q5_1</code></td><td class="sm">~59 MB</td><td class="sm">A noticeable accuracy bump for little cost.</td><td><span class="tag bal">good balance</span></td></tr>
|
||||
<tr><td><code>base.en</code></td><td class="sm">~142 MB</td><td class="sm">More accurate; still reasonable on two cores.</td><td><span class="tag bal">balance</span></td></tr>
|
||||
<tr><td><code>small.en-q5_1</code></td><td class="sm">~182 MB</td><td class="sm">Accurate, but slow on this machine.</td><td><span class="tag slow">slow here</span></td></tr>
|
||||
<tr><td><code>small.en</code></td><td class="sm">~466 MB</td><td class="sm">The most accurate offered — and the slowest.</td><td><span class="tag slow">slowest</span></td></tr>
|
||||
</table>
|
||||
|
||||
<h3>Choosing a model</h3>
|
||||
<ol>
|
||||
<li>Open Settings (the cog), and find the model you want.</li>
|
||||
<li>If it isn't installed, click <strong>Download</strong> and wait for it to reach 100%. You can cancel mid-download, and only one downloads at a time.</li>
|
||||
<li>Click the model's row to select it (the dot fills in).</li>
|
||||
<li>Click <strong>Save</strong>. The app reloads with the new model and remembers your choice. <strong>Back</strong> or <strong>Cancel</strong> discards any change.</li>
|
||||
</ol>
|
||||
<div class="note">
|
||||
<p class="nt">A good rule of thumb</p>
|
||||
<p>Stick with <code>tiny.en</code> or <code>base.en-q5_1</code> for everyday use on a two-core laptop. Step up to <code>base.en</code> if you want better accuracy and don't mind waiting a beat longer. The <code>small</code> models are best reserved for short, important clips where accuracy matters most.</p>
|
||||
</div>
|
||||
|
||||
<h3>The progress bar learns your machine</h3>
|
||||
<p>You'll notice the transcription countdown is unusually accurate. That's because Win Dictation <strong>measures how fast your specific computer is</strong> with each model and remembers it. The more you use a model, the better its time estimates become — the bar counts steadily down rather than jumping around.</p>
|
||||
</section>
|
||||
|
||||
<!-- 9 -->
|
||||
<section id="tray">
|
||||
<div class="sec-h"><span class="sec-n">09</span><h2>System tray & options</h2></div>
|
||||
<p class="lead">Win Dictation lives in the tray. Right-click its icon for the quick options menu.</p>
|
||||
<div class="grid">
|
||||
<div class="fcard"><div class="fi"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M9 11l3 3L22 4"/><path d="M21 12v7a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h11"/></svg></div><h4>Auto-paste</h4><p>Paste transcribed text into your previous window automatically. On by default.</p></div>
|
||||
<div class="fcard"><div class="fi"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M12 2l2.4 7.4H22l-6 4.6 2.3 7-6.3-4.6L5.7 21 8 14 2 9.4h7.6z"/></svg></div><h4>Always on top</h4><p>Keep the window above other apps. Mirrors the Pin button. On by default.</p></div>
|
||||
<div class="fcard"><div class="fi"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M2 12s3-7 10-7 10 7 10 7-3 7-10 7S2 12 2 12z"/><line x1="4" y1="4" x2="20" y2="20"/></svg></div><h4>Auto-hide</h4><p>Hide the window automatically right after it pastes. Off by default.</p></div>
|
||||
<div class="fcard"><div class="fi"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M18 6L6 18M6 6l12 12"/></svg></div><h4>Exit</h4><p>Fully quits the app. Closing the window only hides it to the tray — use this to stop it entirely.</p></div>
|
||||
</div>
|
||||
<p class="muted">Double-clicking the tray icon brings the window back. Closing the window with the <strong>✕</strong> doesn't quit — it just hides, so the hotkey keeps working in the background. Your window position, pinned state, and these toggles are all remembered between launches.</p>
|
||||
</section>
|
||||
|
||||
<!-- 10 -->
|
||||
<section id="stats">
|
||||
<div class="sec-h"><span class="sec-n">10</span><h2>Your statistics</h2></div>
|
||||
<p class="lead">Scroll down in Settings to see a running tally of your dictation habits.</p>
|
||||
<p>Win Dictation quietly keeps lifetime totals and turns them into friendly figures:</p>
|
||||
<ul>
|
||||
<li><strong>Total audio dictated</strong> and the number of clips.</li>
|
||||
<li><strong>Word count</strong>, plus your average <strong>speaking pace</strong> in words per minute.</li>
|
||||
<li><strong>Total processing time</strong> and your machine's <strong>real-time factor</strong> (e.g. “4× real-time” means it transcribes four seconds of audio every second).</li>
|
||||
<li>Your <strong>longest single clip</strong>.</li>
|
||||
<li>An estimate of the <strong>time you've saved</strong> versus typing at 40 wpm.</li>
|
||||
</ul>
|
||||
<p class="muted">These numbers are stored locally and are just for your own curiosity — nothing is reported anywhere.</p>
|
||||
</section>
|
||||
|
||||
<!-- 11 -->
|
||||
<section id="tips">
|
||||
<div class="sec-h"><span class="sec-n">11</span><h2>Tips for best results</h2></div>
|
||||
<div class="grid">
|
||||
<div class="fcard"><h4>Click first, then dictate</h4><p>Put your text cursor in the destination app <em>before</em> pressing the hotkey, so auto-paste knows where to send the words.</p></div>
|
||||
<div class="fcard"><h4>Speak in natural phrases</h4><p>Whisper transcribes best with full sentences and natural rhythm. You don't need to over-enunciate or pause between words.</p></div>
|
||||
<div class="fcard"><h4>Pick the right mic</h4><p>If accuracy is poor, check the Microphone selector — a headset or dedicated mic beats a distant laptop mic in a noisy room.</p></div>
|
||||
<div class="fcard"><h4>Match model to task</h4><p>Quick chat replies? <code>tiny.en</code>. A careful paragraph of prose? Try <code>base.en</code> for fewer corrections.</p></div>
|
||||
<div class="fcard"><h4>Edit in place</h4><p>Fix the odd misheard word right in the transcript box, then Copy — faster than re-recording the whole thing.</p></div>
|
||||
<div class="fcard"><h4>Let it warm up</h4><p>The very first transcription after launch can be a touch slower as the model settles into memory. It's quick from then on.</p></div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- 12 -->
|
||||
<section id="trouble">
|
||||
<div class="sec-h"><span class="sec-n">12</span><h2>Troubleshooting</h2></div>
|
||||
<table class="tbl">
|
||||
<tr><th>Symptom</th><th>What to do</th></tr>
|
||||
<tr><td><b>“Model not found”</b></td><td>The selected <code>.bin</code> model file is missing. Open Settings and download a model (start with <code>tiny.en</code>), or place a <code>.bin</code> file in the <span class="path">models\</span> folder next to the program and restart.</td></tr>
|
||||
<tr><td><b>“Hotkey in use”</b></td><td>Another app owns <kbd>Ctrl</kbd>+<kbd>Shift</kbd>+<kbd>Space</kbd>. Change the hotkey in <span class="path">win-dictation.ini</span>, or close the conflicting app. You can still record by clicking the Record button.</td></tr>
|
||||
<tr><td><b>“Microphone error”</b></td><td>The chosen input device couldn't be opened. Pick a different mic from the selector, make sure it isn't in use by another app, and check Windows mic permissions.</td></tr>
|
||||
<tr><td><b>“No speech detected”</b></td><td>The clip was silent, too quiet, or under ~0.3 seconds. Check the level meter moves when you talk, and confirm the right mic is selected.</td></tr>
|
||||
<tr><td><b>Text pasted into the wrong place</b></td><td>Auto-paste targets whatever window was focused just before you pressed the hotkey. Click into your destination first. If in doubt, turn auto-paste off and use the Paste button deliberately.</td></tr>
|
||||
<tr><td><b>Transcription feels slow</b></td><td>You're likely on a larger model. Switch to <code>tiny.en</code> or <code>base.en-q5_1</code> in Settings. The <code>small</code> models are inherently slow on a two-core CPU.</td></tr>
|
||||
<tr><td><b>Window vanished</b></td><td>It hid to the tray. Double-click the tray icon, press <kbd>Ctrl</kbd>+<kbd>Shift</kbd>+<kbd>H</kbd>, or right-click the tray icon → Show Window.</td></tr>
|
||||
</table>
|
||||
</section>
|
||||
|
||||
<!-- 13 -->
|
||||
<section id="faq">
|
||||
<div class="sec-h"><span class="sec-n">13</span><h2>FAQ & where things live</h2></div>
|
||||
|
||||
<h3>Does my voice get sent anywhere?</h3>
|
||||
<p>No. All recording and transcription happen on your computer. The only time the app reaches the internet is when <em>you</em> click Download to fetch a model file.</p>
|
||||
|
||||
<h3>Can it run completely offline?</h3>
|
||||
<p>Yes — once you have at least one model installed, no internet is needed ever again.</p>
|
||||
|
||||
<h3>What languages does it support?</h3>
|
||||
<p>This build is tuned for <strong>English</strong> (the <code>.en</code> models). It's optimised for accuracy and speed in English on modest hardware.</p>
|
||||
|
||||
<h3>Where are my files kept?</h3>
|
||||
<p>Everything sits next to <span class="path">win-dictation.exe</span>:</p>
|
||||
<table class="tbl">
|
||||
<tr><th>Location</th><th>What's there</th></tr>
|
||||
<tr><td><span class="path">models\</span></td><td>Your downloaded <code>.bin</code> speech models.</td></tr>
|
||||
<tr><td><span class="path">history\</span></td><td>One text file per dictation session.</td></tr>
|
||||
<tr><td><span class="path">win-dictation.ini</span></td><td>Your settings, hotkey, window position, learned timing, and statistics.</td></tr>
|
||||
<tr><td><span class="path">win-dictation.log</span></td><td>A simple timestamped activity log, handy if something misbehaves.</td></tr>
|
||||
</table>
|
||||
|
||||
<h3>How do I change the hotkey?</h3>
|
||||
<p>Open <span class="path">win-dictation.ini</span> in any text editor and edit the <code>hkMods</code> and <code>hkVk</code> values under <code>[app]</code> (they're standard Windows key codes), then restart the app. A built-in settings option for this is a natural future addition.</p>
|
||||
|
||||
<h3>Why is it called “push-to-talk” if I'm not holding a button?</h3>
|
||||
<p>It's toggle-style push-to-talk: one press starts, another stops. You're not transcribing live as you speak — you capture a clip, then it's processed. This is what keeps it fast and light on a CPU-only machine.</p>
|
||||
|
||||
<div class="footer">
|
||||
<b>Win Dictation</b> · push-to-talk speech-to-text for Windows · powered by whisper.cpp (MIT)<br>
|
||||
Default hotkey Ctrl+Shift+Space · CPU-only build · runs entirely offline
|
||||
</div>
|
||||
</section>
|
||||
|
||||
</div>
|
||||
<script>
|
||||
document.addEventListener('keydown', function(e) {
|
||||
if (e.key === 'Escape' && window.parent !== window) {
|
||||
window.parent.postMessage({ type: 'close-fullscreen' }, '*');
|
||||
}
|
||||
});
|
||||
</script>
|
||||
<!-- broken-img-handler -->
|
||||
<script>
|
||||
(function(){
|
||||
if(window.__brokenImgHandler)return;
|
||||
window.__brokenImgHandler=true;
|
||||
var MAX=5,DELAYS=[2000,4000,8000,16000,32000];
|
||||
document.addEventListener('error',function(e){
|
||||
var img=e.target;
|
||||
if(!img||img.tagName!=='IMG')return;
|
||||
var liveSrc=img.getAttribute('src');
|
||||
var src=img.dataset.haOriginalSrc||liveSrc;
|
||||
if(!src)return;
|
||||
if(img.dataset.haOriginalSrc&&liveSrc&&liveSrc!==img.dataset.haOriginalSrc&&liveSrc.indexOf('_r=')<0){src=liveSrc;img.dataset.haOriginalSrc=src;img.dataset.haRetryCount='0'}
|
||||
else if(!img.dataset.haOriginalSrc){img.dataset.haOriginalSrc=src}
|
||||
var attempt=parseInt(img.dataset.haRetryCount||'0',10);
|
||||
if(img.dataset.haPhId){var old=document.getElementById(img.dataset.haPhId);if(old)old.remove()}
|
||||
var ph=document.createElement('div');
|
||||
ph.className='ha-img-placeholder'+(attempt>=MAX?' ha-failed':'');
|
||||
ph.id='ha-ph-'+Math.random().toString(36).slice(2,9);
|
||||
var w=img.getAttribute('width');var h=img.getAttribute('height');
|
||||
if(w)ph.style.width=w+(isNaN(Number(w))?'':'px');
|
||||
else if(img.style.width)ph.style.width=img.style.width;
|
||||
else if(img.width>1)ph.style.width=img.width+'px';
|
||||
if(h)ph.style.height=h+(isNaN(Number(h))?'':'px');
|
||||
else if(img.style.height)ph.style.height=img.style.height;
|
||||
else if(img.height>1)ph.style.height=img.height+'px';
|
||||
ph.textContent=attempt>=MAX?'Image unavailable':'Loading image\u2026';
|
||||
img.dataset.haPhId=ph.id;
|
||||
if(img.dataset.haOrigDisplay==null)img.dataset.haOrigDisplay=img.style.display||'';
|
||||
img.style.display='none';
|
||||
img.insertAdjacentElement('afterend',ph);
|
||||
if(attempt<MAX){
|
||||
img.dataset.haRetryCount=String(attempt+1);
|
||||
setTimeout(function(){
|
||||
if(!img.isConnected)return;
|
||||
if(img.dataset.haOriginalSrc!==src)return;
|
||||
if(img.complete&&img.naturalWidth>0)return;
|
||||
var curSrc=img.getAttribute('src');
|
||||
if(curSrc&&curSrc.indexOf(src)!==0)return;
|
||||
var fresh=src+(src.indexOf('?')>=0?'&':'?')+'_r='+(attempt+1)+'_'+Date.now();
|
||||
img.src=fresh;
|
||||
},DELAYS[attempt]);
|
||||
}
|
||||
},true);
|
||||
document.addEventListener('load',function(e){
|
||||
var img=e.target;
|
||||
if(!img||img.tagName!=='IMG')return;
|
||||
if(img.dataset.haPhId){
|
||||
var ph=document.getElementById(img.dataset.haPhId);
|
||||
if(ph)ph.remove();
|
||||
delete img.dataset.haPhId;
|
||||
img.style.display=img.dataset.haOrigDisplay||'';
|
||||
delete img.dataset.haOrigDisplay;
|
||||
delete img.dataset.haOriginalSrc;
|
||||
delete img.dataset.haRetryCount;
|
||||
}
|
||||
},true);
|
||||
})();
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user