'On the Fly' Auto Thumbnailer using GD Library

Minor Change for W3C capability

just changed &w and &h to &w and &h to make it W3C capable

v2.3a

Added a couple of lines of code to product_thumb.jpg to address an error where visitors can resize images at will to huge dimensions and eat up your server resources. Note, now if you try to make the image x4 or greater sized than the original you will get a broken image. This is to address security concerns and to prevent server resources from being wasted, this is intential.

Rewrote the install directions to make installation simpler and less confusing.

FULL VERSION

SUPPORT FORUM:
http://forums.oscommerce.com/index.php?showtopic=166150

security hole

http://mysite.domain/catalog/product_thumb.php?img=images/somerealpicture.jpg&w=1000000000&h=10000000000

2.3.2 Full Package + updated readme

This package includes everything you need.

I have fixed a problem with the "2.3 Full Package + minor readme text adjustment" version step #13 as it was structured improperly and created the images to be missing in the admin panel!

It had read:
Find this (25):
define('DIR_WS_CATALOG_IMAGES', 'images/');
Replace it with this:
define('DIR_WS_CATALOG_IMAGES', '../images/');


When it should have read:
Find this (13):
define('DIR_WS_CATALOG_IMAGES', DIR_WS_CATALOG . 'images/');
Replace it with this:
define('DIR_WS_CATALOG_IMAGES', '../images/');


Had you just edited the ../ part as it indicated was all was that needed, you would have been leaving the "DIR_WS_CATALOG ." snippet which would break the purpose of the script. I also fixed the line number to 13 from 25.

If you use an older version, and you have problems with images not showing up in your admin panel, this fix should solve your woes.

2.3 Full Package + minor readme text adjustment

in product_thumb.php there was an outdated reference to readme.txt, now changed the text to readme.html

2.3 Full Package

Version 2.3 by psynaptic

- Merged '2.2.1 Minor Admin Update (SQL Only)' update by psynaptic (25.3.07).
- Merged '2.2.2 Catalog product_thumb bug fixed' update by josua (14.04.07).

2.2.2 Catalogproduct_thumb bug fixed

This update correct a bug in the product_thumb Catalog file.

Without this fix you will not be able to see the product images but just create them.

Here is the fix:

// create thumbnail directory if does not exist
//$tmp_path = str_replace(basename($filename), '', $filename);
//if (is_dir($tmp_path) == false) mkdir($tmp_path);

function modify_tn_path($file)
.......

As you can see the $filename variable isn't yet assigned in this point of the code and so the code fails.

Sorry for my english I hope you have understood what I have made. However I have attached the patched file so you have just to replace this in your catalog (or root) directory.

Bye

2.2.1 Minor Admin Update (SQL Only)

This update simply changes the true/false options in admin to radio fields (rather than text input as they are now).

Just run the .sql file on your database.

2.2 Full Package with Admin

Version 2.2 by psynaptic

- Merged 'Control compression of thumbnailed images' update by idolcemia (29.10.06).
- Merged 'Default image' update by dannet (09.04.06).
- Added no_image.jpg for use as default image.
- Added full admin control of the configuration settings.
- Added 'Control more image sizes from admin' bonus tip.
- Added gdtest.php to show which components and version of the GD Library is installed on your server.
- Fixed the readme document's HTML/CSS code. It now validates and is cross-browser compatible.
- Some of the readme document has been rewritten including full syntax highlighting based on php.net

Backend patch

Based on nate_02631's 15 Dec 2005

Much like new tep_image() function in catalog/includes/functions/html_output.php
Just replace tep_image() function in catalog/admin/includes/functions/html_output.php with

function tep_image($src, $alt = '', $width = '', $height = '', $params = '') {

// Set default image variable and code
$image = '
// Don't calculate if the image is set to a "%" width
if (strstr($width, '%') == false || strstr($height, '%') == false) {
$dont_calculate = 0;
} else {
$dont_calculate = 1;
}

// Do we calculate the image size?
if (CONFIG_CALCULATE_IMAGE_SIZE && !$dont_calculate) {

// Get the image's information
if ($image_size = @getimagesize($src[0] == '/' ? '..' . $src : $src)) {

$ratio = $image_size[1] / $image_size[0];

// Set the width and height to the proper ratio
if (!$width && $height) {
$ratio = $height / $image_size[1];
$width = intval($image_size[0] * $ratio);
} elseif ($width && !$height) {
$ratio = $width / $image_size[0];
$height = intval($image_size[1] * $ratio);
} elseif (!$width && !$height) {
$width = $image_size[0];
$height = $image_size[1];
}

// Scale the image if larger than the set width or height
if ($image_size[0] > $width || $image_size[1] > $height) {
$rx = $image_size[0] / $width;
$ry = $image_size[1] / $height;

if ($rx < $ry) {
$width = intval($height / $ratio);
} else {
$height = intval($width * $ratio);
}

$image = ' }

} elseif (IMAGE_REQUIRED == 'false') {
return '';
}
}

// Add remaining image parameters if they exist
if ($width) $image .= ' width="' . tep_output_string($width) . '"';

if ($height) $image .= ' height="' . tep_output_string($height) . '"';

if ($params != '') $image .= ' ' . $params;

$image .= ' border="0" alt="' . tep_output_string($alt) . '"';

if ($alt) $image .= ' title="' . tep_output_string($alt) . '"';

$image .= '>';

return $image;
}

BMP and '&' fix

I found my clients uploading BMP files and also putting '&' symbols in filenames.

Control compression of thumbnailed images

I needed to reduce the size of the the thumbnail images in order to control the size of my pages. (It helped a lot!)

After spending some time trying to figure out which version of this package is currently "definitive", which I should modify to provide in its entirety here, I eventually gave up and chose simply to submit my instructions for this modest 2-step fix.

A little tip: Default image

If you want to add a default image for the products that dont have images, you have to add the code:

if (! is_file($src)) {
$src = "images/xxx.jpg";}

where xxx is the name of your image

just after the function tep_image begin
(function tep_image($src, $alt = '', $width = '', $height = '', $params = '') {

and this code )

auto create thumbnail dir and win32 pathSep

I change how $pathSep work on win32 server by replace
$pathSep = "/"; //$pathSep = strstr(PHP_OS, "WIN") ? "\'" : "/";;

and also add functionality to automatically create 'thumbnails' directory if it is not exist; please test this function on unix/linux server.
// create thumbnail directory if not exist.
$tmp_path = str_replace(basename($filename), '', $filename);
if (is_dir($tmp_path) == false) mkdir($tmp_path);

bugfix

when delete a catalog the addtional images not remove form the database.

in general.php

function tep_remove_product()

add tep_db_query("delete from " . TABLE_ADDITIONAL_IMAGES . " where products_id = '" . (int)$product_id . "'");

no file upload

2.1.2b Minor Bugfix with wacky filenames

Included the updated install instructions. Did not include the 2.1.2a because it failed to work on my setup (linux / apache).

Updated tep_image in the readme.html to address the following:

Fixed problem with tep_image where $src having images with with spaces in the filename would create screwy query strings to the products_thumb.php and gave me broken images.

Fixed a problem with tep_image where image src's with wacky characters in $src and resize code is not to be run (set in top of function). Spaces or other illegal characters in filenames could become part of the URL. Most newer browsers do the conversions automagically (space to %20 for instance) when requesting the image so it's pretty minor, but this is sloppy to say the least. This bug also exists in the stock tep_image function that ships with oscommerce.

'On the Fly' Auto Thumbnailer v 1.5

Just reposting in case anyone is confused - the last *sanctioned* version of this contrib is 1.5, which does not include caching, etc...

The others that follow were added with no coordination with the original author and should have been started as distinct contributions...

UPDATES IN VERSION 1.5
Version 1.5 adds *transparency* support and support for older versions of the GD library. Your PHP's GD library can be configured a number of different ways, but in general, the following holds true: Versions after 1.6 generally include GIF read support as well as PNG support. Thus, if you have GD < 1.6 you will not be able to thumbnail PNG images. If you have GD > 1.6, you can scale GIF images, but they will be output as either PNG (default) or JPGs, depending on the product_thumb.php configuration settings.

A bug with product names containing aspostrophes was fixed.

Minor streamlining of the code and comments were added.

A check to see if the thumbnail dimensions being passed to the thumbnailer are greater that the size of the original image. In which case, the image will not be output. (A security feature to mitigate DOS (Denial of Service) attacks with users calling the thumbnailer directly with very large width/height values.)

If you are upgrading, replace both your product_thumb.php and the tep_image function with the new ones.

A new support thread has been started here:
http://forums.oscommerce.com/index.php?showtopic=112231

Questions, comments, etc... are welcome

Instruction Correction for installations on osc2.2 M2

Small correction in instructions

Step #10 - In /catalog/admin/includes/configure.php
replace code (around line 25)
Originally the instructions say:
define('DIR_WS_CATALOG_IMAGES', 'images/');
replace with
define('DIR_WS_CATALOG_IMAGES', '../images/');

on M2 it looks like this

define('DIR_WS_CATALOG_IMAGES', DIR_WS_CATALOG . 'images/');

replace with
define('DIR_WS_CATALOG_IMAGES', '../images/');

2.1.2a - Fixing Problems with ADMIN Tool thumbnailiing

Hi Folks,

i had Problems to get the Admin Thumbnailing to run (Windows Server). I Included DIR_FS_CATALOG (absolute path Variable) to fix errors with all file-actions.

Thank´s for this great addon!

INSTALL:
read included file.

2.1.2 minor bugfix, restyling and better browser-caching mechanism

- Fixed a bug of browser-caching option not being used
- Added status http-header for more compatibility with other servers
- Restyled and recoded browsercaching-mechanism
- Completely rewritten readme in an html-version for better reading

If you have questions or suggestions, please leave them in the Contribution Support Forum: http://forums.oscommerce.com/index.php?showtopic=166150

2.1.1 readme updated

Are your thumbnails cluttering your images-directory?

In this version you may configure a subdirectoy where to store all the cached thumbnails.

When you install, please make sure that the default subdirectory (thumbnails) exists in both /catalog/images and /catalog/admin/images. If you have a sub-categorized images directory, create the thumbnails-directory within *every* sub-directory of images (also mentioned in readme)

2.1.0 new feature: optional sub-directory for cached thumbnails

Are your thumbnails cluttering your images-directory?

In this version you may configure a subdirectoy where to store all the cached thumbnails.

When you install, please make sure that the default subdirectory (thumbnails) exists in both /catalog/images and /catalog/admin/images (also mentioned in readme)

2.0.1 bugfix for 2.0.0

Fix for new thumbnails that were not created.

2.0.0 new feature: browser caching

Added browser caching capabilities to the thumbnails. This results in less bandwidth consumption and faster access to your store(s).
Also works when server-caching of thumbnails is disabled.
Please share your results here: http://forums.oscommerce.com/index.php?showtopic=164623

1.9.2 Full Package

This FULL PACKAGE fixes the pixel bug.

trans_pixel fix

Quick and easy fix for 'pixel' image bug. I am not a programmer but this fix worked for me.
This is a simple solution inspired by hours of searching.
Maybe you can improve it with a better idea.
Many thanks for those that have made this contribution available.

All I did was put in another filter that tells function tep_image() not to resize images with the word 'pixel' in them.


In includes/functions/html_output.php FIND:

// Don't calculate if the image is set to a "%" width
if (strstr($width,'%') == false || strstr($height,'%') == false) {
$dont_calculate = 0;
} else {
$dont_calculate = 1;
}


AFTER ADD:

// Don't calculate if image has "pixel" in its name
if (strstr($image,'pixel') == false || strstr($image,'pixel') == false) {
$dont_calculate = 0;
} else {
$dont_calculate = 1;
}



// Let just hope your store doesn't sell pixels! :)

trans_pixel fix

Quick and easy fix for 'pixel' image bug. I am not a programmer but this fix worked for me. This is a simple solution inspired by hours of searching. Maybe you can improve it with a better idea. Many thanks for those that have made this contribution available.

All I did was put in another filter that tells function tep_image() not to resize images with the word 'pixel' in them.

in includes/functions/html_output.php FIND:

// Don't calculate if the image is set to a "%" width
if (strstr($width,'%') == false || strstr($height,'%') == false) {
$dont_calculate = 0;
} else {
$dont_calculate = 1;
}

// AFTER ADD:

// Don't calculate if image has "pixel" in its name
if (strstr($image,'pixel') == false || strstr($image,'pixel') == false) {
$dont_calculate = 0;
} else {
$dont_calculate = 1;
}

// Let just hope your store doesn't sell pixels! :)

1.9.1 Full Package

Restored the tep_image function so that the } removed by the previous contributor has been restored (code was breaking)
Also updated product_thumb.php so that the arguments to function_exists() are encapsulated in quotes so they don't cause a notice.

Fix of v 1.9 (full package)

i have cancelled a "extra" '}' in the "Replace your function tep_image code with the code below" that cause error of mi site.
Use this full package.

Bugfixes, complete package V 1.9

UPDATES IN VERSION 1.9:
bugfixes:
- the alt and title tags were generated with three space characters (a mouse over showed a blank notice on all pictures in the store)
- bugfix of Tony Briers is included

Complete Package!

Fix for small thumbs being scaled by browser IMG WIDTH and HEIGHT attributes.

The width and height attributes of the image created by the following code means that smaller thumbnail images are scaled by the browser to the dimensions SMALL_IMAGE_WIDTH and SMALL_IMAGE_HEIGHT.

"catalog/product_info.php" lines 123 and 135 in my install.

123:
' . tep_image(DIR_WS_IMAGES . $product_info['products_image'], $product_info['products_name'], SMALL_IMAGE_WIDTH, SMALL_IMAGE_HEIGHT, 'hspace="5" vspace="5"') . '
' . TEXT_CLICK_TO_ENLARGE . ''; ?>

132:
document.write('' . tep_image(DIR_WS_IMAGES . $extra_images['products_extra_image'], addslashes($product_info['products_name']),SMALL_IMAGE_WIDTH, SMALL_IMAGE_HEIGHT, 'hspace="5" vspace="5"') . '
' . TEXT_CLICK_TO_ENLARGE . ''; ?>');

135:
' . tep_image(DIR_WS_IMAGES . $extra_images['products_extra_image'], $product_info['products_name'], SMALL_IMAGE_WIDTH, SMALL_IMAGE_HEIGHT, 'hspace="5" vspace="5"') . '
' . TEXT_CLICK_TO_ENLARGE . ''; ?>

These dimensions are useful for page layout. My solution is to create a blank thumbnail with the smaller original image centered upon it. This requires two changes to "catalog/product_thumb.php":

Lines 72 and 73

$_GET['w'] = $image[0];
$_GET['h'] = $image[1];

are commented out to become:

// $_GET['w'] = $image[0];
// $_GET['h'] = $image[1];


and before (about line 168) :

// Scale the image based on settings:
if (function_exists(imagecopyresampled) && $use_resampling)
{

insert the code:

if (empty($allow_larger) && ($_GET['w'] > $image[0] || $_GET['h'] > $image[1]))
{
// existing image is smaller than thumbnail so create the thumbnail with the smaller original image centred on it
$dx = ($_GET['w'] - $image[0]) / 2;
$dy = ($_GET['h'] - $image[1]) / 2;
imagecopy($tmp_img, $src, $dx, $dy, 0, 0, $image[0], $image[1]);
} else

Tone.

Bugfixes and new features, complete package

bug fixes to :
- make the beast behave when the images are actually smaller than the thumbs
(requires changes in html_output and product_thumbs)
- make use_truecolor behave in presence of gifs, notably pixel_trans*

Also added code to detect when the thumbs are older than the pictures, so it recreates the thumbs in that case. No need to delete thumbs when the pictures are changed anymore.

Note that it still needs some kind of "garbage collection" because if the proportions change between the original picture and the new one, the old thumbs will stay around. This doesn't impact the system, but will clutter your disk over time. A simple cron job takes care of it, I'll try to
implement it in php if I have time.

Bugfix for gif images - 1.7.2

There was a (small) bug in product_thumbs which prevented gif images from displaying. This is a complete fixed package.

All updates combined - 1.7.1

With the recent updates, like others, I got tired of trying to track down which file/files needed to be downloaded.

Since I myself did not create this mod, I decided to pay it forward and repackage all the updates from 1.5 to current. This is just a streamlined repack. All credit goes to Nate Welch and every other contributor since.

After the wc3 validator support was added, I upped the version to 1.7. Including the (much needed) improved instructions, I designated it to 1.7.1.

This package has been tested successfully on my dev server.

validation update

I ran my page through the wc3 validator and it complained about unencoded ampersands so i modified the code to use & in the image links.

enjoy. fantastic module btw the caching really works sweet.

'On the fly' Auto Thumbnailer in Admin Section (also SSL protected)

Available at: http://forums.oscommerce.com/index.php?showtopic=140340&st=0&p=570398&#entry570398

If you followed the instructions:
1) You need to change you tep_image() function definition located in admin/includes/functions/html_output.php the same way you did for includes/functions/html_output.php

2) You need to change your configure file for admin located at admin/includes/configure.php

Code:

CODEdefine('DIR_WS_CATALOG_IMAGES', DIR_WS_CATALOG . 'images/'); // old line

to

CODEdefine('DIR_WS_CATALOG_IMAGES', '../images/'); //new line

Note: this done for the reason that getimagesize() might fail to work inside modified tep_image() function, especially in the case of SSL protected areas
I will still need advice of Community on doing this in terms of possible security problems.

3) Finally you need to !!!!! VERY IMPORTANT !!!! copy "product_thumb.php" into admin folder

1.6

Added error checking and multiple image size support.

'On the Fly' Auto Thumbnailer with Cache option

This is my first contibution (better known as a 'hack'). I just combined the caching code to the most recent release. I also made it an option so you can just enable it. This is my quick fix to an issue I was having.

Enjoy,

Marcello

'On the Fly' Auto Thumbnailer v 1.5

UPDATES IN VERSION 1.5
Version 1.5 adds *transparency* support and support for older versions of the GD library. Your PHP's GD library can be configured a number of different ways, but in general, the following holds true: Versions after 1.6 generally include GIF read support as well as PNG support. Thus, if you have GD < 1.6 you will not be able to thumbnail PNG images. If you have GD > 1.6, you can scale GIF images, but they will be output as either PNG (default) or JPGs, depending on the product_thumb.php configuration settings.

A bug with product names containing aspostrophes was fixed.

Minor streamlining of the code and comments were added.

A check to see if the thumbnail dimensions being passed to the thumbnailer are greater that the size of the original image. In which case, the image will not be output. (A security feature to mitigate DOS (Denial of Service) attacks with users calling the thumbnailer directly with very large width/height values.)

If you are upgrading, replace both your product_thumb.php and the tep_image function with the new ones.

A new support thread has been started here:
http://forums.oscommerce.com/index.php?showtopic=112231

Questions, comments, etc... are welcome

Caching

i made a little change on product_thumb.php in order to save the rescaled picture after the first request.

for example if the picture is named: test.jpg at the first request of a thumbnailed version of that picture it will create the test.jpg.thumb.jpg (i like dots ! ^_^) on any subsequent requests product_thumb.php won't rescale it again but it will simply send the already scaled file.

if you change the original picture you need to delete manually the thumbnailed version.

hope to help.
comments welcome.

Caching

i made a little change on product_thumb.php in order to save the rescaled picture after the first request.

for example if the picture is named: test.jpg at the first request of a thumbnailed version of that picture it will create the test.jpg.thumb.jpg (i like dots ! ^_^) on any subsequent requests product_thumb.php won't rescale it again but it will simply send the already scaled file.

if you change the original picture you need to delete manually the thumbnailed version.

hope to help.
comments welcome.

'On the Fly' Auto Thumbnailer v 1.1

This version fixes a glitch with respect to 100% scaled images (such as the pixel_black and transparent images), adds a "title" alt tag to images and adds resampling (mentioned below) for cleaner scaled images.

The full install is here which involves adding just one file and replacing the tep_image function in includes/functions/html_output.php with the function in the readme.txt

AND A BONUS TIP: Make an intermediate-sized image for the product info page by adding a "multiplier" to the SMALL_IMAGE_WIDTH & SMALL_IMAGE_HEIGHT values in product_info.php

For example, to make the image on the product info page twice as large as the thumbnail, replace the values with:
(SMALL_IMAGE_WIDTH*2) and
(SMALL_IMAGE_HEIGHT*2)
Of course, any image smaller than that will be stretched to fit! (There are *two* occurences each of WIDTH/HEIGHT so be sure to change them both!)

Auto Thumbnailer

Thanks for a great contribution Nate!....

Please see the forum Q&A here...(instead of posting on this page) ;)

http://forums.oscommerce.com/index.php?act=ST&f=7&t=101007

Thanks Nate!

And..thanks for the quality improvement! Will it "significantly" use more server resources????

Resampled thumbnails "product_thumb.php"

Thumbnail quality can be improved greatly by changing the "imagecopyresized" function in product_thumbs.php to "imagecopyresampled" (takes a little more server juice). A modified product_thumb.php is attached as a download - though be sure to apply the original changed tep_image function as described in the first post.

Since the "pixel_black", transparent pixels and others are not run through this script (check the page source), I don't see what effect this mod could have on them.

GIF enabling is not possible because only GIF reading is enabled in the GD 2 library due to aforementioned lisensing issues. The mod *does* read and resize GIFs, outputting them as JPGs - making for smoother scaling (esp. with above resampling). Remember that the default background color can be changed from white to something else, if preferred.

Concerns...

Thanks for a great contrib Nate!

But...it messes up the "pixel black" line on the product listings...and the "tooltips" on certain gif, and jpg pics on the site.....

Also..can you improve the quality of the thumbnails?...they're really bad at small sizes...not so bad at product info sizes..around 200x200....

That would be great!....Also...how can Gif be enabled?

Thanks!

'On the Fly' Auto Thumbnailer using GD Library

This modification uses the GD 2 image library, which now comes packaged with most PHP builds, to dynamically generate your product image thumbnails on the fly. It works with GIFs, JPGs and PNGs, produces much smaller thumbnail file sizes (saving bandwidth), maintains the proper ratio of your pics, and does not create any extra files on your server.

Easy installation involves adding only one file and updating the tep_image function. It should work with osC 2.1-2.2

Unfortunately, transparencies are not supported as of this release. GIF creation was disabled in the GD Library due to liscencing issues with Compuserve (Gifs are thumbnailed as JPGs), and I haven't got the PNG transparencies quite worked out.

You Risk Nothing: No Upfront Payment Required

Our NO RISK POLICY is clear. You pay only for the successful completion of the installation. If you are not satisfied or we are unsuccessful, your site will be returned to its previous working state and you pay nothing! NOT A PENNY!
Once you are satisfied with our help, you can pay us through Paypal.