ForgeImage v1.1: live output previews, resize sliders, visual drag crop#15
Merged
Merged
Conversation
The preview stage now shows the OUTPUT of the active operation, not just the source: resize renders the resized result live (with the preview scale noted), convert renders the actual encoded bytes with the real file size (debounced re-encode on the quality slider), and crop overlays a draggable selection on the image itself — corner handles resize (optionally constrained to 1:1/4:3/16:9/9:16 via the select, which now defaults to Free), the middle moves it, outside is darkened, and the selection size/position reads out live. Resize gains width and height sliders synced two-way with the number inputs (range spans up to 2x the natural size), with aspect lock driving the other axis. The drag geometry is pure and unit-tested (dragCropRect with anchored corners, aspect constraint, min size, and image-bounds clamping; hitCropHandle; fitWithin) — 11 new tests, 30 total for the tool. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01S3TawWUgFWTaTAcrLyEEAa
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Implements the ForgeImage UX feedback:
Live output preview
The stage under the file picker now shows the result of the active operation, not just the source:
Resize sliders
Width and height each get a slider (spanning up to 2× the natural size) synced two-way with a number input. With Lock aspect ratio on, moving either axis drives the other; unlock for free distortion. Current output dimensions read out next to the labels.
Visual crop
The dropdown-driven centered crop is gone. Cropping is now in the image: drag the corner handles to resize, drag the middle to move, with the selection dimensions/position reading out live. The aspect select becomes an optional constraint (Free / 1:1 / 4:3 / 16:9 / 9:16) that snaps the drag.
All drag geometry is pure and unit-tested (
dragCropRect— anchored-corner resizing, aspect constraint, 16px minimum, image-bounds clamping;hitCropHandle;fitWithin): 11 new tests, 30 total, all green. Tool builds clean; layout verified live.🤖 Generated with Claude Code
https://claude.ai/code/session_01S3TawWUgFWTaTAcrLyEEAa
Generated by Claude Code