This repository has been archived by the owner on Feb 23, 2024. It is now read-only.
Product gallery/add crop images #11482
Merged
Conversation
This file contains 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
roykho
added
type: enhancement
|
The release ZIP for this PR is accessible via: Script Dependencies ReportThere is no changed script dependency between this branch and trunk. This comment was automatically generated by the TypeScript Errors Report
🎉 🎉 This PR does not introduce new TS errors. |
|
Size Change: +10 B (0%) Total Size: 1.53 MB
ℹ️ View Unchanged
|
thealexandrelara
suggested changes
Oct 27, 2023
There was a problem hiding this comment.
Great work, @roykho! I really enjoyed the way you managed to dynamically generate cropped images instead of having to regenerate thumbnails for all of them. I've left some comments about the code.
I also noticed that the cropped image does not appear inside the Product Gallery dialog. I edited the template part related to the Product Gallery full-screen view, but the image is not cropped:
CleanShot.2023-10-27.at.16.35.45.mp4
roykho
force-pushed
the
product-gallery/add-crop-images
branch
from
57aaa24 to
4dfc0b2
Compare
roykho
force-pushed
the
product-gallery/add-crop-images
branch
from
4dfc0b2 to
d07f987
Compare
|
I will do a follow up PR to add e2e tests for this. |
danieldudzic
suggested changes
Oct 30, 2023
There was a problem hiding this comment.
Awesome job, @roykho!
The Crop feature works smoothly and the code is uncomplicated.
I have just one change request, but otherwise, it's excellent!
Please also make sure to include the Changelog message.
thealexandrelara
approved these changes
Oct 30, 2023
danieldudzic
approved these changes
Oct 31, 2023
13 tasks
Sign up for free
to subscribe to this conversation on GitHub.
Already have an account?
Sign in.
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.
What
Fixes #10632
This PR adds the image crop support when the crop images to fit setting is enabled.
Why
Some merchants may want to display only square images uniformly so that we don't get any side effects from images that are different ratios which can cause the gallery slider to shift.
Note
Since the "Crop images to fit" setting is disabled by default, my goal here is to minimize unnecessary processing as much as possible. So my approach here is not to register any sizes by default. Only when the "Crop images to fit" setting is enabled, then it would check if the image attachment had the cropped image size metadata and file and if it doesn't exists, it would generate it "on-the-fly".
The crop size dimension will be determined by the smallest dimension of the original image size.
Testing Instructions
Please consider any edge cases this change may have, and also other areas of the product this may impact.
Screenshots or screencast
WooCommerce Visibility
Required:
Checklist
Required:
[type]label or a[skip-changelog]label.Conditional:
[skip-changelog]label is not present).Changelog