Lightbox.tsx has no open/close animation, no previous/next, zoom is a single toggle to 100% only for oversized images (54-57), no wheel/pinch zoom, no Copy Image, and a hard-coded backdrop (app.css:4134).
Fix: zoom-in entry; ←/→ through the conversation's media; wheel/pinch zoom with panning; Copy image through main's clipboard (new IPC beside writeClipboardText); token backdrop.
Part of the v1.0 UI pass.
`Lightbox.tsx` has no open/close animation, no previous/next, zoom is a single toggle to 100% only for oversized images (54-57), no wheel/pinch zoom, no Copy Image, and a hard-coded backdrop (app.css:4134).
**Fix:** zoom-in entry; ←/→ through the conversation's media; wheel/pinch zoom with panning; Copy image through main's clipboard (new IPC beside `writeClipboardText`); token backdrop.
_Part of the v1.0 UI pass._
Salastil
added this to the v1.0 milestone 2026-10-07 20:43:19 -04:00
Step through the conversation's media: ←/→ keys or the side arrows move between the pictures and videos of the conversation it was opened from (not wrapping; "2 / 3" in the bar). Thread panel media stay separate from the log's.
Wheel / trackpad-pinch zoom toward the pointer (up to 8×), drag to pan, clamped so the picture can't be lost; click goes to actual size at the pointer and back; +-0 keys; the bar shows the level and the zoom-out / reset / zoom-in controls. Stepping resets the view.
Copy the picture puts it on the system clipboard (new copyImage IPC next to writeClipboardText, using Electron 44's clipboard API; pixels taken from the page where it can read them, otherwise fetched in main).
Grows in from the middle (also for each picture stepped to), honouring reduced motion; the backdrop is the --scrim-strong token.
Tests: gallery.test.ts (page order, scoping, end stops), zoompan.test.ts (zoom about the pointer, clamping, wheel/pinch factors). Behaviour also checked against the running app: arrows, end stops, zoom reset, clipboard receives a PNG, Esc closes.
Before (top), after (bottom) - opened on the middle of three pictures:
Zoomed with the wheel (before: the wheel did nothing):
Finished: [817cb1e](https://git.salastil.com/Salastil/moho/commit/817cb1e6fcd73e4846ea2c47950177a97cb9788b).
The viewer is now a gallery with proper zoom.
- **Step through the conversation's media:** ←/→ keys or the side arrows move between the pictures and videos of the conversation it was opened from (not wrapping; "2 / 3" in the bar). Thread panel media stay separate from the log's.
- **Wheel / trackpad-pinch zoom** toward the pointer (up to 8×), drag to pan, clamped so the picture can't be lost; click goes to actual size at the pointer and back; `+` `-` `0` keys; the bar shows the level and the zoom-out / reset / zoom-in controls. Stepping resets the view.
- **Copy the picture** puts it on the system clipboard (new `copyImage` IPC next to `writeClipboardText`, using Electron 44's clipboard API; pixels taken from the page where it can read them, otherwise fetched in main).
- **Grows in** from the middle (also for each picture stepped to), honouring reduced motion; the backdrop is the `--scrim-strong` token.
- Tests: `gallery.test.ts` (page order, scoping, end stops), `zoompan.test.ts` (zoom about the pointer, clamping, wheel/pinch factors). Behaviour also checked against the running app: arrows, end stops, zoom reset, clipboard receives a PNG, Esc closes.
Before (top), after (bottom) - opened on the middle of three pictures:
Zoomed with the wheel (before: the wheel did nothing):
Blocking a user prevents them from interacting with repositories, such as opening or commenting on pull requests or issues. Learn more about blocking a user.
Lightbox.tsxhas no open/close animation, no previous/next, zoom is a single toggle to 100% only for oversized images (54-57), no wheel/pinch zoom, no Copy Image, and a hard-coded backdrop (app.css:4134).Fix: zoom-in entry; ←/→ through the conversation's media; wheel/pinch zoom with panning; Copy image through main's clipboard (new IPC beside
writeClipboardText); token backdrop.Part of the v1.0 UI pass.
Finished: 817cb1e.
The viewer is now a gallery with proper zoom.
+-0keys; the bar shows the level and the zoom-out / reset / zoom-in controls. Stepping resets the view.copyImageIPC next towriteClipboardText, using Electron 44's clipboard API; pixels taken from the page where it can read them, otherwise fetched in main).--scrim-strongtoken.gallery.test.ts(page order, scoping, end stops),zoompan.test.ts(zoom about the pointer, clamping, wheel/pinch factors). Behaviour also checked against the running app: arrows, end stops, zoom reset, clipboard receives a PNG, Esc closes.Before (top), after (bottom) - opened on the middle of three pictures:
Zoomed with the wheel (before: the wheel did nothing):