Community Add-Ons

'On the Fly' Auto Thumbnailer using GD Library
for osCommerce Online Merchant v2.2

Description
History

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 licencing issues with Compuserve (Gifs are thumbnailed as JPGs), and I haven't got the PNG transparencies quite worked out.

Legend: Download Report

Expand All / Collapse All

If you are using the previous timthumb mod please upgrade to this latest version as resolve some severe security issues.

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 = '<img src="' . $src . '"';

// 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 = '<img src="../product_thumb.php?img=' . ($src[0] == '/' ? substr($src, 1) : $src) . '&w=' . tep_output_string($width) . '&h=' . tep_output_string($height) . '"';
}

} 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;
}

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:
<?php echo '<a href="' . tep_href_link(DIR_WS_IMAGES . $product_info['products_image']) . '" target="_blank">' . tep_image(DIR_WS_IMAGES . $product_info['products_image'], $product_info['products_name'], SMALL_IMAGE_WIDTH, SMALL_IMAGE_HEIGHT, 'hspace="5" vspace="5"') . '<br>' . TEXT_CLICK_TO_ENLARGE . '</a>'; ?>

132:
document.write('<?php echo '<a href="javascript:popupWindow('' . tep_href_link(FILENAME_POPUP_EXTRA_IMAGES, 'peiID=' . $extra_images['products_extra_images_id']) . '')">' . 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"') . '<br>' . TEXT_CLICK_TO_ENLARGE . '</a>'; ?>');

135:
<?php echo '<a href="' . tep_href_link(DIR_WS_IMAGES . $extra_images['products_extra_image']) . '">' . tep_image(DIR_WS_IMAGES . $extra_images['products_extra_image'], $product_info['products_name'], SMALL_IMAGE_WIDTH, SMALL_IMAGE_HEIGHT, 'hspace="5" vspace="5"') . '<br>' . TEXT_CLICK_TO_ENLARGE . '</a>'; ?>

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.

Community Add-Ons

'On the Fly' Auto Thumbnailer using GD Libraryfor osCommerce Online Merchant v2.2

'On the Fly' Auto Thumbnailer using GD Library
for osCommerce Online Merchant v2.2