Howdy, Stranger!

It looks like you're new here. If you want to get involved, click one of these buttons!

Try Vanilla Forums Cloud product

In this Discussion

Please upgrade to 2.3 here. The 2.2 and earlier branches are no longer being updated.

FileUpload: Thumbnails instead of just scaling full sized images

edited May 2011 in Vanilla 2.0 - 2.2
Not a big fan of the way the plugin displays attachments by just putting a max-height and max-width in the CSS. Seems a waste to load that much data only to scale it down.

And since that was the only negative in an otherwise outstanding plugin, I messed around and got it working to scale the thumbnails to a max height and width of 200px and save the cached image so it only needs to convert it once.

First thing was to download phpThumb and upload it into /plugins/phpThumb/. It could go anywhere, but my code looks for it there.

Open up link_files.php and look for where the .FilePreview div starts. It's pretty short in the default. Below is what I changed it to. If you put phpThumb in a different folder you'll need to change that location. And if you want something different than 200px as the max you'll want to change that as well.

<div class="FilePreview"><?php $Path = GetValue('Path', $Media); $imageSize = getimagesize(PATH_UPLOADS.'/'.$Path); if ($imageSize) { if ($imageSize[0] > 200 || $imageSize[1] > 200) { $pathInfo = pathinfo($Path); // Get dimensions of thumb $thumbDimensions = array('height' => $imageSize[1], 'width' => $imageSize[0]); if ($thumbDimensions['height'] > 200) { $thumbDimensions['height'] = 200; $thumbDimensions['width'] = intval(($thumbDimensions['width']) * ($thumbDimensions['height'] / $imageSize[1])); } if ($thumbDimensions['width'] > 200) { $thumbDimensions['width'] = 200; $thumbDimensions['height'] = intval($imageSize[1] * ($thumbDimensions['width'] / $imageSize[0])); } $thumbPath = $pathInfo['dirname'].'/'.$pathInfo['filename'].'_'.$thumbDimensions['width'].'x'.$thumbDimensions['height'].'.'.$pathInfo['extension']; if (file_exists(PATH_UPLOADS.'/'.$thumbPath)) { $Path = $thumbPath; } else { try { if (!class_exists('PhpThumbFactory')) { include(realpath(dirname(__FILE__).'/../../phpThumb/')); } $thumb = PhpThumbFactory::create(PATH_UPLOADS.'/'.$Path); $thumb->resize($thumbDimensions['width'], $thumbDimensions['height']); $thumb->save(PATH_UPLOADS.'/'.$thumbPath, $pathInfo['extension']); $Path = $thumbPath; } catch (Exception $e) { } } } echo Img('uploads/'.$Path, array('class' => 'ImageThumbnail')); } else echo Img('plugins/FileUpload/images/paperclip.png', array('class' => 'ImageThumbnail')); ?></div>

And you'll also need to edit the CSS so that the max-height and max-width are taken out, or changed to whatever your actual max is. I think it defaulted to 32px, and if I remember right I had to change it in 2 or 3 different places.


Sign In or Register to comment.