Skip to content

Add rotation to image and video previews - #1873

Merged
osyed merged 1 commit into
mainfrom
codex/1867-media-viewer-rotation
Nov 5, 2026
Merged

osyed merged 1 commit into
mainfrom
codex/1867-media-viewer-rotation

Conversation

@dnlbui

@dnlbui dnlbui commented Nov 4, 2026 •

Copy link
Copy Markdown
Contributor

What Changed

Add a keyboard-accessible Rotate clockwise button opposite Back in the image and video viewer. It follows the existing header hide and reveal behavior and leaves room for the filename.

  • Fit and center the preview on each quarter turn. Images start each turn at fit zoom, then support zoom and pan in the new orientation.
  • Keep the same video source and playback state. Leave enough space for rotated native controls to clear the overlay header.

Fixed Flow

  1. Open an attachment preview and activate Rotate clockwise once for each quarter turn.
  2. Use the image zoom controls or the video's native controls in the new orientation.
  3. Complete four turns to restore the original orientation, or close or replace the preview to reset it. The attachment and downloaded bytes are preserved.

Demo

Recorded in the mobile viewer with synthetic media.

issue-1867-media-viewer-rotation.mp4

Why

The viewer previously had no way to correct an attachment's viewing orientation without leaving the preview.

Validation

Client 98201d9d with companion c756a58 passed all 10 immersive Node cases and four Chromium viewports. The new browser check fails on client baseline 5ab3994d because the Rotate button is missing. A narrow Firefox smoke test passed, including native fullscreen. WebKit could not launch on this host because libwoff1 and libavif16 are missing.

node --check app.js
git diff origin/main...HEAD --check

# From the companion test worktree
WEB_CLIENT_ROOT=/home/bui/.codex/worktrees/9aaa/web-client-v2 \
PLAYWRIGHT_ROOT=/home/bui/shared/liberdus/client-testing/playwright-tests \
MEDIA_PREVIEW_BROWSER=/opt/google/chrome/chrome \
node local-tests/run.mjs issue-1858-immersive-media.test.mjs \
  issue-1858-immersive-media.browser.test.mjs

The adjacent attachment cache ID suite passed. The older issue-1656-full-image-cache, issue-1847-video-preview, and f02-attachment-security suites reproduced the same failures on the baseline and patched revisions.

Companion regression tests

  • Draft test PR #137 targets the published branch of parent PR #124, which provides the existing immersive viewer fixture.
  • The two local-tests/tests/issue-1858-immersive-media*.test.mjs files are on codex/1867-media-rotation-tests at c756a58. See validation above for the tested client revision and results.
  • After the parent test PR merges, rebase this test layer and retarget it to companion main. Rerun the focused tests against client main once the rotation change lands, then record the tested SHA before merging the companion PR.

Related Issues

Closes #1867

@dnlbui
dnlbui marked this pull request as ready for review November 4, 2026 18:29
@osyed
osyed merged commit 8d34916 into main Nov 5, 2026
2 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Add a top-right rotate control to the image/video viewer

2 participants