Welcome Guest! You need to login or register to make posts.

Notification

Icon
Error

Options
Go to last post Go to first unread
Traxus  
#1 Posted : Thursday, September 22, 2011 11:25:22 AM(UTC)
Traxus

Rank: Newbie

Groups: Member
Joined: 9/9/2011(UTC)
Posts: 6

Was thanked: 1 time(s) in 1 post(s)
I'm looking for a way to automatically crop an image down into a perfect square (rather than maintaining the aspect ratio), using the smallest dimension (width in a portrait, height in a landscape)...

It is easier for me to explain this by showing you:

if this image is uploaded:

UserPostedImage

i want a thumbnail to come out like this:

UserPostedImage

In other words, re size the photo so that the smallest dimension becomes 100% of the square size, and then crop the remainder from the larger dimension so that it in fact becomes a perfect square.

I do this because it is a lot easier to layout a gallery page when the thumbnails are all square.

I will be uploading alot of images, and would rather not do this manually...


Thanks
Dmitry.Obukhov  
#2 Posted : Thursday, September 22, 2011 6:19:01 PM(UTC)
Dmitry.Obukhov

Rank: Advanced Member

Groups: Member
Joined: 5/29/2010(UTC)
Posts: 1,310

Thanks: 8 times
Was thanked: 111 time(s) in 111 post(s)
Hello Nicolas,

Thank you for your question. Please read Automatic Cropping section.

If you have any questions about it please let me know.
Best regards,
Dmitry Obukhov
Technical Support. Aurigma, Inc.
Traxus  
#3 Posted : Thursday, September 22, 2011 7:53:18 PM(UTC)
Traxus

Rank: Newbie

Groups: Member
Joined: 9/9/2011(UTC)
Posts: 6

Was thanked: 1 time(s) in 1 post(s)
Okay, I had a difficult time understanding the relationship between crop bounds and thumbnail size the first couple of times...

The way to do this is to first crop the image into a perfect square that is the size of the smallest size, this is set in the javascript, beforeUpload:

Code:
function beforeUploadHandler(){
    var count = $au.uploader('Upload1').files().count();
    for (var i=0; i < count; i++) {
        var $file = $au.uploader('Upload1').files().get(i);
		var squareSize;
		if ($file.width() < $file.height()) {
			squareSize = $file.width();
		} else {
			squareSize = $file.height();
		}
		var cropBounds = [0, 0, squareSize, squareSize];
        $file.cropBounds(cropBounds);
    }
}



Then, re size the now square image to the desired thumbnail size with a converter:


Code:
	$converter2 = new Converter();
	$converter2->setMode('*.*=Thumbnail');
	$converter2->setThumbnailHeight(125);
	$converter2->setThumbnailWidth(125);
	$converter2->setThumbnailFitMode("Fit");
	$converter2->setThumbnailApplyCrop(true);

Dmitry.Obukhov  
#4 Posted : Thursday, September 22, 2011 8:28:32 PM(UTC)
Dmitry.Obukhov

Rank: Advanced Member

Groups: Member
Joined: 5/29/2010(UTC)
Posts: 1,310

Thanks: 8 times
Was thanked: 111 time(s) in 111 post(s)
Yes, Image Uploader crops images first, and then resizes it. I checked your code - it is fine.
Best regards,
Dmitry Obukhov
Technical Support. Aurigma, Inc.
Users browsing this topic
Forum Jump  
You cannot post new topics in this forum.
You cannot reply to topics in this forum.
You cannot delete your posts in this forum.
You cannot edit your posts in this forum.
You cannot create polls in this forum.
You cannot vote in polls in this forum.