[mod] image thumbnail with NO plain background

[krodelabestiole]

i think adding this plain background to images is a really bad idea...

to say it simply it makes image files heavier and it's ugly

so i've just modified a bit images.inc.php so that it manage adaptive resize to thumbnails using php thumb
as there :
http://github.com/masterexploder/PHPThumb/wiki/Basic-Usage
(scare thumbnails are filled with the photography, no dead spaces)

so you have to download phpthumb and place it in a folder [prestashop root]/phpthumb/ you create

then edit [prestashop root]/images.inc.php

replace (comment) imageResize function with this one

function imageResize($sourceFile, $destFile, $destWidth = NULL, $destHeight = NULL, $fileType = 'jpg') {
   list($sourceWidth, $sourceHeight, $type, $attr) = getimagesize($sourceFile);
   if (!$sourceWidth) return false;
   if ($destWidth == NULL) $destWidth = $sourceWidth;
   if ($destHeight == NULL) $destHeight = $sourceHeight;
   require_once '../phpthumb/ThumbLib.inc.php';
   $thumb = PhpThumbFactory::create($sourceFile);
   if ($destWidth > 300 || $destHeight > 300) { // if not a thumbnail then not square
       $thumb->resize($destWidth, $destHeight);
   }
   else {
       $thumb->adaptiveResize($destWidth, $destHeight);
   }
   return $thumb->save($destFile);
}

here you are !

might be a bit dirty quick job : if the original picture is less than 300px high or wide then the main picture in front will be square cropped ...

is there another way to know if the image is a thumnail or a full picture ?

any else it should work fine

[krodelabestiole]

hi

i mostly agree

sure the more options you have the best it is (when you can hide these options to keep it simpler to users)

the point is i install and cusomize this interface for clients or friends who rarely know how to use photoshop, compress jpeg and so on... not all pay professionnal photographers / webmasters at this end
i guess on this purpose automation stays the best solution, and it should be much better managed than it is now with these ugly borders

phpthumb seems to me a nicer way to do this but i still miss some arguments in the fonction call to be the best.
especially : are the size arguments strict or max (an info we would have to specify in the image settings for each small, medium, large, thickbox...)

i hope some prestashop [spam-filter] will read about this

[krodelabestiole]

yep sure i saw that

first post is a workaround to this problem
and it works quite fine : images up to 300px (usually thumbs) are both resized and cropped (adaptive resize) so that they fit exactly to their space, keeping aspect ratio.
greater images (large pictures and thickboxes) are just uniformly resized to the max width OR max height specified in back office

therefore the remaining issue with this mod is that when you upload an image smaller than 300px (of course you can adjust that number in the code) it will have to fit exactly in both width and heigth, what may crop it a bit, even on full views.

the best way to deal with that would be to implement phpthumb in ps next versions
and to add this strict/max option for each format in backoffice (i haven't mod this as it would ask to modify many other files and a bit of the database structure)

[krodelabestiole]

  Quote

first post is a workaround to this problem

other good news is that it also works with gif and png, KEEPING TRANSPARENCIES :]

[krodelabestiole]

more likely this kind of scripts

http://www.hotscripts.com/blog/javascript-image-cropping-scripts/
http://deepliquid.com/projects/Jcrop/demos.php?demo=thumbnail

seems to me it means a lot of work to implement

[tairlanz]

@krodelabestiole

YOU ARE MY GOD AND SAVED MY LIFE.
Thanks for this thread !!! I was stuck on thumbnails for 3 days !!!!

[User1234567891]

I am not very strong in php. I tried several things, but I think I am replacing the wrong bit of code.

 

In images.inc.php do i replace all this (line 138 to 182)

 

function imageResize($sourceFile, $destFile, $destWidth = NULL, $destHeight = NULL, $fileType = 'jpg')
{
list($sourceWidth, $sourceHeight, $type, $attr) = getimagesize($sourceFile);
if (!$sourceWidth)
	return false;
if ($destWidth == NULL) $destWidth = $sourceWidth;
if ($destHeight == NULL) $destHeight = $sourceHeight;

$sourceImage = createSrcImage($type, $sourceFile);

$widthDiff = $destWidth / $sourceWidth;
$heightDiff = $destHeight / $sourceHeight;

if ($widthDiff > 1 AND $heightDiff > 1)
{
	$nextWidth = $sourceWidth;
	$nextHeight = $sourceHeight;
}
else
{
	if (intval(Configuration::get('PS_IMAGE_GENERATION_METHOD')) == 2 OR (intval(Configuration::get('PS_IMAGE_GENERATION_METHOD')) == 0 AND $widthDiff > $heightDiff))
	{
		$nextHeight = $destHeight;
		$nextWidth = intval(($sourceWidth * $nextHeight) / $sourceHeight);
		$destWidth = (intval(Configuration::get('PS_IMAGE_GENERATION_METHOD')) == 0 ? $destWidth : $nextWidth);
	}
	else
	{
		$nextWidth = $destWidth;
		$nextHeight = intval($sourceHeight * $destWidth / $sourceWidth);
		$destHeight = (intval(Configuration::get('PS_IMAGE_GENERATION_METHOD')) == 0 ? $destHeight : $nextHeight);
	}
}

$borderWidth = intval(($destWidth - $nextWidth) / 2);
$borderHeight = intval(($destHeight - $nextHeight) / 2);

$destImage = imagecreatetruecolor($destWidth, $destHeight);

$white = imagecolorallocate($destImage, 255, 255, 255);
imagefill($destImage, 0, 0, $white);

imagecopyresampled($destImage, $sourceImage, $borderWidth, $borderHeight, 0, 0, $nextWidth, $nextHeight, $sourceWidth, $sourceHeight);
imagecolortransparent($destImage, $white);
return (returnDestImage($fileType, $destImage, $destFile));

 

With this:

 

  function imageResize($sourceFile, $destFile, $destWidth = NULL, $destHeight = NULL, $fileType = 'jpg')
{    
list($sourceWidth, $sourceHeight, $type, $attr) = getimagesize($sourceFile);    
if (!$sourceWidth) return false;    
if ($destWidth == NULL) $destWidth = $sourceWidth;    
if ($destHeight == NULL) $destHeight = $sourceHeight;    require_once '../phpthumb/ThumbLib.inc.php';    $thumb = PhpThumbFactory::create($sourceFile);    
if ($destWidth > 300 || $destHeight > 300) { 
// if not a thumbnail then not square        $thumb->resize($destWidth, $destHeight);    }    else {        $thumb->adaptiveResize($destWidth, $destHeight);    }    return $thumb->save($destFile);}

 

Hope someone can give me little tip. Might be a good educational moment for me as well ;-)I am not sure how a function ends, that is why I am not sure which bit of code to replace.

 

Thanks!

[User1234567891]

Ok guys, just stumbled upon this after searching the forum for a couple of hours ;-)

 

A very simple solution to get rid of these ugly white backgrounds. Just tested it, and works like a charm.

This is the topic I got the solution from (hooray for TS Antuan of course!)

TRICK - Crop images inside preserve ratio (no white spaces arround image)

 

Here is how it works:

 

Open images.inc.php

 

In the following line (around 154) you should change > to <

 

Original:

if (intval(Configuration::get('PS_IMAGE_GENERATION_METHOD')) == 2 OR (intval(Configuration::get('PS_IMAGE_GENERATION_METHOD')) == 0 AND $widthDiff > $heightDiff))

 

Modified:

if (intval(Configuration::get('PS_IMAGE_GENERATION_METHOD')) == 2 OR (intval(Configuration::get('PS_IMAGE_GENERATION_METHOD')) == 0 AND $widthDiff < $heightDiff))

 

 

Had to share this find with you all!

[justinl]

I wanted to confirm for people that this works in 1.4.4.1

[krodelabestiole]

  On 7/22/2011 at 6:19 PM, lostrisq said:

I am not very strong in php. I tried several things, but I think I am replacing the wrong bit of code.

In images.inc.php do i replace all this (line 138 to 182)

With this:

Hope someone can give me little tip. Might be a good educational moment for me as well ;-)I am not sure how a function ends, that is why I am not sure which bit of code to replace.

 

You have to replace this :

function imageResize($sourceFile, $destFile, $destWidth = NULL, $destHeight = NULL, $fileType = 'jpg')
{
list($sourceWidth, $sourceHeight, $type, $attr) = getimagesize($sourceFile);
if (!$sourceWidth)
 return false;
if ($destWidth == NULL) $destWidth = $sourceWidth;
if ($destHeight == NULL) $destHeight = $sourceHeight;
$sourceImage = createSrcImage($type, $sourceFile);
$widthDiff = $destWidth / $sourceWidth;
$heightDiff = $destHeight / $sourceHeight;

if ($widthDiff > 1 AND $heightDiff > 1)
{
 $nextWidth = $sourceWidth;
 $nextHeight = $sourceHeight;
}
else
{
 if (intval(Configuration::get('PS_IMAGE_GENERATION_METHOD')) == 2 OR (intval(Configuration::get('PS_IMAGE_GENERATION_METHOD')) == 0 AND $widthDiff > $heightDiff))
 {
  $nextHeight = $destHeight;
  $nextWidth = intval(($sourceWidth * $nextHeight) / $sourceHeight);
  $destWidth = (intval(Configuration::get('PS_IMAGE_GENERATION_METHOD')) == 0 ? $destWidth : $nextWidth);
 }
 else
 {
  $nextWidth = $destWidth;
  $nextHeight = intval($sourceHeight * $destWidth / $sourceWidth);
  $destHeight = (intval(Configuration::get('PS_IMAGE_GENERATION_METHOD')) == 0 ? $destHeight : $nextHeight);
 }
}

$borderWidth = intval(($destWidth - $nextWidth) / 2);
$borderHeight = intval(($destHeight - $nextHeight) / 2);

$destImage = imagecreatetruecolor($destWidth, $destHeight);
$white = imagecolorallocate($destImage, 255, 255, 255);
imagefill($destImage, 0, 0, $white);
imagecopyresampled($destImage, $sourceImage, $borderWidth, $borderHeight, 0, 0, $nextWidth, $nextHeight, $sourceWidth, $sourceHeight);
imagecolortransparent($destImage, $white);
return (returnDestImage($fileType, $destImage, $destFile));
}

which stand from line 116 to line 161 on my version of prestashop

with this :

function imageResize($sourceFile, $destFile, $destWidth = NULL, $destHeight = NULL, $fileType = 'jpg') {
   list($sourceWidth, $sourceHeight, $type, $attr) = getimagesize($sourceFile);
   if (!$sourceWidth) return false;
   if ($destWidth == NULL) $destWidth = $sourceWidth;
   if ($destHeight == NULL) $destHeight = $sourceHeight;
   require_once '../phpthumb/ThumbLib.inc.php';
   $thumb = PhpThumbFactory::create($sourceFile);
   if ($destWidth > 300 || $destHeight > 300) { // if not a thumbnail then not square
    $thumb->resize($destWidth, $destHeight);
   }
   else {
    $thumb->adaptiveResize($destWidth, $destHeight);
   }
   return $thumb->save($destFile);
}

 

You can as well comment the first code by adding /* at first and */ after the end of the function then paste the second code underneath.

 

I don't know why this whole code is on the same line on your quote :

// if not a thumbnail then not square	    $thumb->resize($destWidth, $destHeight);    }    else {	    $thumb->adaptiveResize($destWidth, $destHeight);    }    return $thumb->save($destFile);}

but it won't work this way cause everything is commented (// means the next code on the line won't be executed in PHP)

[Jamfris]

It worked like a charm in 1.4.7 what lotrisq wrote.

 

It would be nice to avoid cropping on the thumb of the related products. But I think it's completely bearable