Support thread for the Image Magic contribution

i2Paq · May 10, 2008

IS ANY BODY HAS A NEW VERSION??? I GOT LAST ONE 1.17 , CAN SOMEBODY UPLOAD(rapidshare.de or any other) 1.18 OR LATER??

1.17 is not from the original contributor, 1.16 is the latest released by tomjul.

You can find it in the Dutch osCommerce Forum.

klik

Edited May 10, 2008 by i2Paq

livecan7 · May 10, 2008

I have installed,. I am running Windows server

it's good!^_^

Snarg · September 15, 2008

Since www.celtware.com seems to have died and taken the install instructions with it. I managed to dig them up. All hail Google.

Note 1: In the instructions below, I have made the assumption that your store's root folder is catalog. IE. Your store is accessed by typing www.yourstore.com/catalog into a browser.

Note 2: Be sure to read the installation instructions *all* the way and if you do not understand what is being said here, do not try to install it and instead come to the forum section for help.

Step #1 - Analyzing requirements

This contribution requires:

* osCommerce 2.2-MS2

* the GD image library, which now comes packaged with most PHP builds

Note: you can verify that you have both requirements in your admin panel (Tools -> Server Info). Check if you have the GD-library installed by looking for a "gd" subsection.

Step #2 - Backup files

Make a backup of the files that are going to be changed:

* Your store's OSC database (Very important!)

* catalog/includes/functions/html_output.php

* catalog/admin/includes/functions/general.php

If applying the IE PNG bug work-around, then also backup:

* catalog/popup_image.php

* catalog/includes/header.php

Step #3 - Update your store database

Run the imagemagic.sql file contained in the zip archive with PHPMyAdmin or your favourite MYSQL browser client.

Note: Please make sure that a fully working backup of your database exists before doing this step. This is very important

Step #4 - Add files

Copy the files contained in the zip archive to their respective directories on your server - Easy eh?

Step #5 - In:

catalog/admin/includes/functions/general.php

* Just before the ?> at the very end of this file add the following:

  function tep_cfg_readonly($value){
  $single[]= array('id' => $value,
					'text' => $value);
  return tep_draw_pull_down_menu('configuration_value', $single, $value);
 }

 function tep_cfg_pull_down_installed_fonts($font_name) {
  if ($root=@opendir(DIR_FS_DOCUMENT_ROOT.'includes/imagemagic/fonts')){
		while ($file=readdir($root)){
			  if($file=="." || $file==".." || is_dir($dir."/".$file)) continue;
			  $files[]= array('id' => $file,
							 'text' => $file);
		}
  }
  return tep_draw_pull_down_menu('configuration_value', $files, $font_name);
}

 function tep_cfg_pull_down_installed_watermarks($watermark_name) {
  if ($root=@opendir(DIR_FS_DOCUMENT_ROOT.'includes/imagemagic/watermarks')){
		while ($file=readdir($root)){
			  if($file=="." || $file==".." || is_dir($dir."/".$file)) continue;
			  $files[]= array('id' => $file,
							 'text' => $file);
		}
  }
  return tep_draw_pull_down_menu('configuration_value', $files, $watermark_name);
}

 function tep_cfg_pull_down_watermark_alignment($watermark_alignment) {
  $align[]= array('id' => 'Tiled',
					'text' => 'Tiled');
  $align[]= array('id' => 'Top',
					'text' => 'Top');
  $align[]= array('id' => 'Top Left',
					'text' => 'Top Left');
  $align[]= array('id' => 'Top Right',
					'text' => 'Top Right');
  $align[]= array('id' => 'Center',
					'text' => 'Center');
  $align[]= array('id' => 'Bottom',
					'text' => 'Bottom');
  $align[]= array('id' => 'Bottom Left',
					'text' => 'Bottom Left');	 
  $align[]= array('id' => 'Bottom Right',
					'text' => 'Bottom Right');																																									 
  return tep_draw_pull_down_menu('configuration_value', $align, $watermark_alignment);
}

Step #6 - In :

/catalog/includes/functions/html_output.php

replace the entire tep_image() function with:

// BOF Image Magic 
function tep_image($src, $alt = '', $width = '', $height = '', $params = '') {  
 global $product_info;

 //Allow for a new intermediate sized thumbnail size to be set 
 //without any changes having to be made to the product_info page itself. 
 //(see the lengths I go to to make your life easier :-)
 if (strstr($_SERVER['PHP_SELF'],"product_info.php")) {

	if (isset($product_info['products_image']) 
			   && $src == DIR_WS_IMAGES . $product_info['products_image']
			   && $product_info[products_id]==$_GET['products_id'])  {   //final check just to make sure that we don't interfere with other contribs
		$width = PRODUCT_INFO_IMAGE_WIDTH == 0?'':PRODUCT_INFO_IMAGE_WIDTH;
		$height = PRODUCT_INFO_IMAGE_HEIGHT == 0?'':PRODUCT_INFO_IMAGE_HEIGHT;
		$product_info_image=true;
		$page="prod_info"; 
	}
 }

 //Detect whether this is a pop-up image
 if (strstr($_SERVER['PHP_SELF'],"popup_image.php")) $page="popup";

 //do we apply the IE PNG alpha transparency fix?
 if  (strstr(strtolower($src),".png") && CFG_PNG_BUG=="True") $fix_png = true;

 //send the image for processing unless told otherwise
 $image = '<img src="' . $src . '"'; //set up the image tag just in case we don't want to process
 if (CFG_MASTER_SWITCH=="On") $calculate = true;
 else $calculate=false;

 // Don't calculate if the image is set to a "%" width
 if (strstr($width,'%') == true || strstr($height,'%') == true) $calculate = false; 

 // Dont calculate if a pixel image is being passed (hope you dont have pixels for sale)
 if (strstr($image, 'pixel')) $calculate = false;


 $image_size = @getimagesize($src);


 // Decide whether or not we want to process this image
 if (($width == '' && $height == '' && $page != 'popup' ) || ($width == $image_size[0] && $height == $image_size[0] && $page != 'popup')) {  
	if (CFG_PROCESS_GRAPHICS=="False") $calculate = false; //looks like this is a store graphic rather than product image
 }	

 // Is this image good to go?
 if (CONFIG_CALCULATE_IMAGE_SIZE && $calculate) { 

 if ($image_size) { 

  $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 && !$over_ride) { 
	$width = $image_size[0]; 
	$height = $image_size[1]; 
  } 

  //Encrypt the image filename if switched on
	if (CFG_ENCRYPT_FILENAMES == "True" && CFG_ENCRYPTION_KEY !="") {
		  $result = '';
		  $key=CFG_ENCRYPTION_KEY;
		  for($i=0; $i<strlen($src); $i++) {
			  $char = substr($src, $i, 1);
			  $keychar = substr($key, ($i % strlen($key))-1, 1);
			  $char = chr(ord($char)+ord($keychar));
			  $result.=$char;
		  }
		  $src=urlencode(base64_encode($result));
	}

   //Return the html
	$image = '<img src="imagemagic.php?img='.$src.'&w='.
	tep_output_string($width).'&h='.tep_output_string($height).'&page='.$page.'"';

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

//If the size asked for is greater than the image itself, we check the configs to see if this is allowed and if not over-ride
 if ($width > $image_size[0] || $height > $image_size[1]) {
	if (CFG_ALLOW_LARGER  != 'True'){
		  $width=$image_size[0];
		  $height=$image_size[1];
		  $over_ride = true;
	}
 }
 // Add remaining image parameters if they exist
 if ($width) { 
$image .= ' width="' . tep_output_string($width) . '"'; 
 } 

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

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

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

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

 if ($fix_png && CFG_MASTER_SWITCH=="On") {
	$image .= ' onload="fixPNG(this)"'; 
 }

 $image .= '>';   
 return $image; 
}
//EOF Image Magic

Step #7 - Admin settings

Note: Before you change the settings, write down the current values so you can restore them in case of an error!

Go to the admin-section of your store (Configuration -> Images) and set:

* images width and height values to a value greater than zero

* calculate image sizes to true

* the width or height of the new image type - product information images

Now go to the Configuration -> Image Magic and set the options in there as required:

Note: Don't forget that with this contribution comes a new thumbnail size - The size of the image shown on your product information page - The setting for this is grouped with the rest of the image size configuration values in your admin panel in Configuration -> Images - You should go in there and set it, otherwise these images will display with the default width of 100.

** It is very important to note, that if you want your images to always display with the correct aspect ratio (height to width ratio) then you should only ever supply either a maximum height or a maximum width - NEVER both in the Configuration -> Images section of your admin panel. If you already have both set, then go in and change one of them to 0.

That's It! Now go try it out!

Optional Steps

Step #1 - Adding additional Truetype fonts and watermark images If you want to add additional fonts which can be used in your text watermarks, these should be Truetype format and uploaded in binary mode to your server. The correct location to place your own Truetype fonts is:

/catalog/includes/imagemagic/fonts/

You can also install custom graphics files to be added to your thumbnails as watermarks - The should be of type GIF, PNG or JPG and uploaded in binary mode to:

/catalog/includes/imagemagic/watermarks/

Step #2 - Enabling the IE. PNG work-around

If you want to use 24-bit PNG images with alpha channel transparency., unfortunately Internet Explorer contains a well documented bug that messes up the transparency of these type of images. Image Magic contains a work-around fix for this issue, which can be switched on or off from your control panel.

Before switching this feature on, you need to add the following code to two different files:

/catalog/includes/header.php - At the very end of the file ( after the final ?> )

/catalog/popup_image.php - Just before the </head> (not <head> - notice the forward slash)

The snippet of code to add is:

<!--[if gte IE 5.5000]>
  <script language="JavaScript"> var ie55up = true </script>
<![endif]-->
<script language="JavaScript">
function fixPNG(myImage) // correctly handle PNG transparency in Win IE 5.5 or higher.
  {
if (window.ie55up)
 {
 var imgID = (myImage.id) ? "id='" + myImage.id + "' " : ""
 var imgClass = (myImage.className) ? "class='" + myImage.className + "' " : ""
 var imgTitle = (myImage.title) ? "title='" + myImage.title + "' " : "title='" + myImage.alt + "' "
 var imgStyle = "display:inline-block;" + myImage.style.cssText 
 var strNewHTML = "<span " + imgID + imgClass + imgTitle
 strNewHTML += " style=\"" + "width:" + myImage.width + "px; height:" + myImage.height + "px;" + imgStyle + ";"
 strNewHTML += "filter:progid:DXImageTransform.Microsoft.AlphaImageLoader"
 strNewHTML += "(src=\'" + myImage.src + "\', sizingMethod='scale');\"></span>" 
 myImage.outerHTML = strNewHTML
 }
  }
</script>

Veronica · October 22, 2008

Hello, I dont find this contribution in oscommerce addons, somebody can send me this contribution to my email?? is vero_laspalmas_@hotmail.com thanks

edwin2 · October 23, 2008

We have OscMax + ImageMagic 1.16 site setup already.

However some bug occours.

desc.:

While we go to the product info page.

When ever the Main product image appear also on the other boxes. The image on the other boxes will all have incorrect size. The size will goes same as the Main Product Image size.

e.g. while viewing item A12345 product_info page. The item A12345 also appears on Sepcia box or Whats news box. The picture inside the Special or Whats new box will be same size as the product_info picture.

I believe it is due to the Image Magic tep_image function problem.

Anyone can help me with this?

chue · January 31, 2009

Tks for this post Snarg!!

Help me a lot....

Edited January 31, 2009 by chue

lowkey704 · March 23, 2009

where can I get the contrib? I can't find it... can someone post it in community / contribs?

or send it too me

I would be grateful!

Thanks,

Lonny

mortal · March 30, 2009

well. i added the latest version of this contribution to the contributions area

you find it here

http://addons.oscommerce.com/info/6637

let me state that i take no credit for this contribution. it is only TOM who made this possible. but enjoy this cool contribution.

March 30, 2009

well. i added the latest version of this contribution to the contributions area

you find it here

http://addons.oscommerce.com/info/6637

let me state that i take no credit for this contribution. it is only TOM who made this possible. but enjoy this cool contribution.

Interesting installation instructions............................did you look at them before uploading? :huh:

March 30, 2009

Interesting installation instructions............................did you look at them before uploading? :huh:

I uploaded the instructions I had for v1.14 minus the sql query. If anyone needs the sql query (it's in the zip files), I can post it.

edmore · March 30, 2009

Pla post a live demo for this add on. Thanks

pedro.antunes · March 30, 2009

Does it work with lightbox to show the image in a more modern way instead of a new browser window? What has to be changed?

Thanks for any feedback!

mortal · March 30, 2009

Interesting installation instructions............................did you look at them before uploading? :huh:

Well. i just made up a fast html document containing the install instructions. i dont really see the problem. just copy paste :)

i did not have that full install document. so cool that you had it :)

Edited March 30, 2009 by mortal

mortal · March 30, 2009

Does it work with lightbox to show the image in a more modern way instead of a new browser window? What has to be changed?

Thanks for any feedback!

well. you can use imagemagic for the thumbs. thats no problem. imagemagic works for all images using the tep_image function. but for the large image in lightbox. it does not work out of the box.

i have some mods but i paid for them so im not sure ill give them out for free.

mortal · March 30, 2009

Pla post a live demo for this add on. Thanks

well. its my testing shop. but feel free to test.

http://sparkle.oscom.dk/index.php

watermarks are not always activated. (i will activate them for a short while for your sake)

mortal · March 30, 2009

well. about those watermarks. it seems like thay are not working for me on this server as of now.

but i will try to fix this. so you can see the contrib in work

March 30, 2009

Well. i just made up a fast html document containing the install instructions. i dont really see the problem. just copy paste :)

i did not have that full install document. so cool that you had it :)

Looks okay now. When I first pulled it up all I saw was a page explaining how it worked with a dead link to the "install instructions" that used to be on the originator's Web site. Maybe I opened up the wrong file or something.

BTW, I could never get those pesky watermarks to work right either.

mortal · March 30, 2009

well. i got them working like a charm on another server. im trying to find out if this server is missing imageantialias()

so i know they are working. i even got it aet up with "events" such as new product, special price and so on. and then displaying a suiting watermark directly on the image. quiet sweet :)

btw. text watermark is working now

Edited March 30, 2009 by mortal

mortal · March 31, 2009

i just tested for imageantialias on the actual server. and the function is not there. but it is on the other working server. so that must be the issue. if you want to test if thats the case for you. you can use the following

<?php
if (function_exists('imageantialias')) {
echo "imageantialias functions are available.<br />\n";
} else {
echo "imageantialias functions are not available.<br />\n";
}
?>

pedro.antunes · March 31, 2009

well. its my testing shop. but feel free to test.

http://sparkle.oscom.dk/index.php

watermarks are not always activated. (i will activate them for a short while for your sake)

I see it working and I made a test. I see that the link to the picture is something like this:

http://sparkle.oscom.dk/imagemagic.php?img=images/microsoft/intkeyboardps2.gif&w=120&h=96&page=prod_info

If I change the link to:

http://sparkle.oscom.dk/images/microsoft/intkeyboardps2.gif

I see the picture without the watermark and I can steel it if I want... The problem is that the picture path is on the link to imagemagic, and while it's still there the original pic can be stolen.

I also see that you have lightbox, but it does not display the watermark.

mortal · March 31, 2009

Hi Pedro Antunes. i never claimed that it was not possible to steal the image. why did you think so ?

i have now encrypted the filename and path. for you sake. besides. its impossible to prevent stealing except for watermarks (encryption not working for lightbox)

and as i wrote. the watermark does not work with lightbox. but i have mods elsewhere. that is made compatible with lightbox. they are not included in this free package im working here. (designet for the danish marked)

Edited March 31, 2009 by mortal

pedro.antunes · April 6, 2009

Hi Pedro Antunes. i never claimed that it was not possible to steal the image. why did you think so ?

Hi mortal,

As said in this addon page (http://addons.oscommerce.com/info/6637):

"(...) it also contains a very comprehensive toolbox of 'on-the-fly' image processing functions to both improve your images and, perhaps more importantly, protect them from theft and unauthorized use by your competitors (...)".

It was written by you, I guess, so I supposed you could not get the image...

mortal · April 6, 2009

Hi mortal,

As said in this addon page (http://addons.oscommerce.com/info/6637):

"(...) it also contains a very comprehensive toolbox of 'on-the-fly' image processing functions to both improve your images and, perhaps more importantly, protect them from theft and unauthorized use by your competitors (...)".

It was written by you, I guess, so I supposed you could not get the image...

Hi :) no. it is not written by me. as "I" write in the very first line. (Allright. as per request in forum im now adding a contribution not made by me)

the text you are referring to is made by the original author. secondly. i never claimed that the pictures on my page was protected. but it is possible to protect them. either by watermark or by encryption (but still not when using 3rd party contributions)

mondeo79 · April 7, 2009

Does anyone have any idea how to apply imagemagic to additional images popups? Im using Additional Images Module here

My main product image does exactly what it should and all my additional image thumbnails reduce in size correctly, the names are encrypted and they are using imagemagic.php but the popup for each of the additional images does not use imagemagic and as a result they are not encrypted and are not watermarked but the main product image is.

I assume they are both using tep_image() so am struggling to understand why the additional popups dont seem to work as expected - can anyone provide any help please?

Thank you

Jason

mondeo79 · April 7, 2009

Problem solved, needed to add a line to tep_image definition in includes/functions/html_output.php:

Find:

//Detect whether this is a pop-up image

if (strstr($_SERVER['PHP_SELF'],"popup_image.php")) $page="popup";

Add after it:

if (strstr($_SERVER['PHP_SELF'],"popup_add_image.php")) $page="popup";

Support thread for the Image Magic contribution

Recommended Posts

Link to comment

Share on other sites

Top Posters In This Topic

Popular Days

Top Posters In This Topic

Popular Days

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Guest

Link to comment

Share on other sites

Guest

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Guest

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Join the conversation