getThumbnail function - fill out dimensions?
Permalink 3 users found helpful
Is there any way to have the "getThumbnail" function "fill out" the dimensions and crop rather instead of sizing the image to fit in one of the dimensions?
Example:
200x300 image, and I ask to resize to 100x100. I'd want to fit the smaller (200px) dimension to the thumbnail, letting the rest of the larger dimension just get cropped.
Possible? I got a little lost in concrete/helpers/image.php
Looks like C5 is using this function to do the work, correct?
imageCopyResampled()
http://php.net/manual/en/function.imagecopyresampled.php...
Example:
200x300 image, and I ask to resize to 100x100. I'd want to fit the smaller (200px) dimension to the thumbnail, letting the rest of the larger dimension just get cropped.
Possible? I got a little lost in concrete/helpers/image.php
Looks like C5 is using this function to do the work, correct?
imageCopyResampled()
http://php.net/manual/en/function.imagecopyresampled.php...
Interesting, I've been thinking about this too. I like the way SlideShowPro Director handles this from the UI standpoint. They let the user drag a semi-transparent 'focal point' over the image. See here:http://slideshowpro.net/products/slideshowpro_director/#features...
Maybe jquery dragdrop could be used for this...
I think you're right, it might not be too hard to extend the image helper to add a new function that takes advantage of the cropping ability of imagecopyresampled()
Maybe jquery dragdrop could be used for this...
I think you're right, it might not be too hard to extend the image helper to add a new function that takes advantage of the cropping ability of imagecopyresampled()
I've been thinking of implementing the imgAreaSelect jQuery plugin for somewhat the same functionality. Some examples can be found here:
http://odyniec.net/projects/imgareaselect/examples.html...
As you can see in the examples, you can define exact size for the thumbnail or just use the desired aspect ratio.
http://odyniec.net/projects/imgareaselect/examples.html...
As you can see in the examples, you can define exact size for the thumbnail or just use the desired aspect ratio.
It might be nice to just add another parameter to the getThumbnail function - anything currently using it would see no difference, but if someone needed to crop functionality in their module it would be available.
I'm going to take a stab at it and see what happens... I'm hoping to add this to the Pro Photo module (which relies on getThumbnail).
I'm going to take a stab at it and see what happens... I'm hoping to add this to the Pro Photo module (which relies on getThumbnail).
i did this for a site a while ago so if you're interested i could upload the two files i modified for it. i basically extended a helper and modified the image library file. the interface is a function that specifies thumbnail dimensions and a bool crop/don't crop.
the "bad" thing about this solution is of course that 1. it won't let you to choose where to crop, 2, all images uploaded will go through this thumbnail generation.
the "bad" thing about this solution is of course that 1. it won't let you to choose where to crop, 2, all images uploaded will go through this thumbnail generation.
It would be great if an image cropping helper were part of the core. To keep it simple, it could just center on the image (although I love the SSP Director method as well).
I created a fork of the Image block that allows for cropping (using CSS), but I haven't tested it extensively:http://www.concrete5.org/community/forums/block_requests/image-bloc...
A server-side crop would be ideal.
I created a fork of the Image block that allows for cropping (using CSS), but I haven't tested it extensively:http://www.concrete5.org/community/forums/block_requests/image-bloc...
A server-side crop would be ideal.
Wow, I never saw that jquery plugin before -- that's awesome.
I bet even just a simple improved image block would be really helpful to people -- does the same thing as the built-in image block, but adds this cropping functionality to it.
Would be great if this was in the file manager, though. I personally dislike that "Edit" link that goes to Piknik -- I can never get it to work and my less-savvy clients are very confused by it. But I always thought it would be great if that could just link to a resizer/cropper, as that's 90% of the editing that needs to take place generally.
EDIT: @kirkroberts posted his response as I was writing mine -- guess we're on the same page here :)
I bet even just a simple improved image block would be really helpful to people -- does the same thing as the built-in image block, but adds this cropping functionality to it.
Would be great if this was in the file manager, though. I personally dislike that "Edit" link that goes to Piknik -- I can never get it to work and my less-savvy clients are very confused by it. But I always thought it would be great if that could just link to a resizer/cropper, as that's 90% of the editing that needs to take place generally.
EDIT: @kirkroberts posted his response as I was writing mine -- guess we're on the same page here :)
I think all the tools are laid out here for someone to make a true cropping Image block for the marketplace. Any takers?
I'm all over that -- but I don't have time right now. If no one else pursues it in the next week or two, I can definitely take care of it then.
If someone else does want to take a crack at this, I have some code for an image gallery addon I made that might be helpful for showing how to use ajax in a block editing interface (it was submitted to the marketplace 2 weeks ago but hasn't been approved yet so I don't know what's going on there -- but I can send it to you or post it here if desired).
-Jordan
If someone else does want to take a crack at this, I have some code for an image gallery addon I made that might be helpful for showing how to use ajax in a block editing interface (it was submitted to the marketplace 2 weeks ago but hasn't been approved yet so I don't know what's going on there -- but I can send it to you or post it here if desired).
-Jordan
i'm thinkin about it. just tryin to figure out how people would want it.
to me it makes the most sense have everything handled in the file manager, and not in the front end.
i.e what jordanlev mentioned, have some kind of edit item show up when selecting pictures, ideally also when uploading pictures. the only problem with this is that it would be so mixed up with the core that any future concrete update might break it. maybe if you create a separate tab in the filemanager though to achieve more of a low coupling..
either way, the only way to make efficient use of this, the image object would have to be extended to expose a few more thumbnail src pointers..
to me it makes the most sense have everything handled in the file manager, and not in the front end.
i.e what jordanlev mentioned, have some kind of edit item show up when selecting pictures, ideally also when uploading pictures. the only problem with this is that it would be so mixed up with the core that any future concrete update might break it. maybe if you create a separate tab in the filemanager though to achieve more of a low coupling..
either way, the only way to make efficient use of this, the image object would have to be extended to expose a few more thumbnail src pointers..
I agree that it would be awesome to have this in the file manager, it's just a much more ambitious project than a simple image block.
If you do want to try to work on this, though, I'd be happy to help. Perhaps a cleaner approach (that doesn't get tangled up in the core too much) would be to add a "Crop..." option to the action menu when you click an image in the file manager. Choosing this would bring up a new dialog box with the image cropping javascript. When it's saved, the user can choose to either overwrite the existing image or to save a copy as a new image. Then we either replace the existing image with the new cropped one or save a new image to the system. In this way, we don't have to mess with saving the crop coordinates anywhere or worry about how to display the cropped image -- it's just an image like any other one.
Just one of many possible approaches...
-Jordan
If you do want to try to work on this, though, I'd be happy to help. Perhaps a cleaner approach (that doesn't get tangled up in the core too much) would be to add a "Crop..." option to the action menu when you click an image in the file manager. Choosing this would bring up a new dialog box with the image cropping javascript. When it's saved, the user can choose to either overwrite the existing image or to save a copy as a new image. Then we either replace the existing image with the new cropped one or save a new image to the system. In this way, we don't have to mess with saving the crop coordinates anywhere or worry about how to display the cropped image -- it's just an image like any other one.
Just one of many possible approaches...
-Jordan
While it would be great if an editor could crop their own images, what I'm really hungry for is the ability to use a getThumbnail type function behind the scenes that adds the ability to fill the box (crop to fit).
Perhaps this is a model extension? Seems like it would be pretty simple to create but I haven't sat down to do it yet. And someone else could probably do it better, anyway :-)
EDIT: I'd be perfectly happy if the crop centers on the image... the goal is to fill a predefined space to prevent breaking the design.
Perhaps this is a model extension? Seems like it would be pretty simple to create but I haven't sat down to do it yet. And someone else could probably do it better, anyway :-)
EDIT: I'd be perfectly happy if the crop centers on the image... the goal is to fill a predefined space to prevent breaking the design.
Kirk,
Why is cropping the image more desirable than just resizing it to fit in the desired dimensions?
Why is cropping the image more desirable than just resizing it to fit in the desired dimensions?
Because if I'm coding a design that requires an image to be certain dimensions (eg a thumbnail that must be 100 x 100 pixels) I want an editor to be able to upload an image of any proportion and have it cropped to fit in the allotted space. Does that make sense?
Imagine a page of thumbnails for a photo portfolio and some are horizontal and some vertical when really I wanted them all to be square and cropped to fit.
Imagine a page of thumbnails for a photo portfolio and some are horizontal and some vertical when really I wanted them all to be square and cropped to fit.
Ahh, yes I see now -- that makes total sense.
I agree that in this situation it would be best to have something similar to the getThumbnail function. And I'm guessing you don't want to just write your own function to do this because you'd be missing out on the caching that getThumbnail() does for you?
I agree that in this situation it would be best to have something similar to the getThumbnail function. And I'm guessing you don't want to just write your own function to do this because you'd be missing out on the caching that getThumbnail() does for you?
Yes, the caching is a nice benefit.
But the real reason I haven't done it yet is because I've been hoping someone else would and share it :-)
Also hoping that this will become a core function... seems like it should be!
Maybe someone can write it and submit it to the core team for potential inclusion?
But the real reason I haven't done it yet is because I've been hoping someone else would and share it :-)
Also hoping that this will become a core function... seems like it should be!
Maybe someone can write it and submit it to the core team for potential inclusion?
> Yes, the caching is a nice benefit.
> But the real reason I haven't done it yet is because I've > been hoping someone else would and share it :-)
I'm pretty useless with php OO stuff, but I'm going to be trying it anyhow since I need it. Adding another arg to the function and defaulting the crop to off should ensure no existing stuff gets broken.
FWIW, in my case this is a design issue - have a grid of thumbnails, some images are horizontal, some vertical. When viewed full size they need to be shown uncropped, but our thumbnail grid is based on having 16 square thumbnails/page. Visually it looks untidy if they are not all square...
> But the real reason I haven't done it yet is because I've > been hoping someone else would and share it :-)
I'm pretty useless with php OO stuff, but I'm going to be trying it anyhow since I need it. Adding another arg to the function and defaulting the crop to off should ensure no existing stuff gets broken.
FWIW, in my case this is a design issue - have a grid of thumbnails, some images are horizontal, some vertical. When viewed full size they need to be shown uncropped, but our thumbnail grid is based on having 16 square thumbnails/page. Visually it looks untidy if they are not all square...
spork,
Thanks for trying this. Don't worry about the "OO stuff" -- there's not much to it in this case.
Just copy the concrete/helpers/image.php file to helpers/image.php, then change the line at the top "class ImageHelper {" to "class SiteImageHelper extends ImageHelper {", and just modify the functions in there as you see fit.
Thanks for trying this. Don't worry about the "OO stuff" -- there's not much to it in this case.
Just copy the concrete/helpers/image.php file to helpers/image.php, then change the line at the top "class ImageHelper {" to "class SiteImageHelper extends ImageHelper {", and just modify the functions in there as you see fit.
The way the file manager works, it'd be easy for someone to swap out the picnik editing interface for a custom interface that edits images. I think that'd be a better place for the tools than a custom image block (although that may not be true - since it would work on the original image. Maybe there's room for both.)
I love picnik but if someone has issues with flash or their platform doesn't work well with flash it might be a problem
I love picnik but if someone has issues with flash or their platform doesn't work well with flash it might be a problem
cherrycake,
Can you post this code here so we can take a look? I'm curious why this would apply to every uploaded file -- couldn't it just be triggered with a call to the helper function?
Thanks!
-Jordan
Can you post this code here so we can take a look? I'm curious why this would apply to every uploaded file -- couldn't it just be triggered with a call to the helper function?
Thanks!
-Jordan
Im a big fan of phmagick over athttp://www.francodacosta.com/blog/phmagick...
Does concrete use ImageMagick?
Phmagick does a lot of this functionality with cropping images to fit, it can also do an ifnotexist style function before cropping/resizing.
Does concrete use ImageMagick?
Phmagick does a lot of this functionality with cropping images to fit, it can also do an ifnotexist style function before cropping/resizing.
Hey guys,
I've made an updated image helper class that includes optional cropping functionality (I based it off of the functionality of my Deluxe Image Gallery addon --http://www.concrete5.org/marketplace/addons/deluxe-image-gallery/... ).
To use it, unzip the attached file and drop it into your site's "helpers" directory (NOT "concrete/helpers"), then in situations where you'd call the image helper's create(), getThumbnail(), or outputThumbnail() function, you can pass in a new optional boolean parameter for cropping (check out the code for full details). For example, if you pass in an image having dimensions of 400px wide by 600px tall:
...you will wind up with a 100px by 100px image (the last argument of "true" tells it to crop). The image would first be scaled down to 100px x 150px (which is as small as it can scale proportionally before going smaller than the given crop width/height), THEN the remaining 50 px of height will be cropped off (it attempts to center the image, although it is sometimes a little bit off -- but usually good enough).
The cropping functionality is optional -- you can simply not pass in the final argument (or could pass in FALSE) and it should behave exactly like the image helper currently does.
Please test this out and let me know if you run into any problems. Hopefully we can get this rolled into core some time soon.
Thanks!
-Jordan
I've made an updated image helper class that includes optional cropping functionality (I based it off of the functionality of my Deluxe Image Gallery addon --http://www.concrete5.org/marketplace/addons/deluxe-image-gallery/... ).
To use it, unzip the attached file and drop it into your site's "helpers" directory (NOT "concrete/helpers"), then in situations where you'd call the image helper's create(), getThumbnail(), or outputThumbnail() function, you can pass in a new optional boolean parameter for cropping (check out the code for full details). For example, if you pass in an image having dimensions of 400px wide by 600px tall:
$ih = Loader::helper('image'); $thumb = $ih->getThumbnail($fileObj, 100, 100, true);
...you will wind up with a 100px by 100px image (the last argument of "true" tells it to crop). The image would first be scaled down to 100px x 150px (which is as small as it can scale proportionally before going smaller than the given crop width/height), THEN the remaining 50 px of height will be cropped off (it attempts to center the image, although it is sometimes a little bit off -- but usually good enough).
The cropping functionality is optional -- you can simply not pass in the final argument (or could pass in FALSE) and it should behave exactly like the image helper currently does.
Please test this out and let me know if you run into any problems. Hopefully we can get this rolled into core some time soon.
Thanks!
-Jordan
Woohoo! I haven't tried the new helper yet but I'm so happy this exists now. Thanks, Jordan!
Awesome, this is exactly what I was looking for.
Where's Tony at? I'd love to see his modules take advantage of this. :)
Thanks,
Charles
Where's Tony at? I'd love to see his modules take advantage of this. :)
Thanks,
Charles
Can I suggest making it a constant in the ImageHelper. Just having 'true' doesn't make for very readable code.
The call would then become:
The call would then become:
$ih = Loader::helper('image'); $thumb = $ih->getThumbnail($fileObj, 100, 100, ImageHelper::CROP_IMAGE);
Updated Jordan's code:
- changed $crop argument to be an array $props ... this makes calling it a little clunkier but will allow for better readability a la jaredquinn's comment, and open-ended scalability
- added a quality parameter so you can dictate a quality per call, 1 - 100
- fixed the centering code so cropped images center properly (you can just grab that part of the code if you don't want to switch to using the $props array)
So a call could be
The optional quality setting overrides the default setting in config/site.php
Everything else should work just as Jordan's code did, including the backwards compatibility and use of caching. (see his post above for implementation guidelines)
Let me know if you run into any issues so I can update the code!
- changed $crop argument to be an array $props ... this makes calling it a little clunkier but will allow for better readability a la jaredquinn's comment, and open-ended scalability
- added a quality parameter so you can dictate a quality per call, 1 - 100
- fixed the centering code so cropped images center properly (you can just grab that part of the code if you don't want to switch to using the $props array)
So a call could be
$ih = Loader::helper('image'); $thumb = $ih->getThumbnail($fileObj, 100, 100, array('crop'=>true, 'quality'=>60));
The optional quality setting overrides the default setting in config/site.php
Everything else should work just as Jordan's code did, including the backwards compatibility and use of caching. (see his post above for implementation guidelines)
Let me know if you run into any issues so I can update the code!
Cool!
I'm curious -- what purpose does the quality setting serve? Not saying it isn't useful -- just wondering what it is because I've never had to degrade image quality before.
Thanks.
I'm curious -- what purpose does the quality setting serve? Not saying it isn't useful -- just wondering what it is because I've never had to degrade image quality before.
Thanks.
there's a constant for it, and it doesn't seem to do much I have a client that does have issues with it with resizing thumbnails of people's faces, we're going to try out imageMagick(sp) instead of GD to see if that will solve it.
we tried 100, no improvement, 0, it degraded it.
we tried 100, no improvement, 0, it degraded it.
ScottC: I'm really surprised 100 didn't show a quality increase... it did for me (I ended up using closer to 95 to shave off a bit of filesize). Background areas of solid color that had lots of artifacts totally cleared up. Sorry this wasn't the answer for you, too. I'm doing a dance of joy to have solved this issue that's bugged me for quite a while. I hope you find your solution quickly.
Also surprised 0 did anything at all... I would have thought that would equate to a false boolean and ignored the quality setting... but I guess that just shows my real coding knowledge :-)
Also surprised 0 did anything at all... I would have thought that would equate to a false boolean and ignored the quality setting... but I guess that just shows my real coding knowledge :-)
In Photoshop there is a "Save for web..." function that lets you choose a quality setting for your jpg, 0 - 100. This affects how much the image is compressed... 100 is essentially no compression, and 0 is lots and lots (and the image will be very artifact-y).
Concrete5 has a constant of 80 set in /concrete/config/site.php ( AL_THUMBNAIL_JPEG_COMPRESSION ). I believe you can override this in /config/site.php if you want to globally change it.
I have projects where the default of 80 is either too high or too low. In this case the client is uploading already optimized images. If I resize them and reoptimize the images look bad. So I'll use a quality of 100 to attempt to minimize further optimization when resizing. I like having the control to do that to varying degrees here or there :-)
EDIT: I found that using 95 quality did the trick without adding too much filesize.
By the way, using Photoshop the sweet spot is usually 60 - 70 quality. Don't know why the c5 default of 80 sometimes looks bad. That should be more than enough to look good. As ScottC suggests it may have to do with image library in use.
Concrete5 has a constant of 80 set in /concrete/config/site.php ( AL_THUMBNAIL_JPEG_COMPRESSION ). I believe you can override this in /config/site.php if you want to globally change it.
I have projects where the default of 80 is either too high or too low. In this case the client is uploading already optimized images. If I resize them and reoptimize the images look bad. So I'll use a quality of 100 to attempt to minimize further optimization when resizing. I like having the control to do that to varying degrees here or there :-)
EDIT: I found that using 95 quality did the trick without adding too much filesize.
By the way, using Photoshop the sweet spot is usually 60 - 70 quality. Don't know why the c5 default of 80 sometimes looks bad. That should be more than enough to look good. As ScottC suggests it may have to do with image library in use.
Aha, that makes a lot of sense. Thank you for the great answer.
Some basic gotchas for those using the quality setting. These may be common knowledge, but just in case:
- make sure your image is a jpg: the quality setting doesn't affect gifs or pngs
- make sure your original is of high enough quality: the quality setting won't improve your image... essentially a 100 setting is the same as your original image
- make sure your image is a jpg: the quality setting doesn't affect gifs or pngs
- make sure your original is of high enough quality: the quality setting won't improve your image... essentially a 100 setting is the same as your original image
Using the image helper extension in a custom gallery block I am making. It works great except that when I use a variable for the width and height that maps to a database value(from a form in the add/edit template) it seems to crash. Maybe this has something to do with the field type I've specified?
Can you please zip up your custom block and post it here (or email it to me directly if you don't want to share it publicly -- concrete@jordanlev.com )?
I'd need to take a look at your code to see why it might not be working.
Thanks.
-Jordan
I'd need to take a look at your code to see why it might not be working.
Thanks.
-Jordan
I am trying to implement this in a custom template for the page list block. How exactly would I call an image from a custom attribute to implement the cropping functionality? Currently I call it like this:
<?php $lfb = LibraryFileBlockController::getFile($cobj->getAttribute('instructor_pic')->fID); echo $lfb->getThumbnail(150,300)->src ?>
Assuming you downloaded the most recent version from kirkroberts' reply, and dropped the helper file into your site's top-level "helpers' directory, this should work:
Alternatively, if you want the html 'img' tag to be different than what the helper outputs, you can do this:
-Jordan
<?php $ih = Loader::helper('image'); $img = $cobj->getAttribute('instructor_pic'); $ih->outputThumbnail($img, 150, 300, array('crop' => true), 'My Alt Text'); ?>
Alternatively, if you want the html 'img' tag to be different than what the helper outputs, you can do this:
-Jordan
Thanks Jordan - this worked great! Only problem in your code was that it should be Loader::helper (not helpers). Might want to edit that for anyone else that might need to use it.
On another note: Anyone know why the new image helper file placed in a package doesn't overwrite the core one?
On another note: Anyone know why the new image helper file placed in a package doesn't overwrite the core one?
Fixed (thanks).
I don't know what the architectural reasoning behind it is, but I do know that it's intentional that package elements don't automatically override the core. If you want to use them, you have to pass the package's handle as a second argument to Loader::helper(). For example:
I don't know what the architectural reasoning behind it is, but I do know that it's intentional that package elements don't automatically override the core. If you want to use them, you have to pass the package's handle as a second argument to Loader::helper(). For example:
$ih = Loader::helper('image', 'my_package_handle');
Hmmm, good to know. Thanks!
Jordan,
Passing in the package handle doesn't seem to work (it doesnt crop the images). I've got the image.php helper file uploaded to /packages/package_handle/helpers.
Any ideas why?
Passing in the package handle doesn't seem to work (it doesnt crop the images). I've got the image.php helper file uploaded to /packages/package_handle/helpers.
Any ideas why?
Not sure -- can you post the custom template so I can look at the code? (You'll need to ZIP it first or forums won't let you upload it).
Also, give me the exact name of the package handle (and double-check that the folder name is exactly the same and that the handle declared in your package's controller.php file is exactly the same as well). Also, can you verify for me that you're using Kirk's latest version of this file, as opposed to my earlier version (because the function calls are slightly different between the two)?
Also, give me the exact name of the package handle (and double-check that the folder name is exactly the same and that the handle declared in your package's controller.php file is exactly the same as well). Also, can you verify for me that you're using Kirk's latest version of this file, as opposed to my earlier version (because the function calls are slightly different between the two)?
Jordan, the custom page list template is attached along with my package controller file and screenshot of the package structure on my server. And yes I'm using Kirk's version.
Are you just dropping the helper file into your site's "helpers" directory, or are you trying to include this in with a package?
If the former, you need to change this line:
to this:
If the latter, you need to change this at the top of your image.php helper file:
to this:
You have to choose one method or the other -- you can't combine both.
-Jordan
If the former, you need to change this line:
$ih = Loader::helper('image', 'theme_bounce');
to this:
$ih = Loader::helper('image');
If the latter, you need to change this at the top of your image.php helper file:
class SiteImageHelper extends ImageHelper {
to this:
class ImageHelper {
You have to choose one method or the other -- you can't combine both.
-Jordan
The latter. And that fixed it. Thanks Jordan!
Jordan,
I included this new image helper in a package of mine (http://www.concrete5.org/marketplace/addons/featured-content-slider/) and some people are getting this error when adding the addon to their page:
Do you know what I can do so that this ImageHelper class doesnt conflict with any others they might have installed? I can send/grant you a copy of the addon so you can take a look.
I included this new image helper in a package of mine (http://www.concrete5.org/marketplace/addons/featured-content-slider/) and some people are getting this error when adding the addon to their page:
Fatal error: Cannot redeclare class ImageHelper in packages/c5mix_featured_content_slider/helpers/image.php on line 28
Do you know what I can do so that this ImageHelper class doesnt conflict with any others they might have installed? I can send/grant you a copy of the addon so you can take a look.
change the name to featured_image or something like that and use FeaturedImageHelper as the class- it is an issue with another file already having that class.
I agree with 12345J's solution. Let me know if you need more help getting that working.
12345j,
Seems to work great. Thanks for the solution!
Seems to work great. Thanks for the solution!
Someone created an image helper that allows you to pass a crop variable into the getThumbnail($width, $height, $crop);
Ill see if I can find the thread
never mind pipped to the post,
but Jordan has posted the info :)
The thread is here for where Kirk suggest a nice method with the margin,
http://www.concrete5.org/community/forums/block_requests/image-bloc...
:link removed:
Ill see if I can find the thread
never mind pipped to the post,
but Jordan has posted the info :)
The thread is here for where Kirk suggest a nice method with the margin,
http://www.concrete5.org/community/forums/block_requests/image-bloc...
:link removed:
uhh... this *is* that thread :)
:doh:
I blame it on the teething baby and sleepless nights :P
cleaned up my previous post..
I blame it on the teething baby and sleepless nights :P
cleaned up my previous post..
EDIT: whoops, I'm also not sleeping enough.
You *have* to use the image helper, like Jordan suggests.
Note there are (at least) two versions of the image helper in this thread.
The other uses ($width, $height, true) to indicate cropping.
Not sure which one will be implemented in the next core release.
You *have* to use the image helper, like Jordan suggests.
Note there are (at least) two versions of the image helper in this thread.
The other uses ($width, $height, true) to indicate cropping.
Not sure which one will be implemented in the next core release.
What does the LibraryFileBlockController::getFile() call do? (I always just use $c->getAttribute() and it returns the image object)
Not sure. I'm not much of an actual programmer - I just grabbed that code from some other post or something :)
Any idea on how to implement this on a block that uses the html helper to pull the images?
Thanks
Thanks
I'm not sure what you mean by "uses the html helper to pull the images" -- can you post some code?
Also I have included this cropping helper in the most recent version of the Designer Content addon, so depending on what kind of block you're making, that might be a good solution:
http://concrete5.org/marketplace/addons/designer-content...
-Jordan
Also I have included this cropping helper in the most recent version of the Designer Content addon, so depending on what kind of block you're making, that might be a good solution:
http://concrete5.org/marketplace/addons/designer-content...
-Jordan
Very nice! Is there a reason why concrete5 as not implemented your code in the core? I mean, it's a very essential feature.
whelp, last core release was november 19th...
but that aside, my concerns would be
A) does it require additional stuff to be installed on the server? We already include a lot of libraries and requirements so that's always a concern..
B) does it really do something that Picnik doesnt effectively? If we can use it under hood in a graceful way to re-size without the user knowing it when they need to, that'd be awesome. But I'm not really into the whole "Pick which of these 7 different options you want for this task" approach to things..
Mostly the first item tho. there hasn't been a core release so it hasn't really shown up on our radar as a debate to have yet.
but that aside, my concerns would be
A) does it require additional stuff to be installed on the server? We already include a lot of libraries and requirements so that's always a concern..
B) does it really do something that Picnik doesnt effectively? If we can use it under hood in a graceful way to re-size without the user knowing it when they need to, that'd be awesome. But I'm not really into the whole "Pick which of these 7 different options you want for this task" approach to things..
Mostly the first item tho. there hasn't been a core release so it hasn't really shown up on our radar as a debate to have yet.
Hey Franz,
I think he's just referring to the library code that a module developer could use to implement cropping (which doesn't require any additional libraries to be loaded -- it's using the same stuff that the current image helper is already using to do resizing).
I think he's just referring to the library code that a module developer could use to implement cropping (which doesn't require any additional libraries to be loaded -- it's using the same stuff that the current image helper is already using to do resizing).
Actually, I asked Andrew about this recently and he said it's in there for the next release.
Nice Jordan!
Yes Franz, only the library helper i'm talking about. :-)
Yes Franz, only the library helper i'm talking about. :-)
In case anyone is interested, I'm in the process of building a lightweight image editor that lets you visually choose the crop rectangle:
http://www.concrete5.org/community/forums/customizing_c5/new-lightw...
http://www.concrete5.org/community/forums/customizing_c5/new-lightw...
Hi there Jordan et all,
The script that Jordan created and then Kirk edited is exactly what I need. Generate thumbnail on the fly,
Just tried to get this working and I get an error. I know it will be something easy but my brian is pickle.
error: Fatal error: Call to a member function getAttribute() on a non-object in /Applications/MAMP/htdocs/concrete_CPL/blocks/page_list/templates/project_nav.php on line 35
1) I have added Kirk's image.php into the helpers folder
2) Added
at the top of the doc
3) Added
Is there somewhere I am going wrong?
Thanks in advance
D!!
p.s added file for ease
The script that Jordan created and then Kirk edited is exactly what I need. Generate thumbnail on the fly,
Just tried to get this working and I get an error. I know it will be something easy but my brian is pickle.
error: Fatal error: Call to a member function getAttribute() on a non-object in /Applications/MAMP/htdocs/concrete_CPL/blocks/page_list/templates/project_nav.php on line 35
1) I have added Kirk's image.php into the helpers folder
2) Added
$ih = Loader::helper('image'); $img = $cobj->getAttribute('project_thumb');
at the top of the doc
3) Added
Is there somewhere I am going wrong?
Thanks in advance
D!!
p.s added file for ease
First off, if you're using Concrete5.4.2 or higher, the base system now includes this cropping functionality so you only need to include the file referenced in this forum post if you're using 5.4.1.1 or lower.
As for your specific problem, it doesn't actually have anything to do with the image helper. You need to move your "$img = $cobj->getAttribute('project_thumb');" code so it's inside the foreach loop. Move that line so it's below "$title = $cobj->getCollectionName();" and you should be good.
Cheers,
Jordan
As for your specific problem, it doesn't actually have anything to do with the image helper. You need to move your "$img = $cobj->getAttribute('project_thumb');" code so it's inside the foreach loop. Move that line so it's below "$title = $cobj->getCollectionName();" and you should be good.
Cheers,
Jordan
Please excuse my stupidity, and my re-opening of an old thread but...
This looks likely to address my problem - a need to crop thumbnails to a uniform size, but can I use this with, say, Fancybox Gallery or similar? If so, how exactly do I do it please?
I know there are commercial galleries to do this, but I feel I've spent enough on addons for a while.
Thanks for your time!
This looks likely to address my problem - a need to crop thumbnails to a uniform size, but can I use this with, say, Fancybox Gallery or similar? If so, how exactly do I do it please?
I know there are commercial galleries to do this, but I feel I've spent enough on addons for a while.
Thanks for your time!
DanDiggler, have you used this code, or something similar to meet your needs?
(untested, but should work)
$ih = Loader::helper('image'); $thumb = $ih->getThumbnail($fileObj, 100, 100, true); // for cropped 100px x 100px image echo '<img src="' . $thumb->src . '" alt="">';
(untested, but should work)
Thanks for your reply. I couldn't figure out where to place it.
Somewhere either in view.php or controller.php of your block there should be similar code that is using getThumbnail. You can modify that to suit your needs (changing dimensions and/or adding the "true" argument for cropping).
You may need to be more specific about what you have so far and what you're trying to do if you want more assistance.
You may need to be more specific about what you have so far and what you're trying to do if you want more assistance.
This is the closest I can find in the controller:
And then a bit later:
Does that make any sense? It's quite possible I'm asking something totally different from the subject of this thread!
$ih = Loader::helper('image'); $images = array(); $max_row_height = 0; foreach ($files as $file) { $image = array(); //$image['src'] = $file->getRelativePath(); // $size = @getimagesize($file->getPath()); // $image['width'] = $size[0]; // $image['height'] = $size[1]; $fv = $file->getRecentVersion(); $image['title'] = htmlspecialchars($fv->getTitle(), ENT_QUOTES, 'UTF-8'); $image['description'] = htmlspecialchars($fv->getDescription(), ENT_QUOTES, 'UTF-8'); $full = $ih->getThumbnail($file, $this->fullWidth, $this->fullHeight); $image['full_src'] = $full->src; $image['full_width'] = $full->width;
Viewing 15 lines of 28 lines. View entire code block.
And then a bit later:
function add() { $this->set('fsID', 0); $this->set_tools_urls(); //Defaults for new blocks $this->set('enableLightbox', '1'); $this->set('thumbWidth', '150'); $this->set('thumbHeight', '150'); $this->set('fullWidth', '800'); $this->set('fullHeight', '600'); $this->set('displayColumns', '3'); $this->set('lightboxTransitionEffect', 'fade'); $this->set('lightboxTitlePosition', 'outside'); }
Does that make any sense? It's quite possible I'm asking something totally different from the subject of this thread!
Keep in mind that if you update the controller.php file you may not be able to update your block without issues.
So, your issue is that you're using the free version of the block, which doesn't support cropping. If you want to hack it in, look for the ->getThumbnail() functions and add a fourth argument of true to turn on cropping. e.g.
Note that there are multiple getThumbnail calls. You'll need to experiment to see which one achieves the effect you want. Good luck!
EDIT: adding cropping in this way will force cropping wherever you use the block. It will not be an option on a per-block basis.
So, your issue is that you're using the free version of the block, which doesn't support cropping. If you want to hack it in, look for the ->getThumbnail() functions and add a fourth argument of true to turn on cropping. e.g.
$full = $ih->getThumbnail($file, $this->fullWidth, $this->fullHeight, true); // added ", true"
Note that there are multiple getThumbnail calls. You'll need to experiment to see which one achieves the effect you want. Good luck!
EDIT: adding cropping in this way will force cropping wherever you use the block. It will not be an option on a per-block basis.
Whenever I asked a customer how he'd like to crop the picture (take the 100px from the top or from the bottom) they never gave me a helpful answer.
We usually ended up adding a second file field where they could manually upload a thumbnail. Takes more time but allows them to do whatever they want.