Image Manager addon

Should I be looking in my js folder or the php file that calls the function?

Just reporting a few things back...

i) Possible bug:
I had deleted the uploads folder a while back just to keep things as clean and secure as possible and as it turns out IM doesn't like this. Even-though I specified a folder other than the uploads folder & IM acknowledged said folder and stated the rights were correct IM would not re-upload until I created a images/uploads/ folder. FYI I'm still using an alternate folder for temp. but now that the uploads/ folder exists I no longer get any errors and the image is re-uploaded.

ii) The suggested method of changing the Maximum Large Image Width/Height in the config to match the small image sizes and re-uploading in the hopes IM will add the image as LRG as well doesn't work. I don't get any errors but IM still shows it as "missing".

Also, on a somewhat unrelated note, I'd like to suggest the ability to rename file extensions. That would be awesome. From my perspective this would be nice because many files were uploaded as .jpeg instead of .jpg. In trying to maintain consistency throughout my site, I've been diligently renaming these. But it's somewhat painful to do. If IM could do this it'd be great!

Now that I think of it, would it not be simpler to just add a upload link when a large is deemed "missing"?

I think the problem with the workaround of changing the config to the small size is that 1) IM complains it's less than that of the admin setting(dunno if that is actually a factor) and 2) if the image size is different in height or in width you can't accommodate that. ie I think in many cases product images are not square. In my case almost none are...Since IM doesn't like a setting of 0 for height or width it will never ask to "use small" if one of the dimensions is under the value set.

boudewijn:

What JS do you have for displaying the large images?

The file is called xdarkbox.js

$(document).ready(function() {

		$('#productMainImage a').click(function() {
			
			var link = $(this);
	
			if(!$('div.darkbox-frame').length) {
				
				darkbox = $('<div class="darkbox-frame"><div class="darkbox-shadow"></div><div class="darkbox-canvas"><div class="darkbox-button"></div></div></div>').appendTo('body');
			}

			var frame = darkbox.clone().appendTo('body').addClass('darkbox-frame-on');

			var shadow = frame.find('div.darkbox-shadow').animate({opacity:0.8},300);
			var canvas = frame.find('div.darkbox-canvas');
			var button = frame.find('div.darkbox-button');

			var image = $('<img src="'+ link.attr('href') +'" alt="'+ link.attr('title') +'"/>');

			image.appendTo(canvas);
			image.load(function(){

				var imageWidth = image.width();
				var imageHeight = image.height();
				var frameWidth = frame.width()-40;
				var frameHeight = frame.height()-40;

				if(imageWidth > frameWidth) {

					imageWidth = frameWidth;
					image.width(imageWidth);					
					while(image.height() > frameHeight) {
						image.width(imageWidth);
						imageWidth--;
					}

					imageHeight = image.height();
				}

				if(imageHeight > frameHeight) {

					imageHeight = frameHeight;
					image.height(imageHeight);						
					while(image.width() > frameWidth) {
						image.height(imageHeight);
						imageHeight--;
					}

					imageWidth = image.width();
				}
				
				canvas.addClass('darkbox-canvas-load').animate({

					width:imageWidth,
					marginLeft:-imageWidth/2,
					height:imageHeight,
					marginTop:-imageHeight/2

				},500,function() {

					canvas.addClass('darkbox-canvas-done');
					button.addClass('darkbox-button-on');
					button.addClass(navigator.platform.toLowerCase().indexOf('mac')+1?'darkbox-button-left':'darkbox-button-right');

					image.animate({opacity:1},500,function() {

						shadow.click(closer);
						button.click(closer);

					});
				});
			});

			var closer = function() {
		
				canvas.remove();
				shadow.animate({opacity:0},300,function() {
					frame.remove();
				});
			}

			$(document).keydown(function(e) {
				if(e.which==27) closer();
			});

			return false;
		});
	});

This is a continuation of the email conversation we had, but might be beneficial to someone here.

Originally, I was uploading .png images and was having background color problems. That got sorted and continued to upload the transparent background .png photos for the products.

There are 3 product images per product (different views). All the images are the same original size: 300 x 450

When creating the product, I upload the first image as per usual. Then I go to Image Manager and:

1. Copy from Small for Large and Medium sizes.

2. "SHRINK" the small image.

3. Add in the additional 2nd and 3rd product images.

4. Copy from Small for Large and Medium sizes.

5. Combined replace/resize for the small image.

If I accidentally do Combined replace/resize for the first image, the Large version of the image is fuzzy. That does not happen for the 2nd and 3rd additional images. I do not know why the first image's "small" needs to be treated differently than the 2 additional image's "small".

Now, to try and correct the fuzzy large image, I wipe out ALL 3 product images for that particular product and delete manually those product images via FTP. Then I go back into editing the product and upload the first product image. Then go back to IM to do the process all over again, this time correctly doing "shrink" on the first image's "small" .... however, this does not correct the issue. It's almost as if IM keeps a memory. No matter what I do, I can't fix the problem on those images.

Any suggestions?

Here is one product for example ... for the main product image, click to enlarge and you will see the fuzziness. I accidentally clicked "Combined replace/resize" for the small version of it. Whereas, I've been doing "ShrinK" for the main product image with no problems.

http://www.caofficedesign.com/shop/index.php?main_page=product_info&cPath=1_2_24&products_id=58

And this one, I did "shrink" for the first image and the large version is just fine.

http://www.caofficedesign.com/shop/index.php?main_page=product_info&cPath=1_2_24&products_id=59

:no: :frusty: Confused.

Why do you have to do "shrink" for the first image's small version and "combined replace/resize" for the 2nd and 3rd image's small version?

And why does wiping all 3 product images completely from the system and reloading them NOT fix the large image fuzzy issue when I reload them correctly the 2nd time (ie, do shrink on the 1st product image's small version)????

beyre:

This is a continuation of the email conversation we had, but might be beneficial to someone here.

Originally, I was uploading .png images and was having background color problems. That got sorted and continued to upload the transparent background .png photos for the products.

There are 3 product images per product (different views). All the images are the same original size: 300 x 450

When creating the product, I upload the first image as per usual. Then I go to Image Manager and:

1. Copy from Small for Large and Medium sizes.

2. "SHRINK" the small image.

3. Add in the additional 2nd and 3rd product images.

4. Copy from Small for Large and Medium sizes.

5. Combined replace/resize for the small image.

If I accidentally do Combined replace/resize for the first image, the Large version of the image is fuzzy. That does not happen for the 2nd and 3rd additional images. I do not know why the first image's "small" needs to be treated differently than the 2 additional image's "small".

Now, to try and correct the fuzzy large image, I wipe out ALL 3 product images for that particular product and delete manually those product images via FTP. Then I go back into editing the product and upload the first product image. Then go back to IM to do the process all over again, this time correctly doing "shrink" on the first image's "small" .... however, this does not correct the issue. It's almost as if IM keeps a memory. No matter what I do, I can't fix the problem on those images.

Any suggestions?

Here is one product for example ... for the main product image, click to enlarge and you will see the fuzziness. I accidentally clicked "Combined replace/resize" for the small version of it. Whereas, I've been doing "ShrinK" for the main product image with no problems.

http://www.caofficedesign.com/shop/index.php?main_page=product_info&cPath=1_2_24&products_id=58

And this one, I did "shrink" for the first image and the large version is just fine.

http://www.caofficedesign.com/shop/index.php?main_page=product_info&cPath=1_2_24&products_id=59

:no: :frusty: Confused.

Why do you have to do "shrink" for the first image's small version and "combined replace/resize" for the 2nd and 3rd image's small version?

And why does wiping all 3 product images completely from the system and reloading them NOT fix the large image fuzzy issue when I reload them correctly the 2nd time (ie, do shrink on the 1st product image's small version)????

What strikes me, is that the popup link for the additional images is different from that of the main image. The additional image links explicitly point to the large image, while the main image link does not. So I'm not sure that the large image of the main picture actually is displayed in the popup.

familynow:

i) Possible bug:
I had deleted the uploads folder a while back just to keep things as clean and secure as possible and as it turns out IM doesn't like this. Even-though I specified a folder other than the uploads folder & IM acknowledged said folder and stated the rights were correct IM would not re-upload until I created a images/uploads/ folder. FYI I'm still using an alternate folder for temp. but now that the uploads/ folder exists I no longer get any errors and the image is re-uploaded.

This actually was a bug. It will be fixed in the next version of IM. Thanks for noticing and reporting!

familynow:

ii) The suggested method of changing the Maximum Large Image Width/Height in the config to match the small image sizes and re-uploading in the hopes IM will add the image as LRG as well doesn't work. I don't get any errors but IM still shows it as "missing".

I'm getting convinced that all the time, we try to make a work around in IM for a disfunction somewhere else. ZC by default fixes missing large and even medium size images by adjusting the filename to a file that is present, with a lower resolution. Apparantly, darkbox doesn't make use of this ability. So I think the problem is there.
From the JS I cannot read (which may be my lack of knowledge of JS) what image name is passed to the script. Likely that is in the PHP code of the page.

familynow:

Also, on a somewhat unrelated note, I'd like to suggest the ability to rename file extensions. That would be awesome. From my perspective this would be nice because many files were uploaded as .jpeg instead of .jpg. In trying to maintain consistency throughout my site, I've been diligently renaming these. But it's somewhat painful to do. If IM could do this it'd be great!

I'm not sure how to do that. In any case it will affect the products information, which mentiones the filename of the image. Furthermore, I don't want to introduce an open rename method that enables you to rename anything to anything. So what rules should apply to a rename action?

boudewijn:

What strikes me, is that the popup link for the additional images is different from that of the main image. The additional image links explicitly point to the large image, while the main image link does not. So I'm not sure that the large image of the main picture actually is displayed in the popup.

Ok ... so ... what do I do?

I haven't altered any of the image links in regards to customizing ZC, other than whatever your addon alters. So I don't know why the popup link would be different than what it should be.

Right now, I'm replacing the Monthly Specials products as it is a new month, thus new products on special.

The first product I changed was the Laminate Conference Table and the popup image is fuzzy. And that was after completely deleting the original (previous product's) image and uploading the new product's image.

Just to clarify, I do not have a problem when uploading a product pic for the first time. But if I have to replace a product pic, that is when I have a problem with the fuzziness factor.

Have vs 1.9 installed (ZenCart 1.5 store) and all works well but I have no "Delete File" option for resized Large images. I do notice that the Large image dimensions remain in red even after correctly resizing and Medium images (with delete option) are in black. Any ideas on why I have no Delete option for my Large images?

I think I've got this working with the additions of:

$images[$image]["large"]["delete_link"] = ($dirread[DIR_FS_CATALOG_IMAGES . "large/" . $p["dirname"]] == true && IMFileIsWriteable($filename_large) ? $partlink. "&actcnt=" . ($_SESSION["actcnt"] + 1) . "&IMaction=deletefile&filename=" . urlencode('large/' . $p["dirname"] . $p["filename"] . IMAGE_SUFFIX_LARGE . "." . $p["extension"]) . "" onclick="return confirm('" . IM_CONFIRM_SINGLE_DELETE . "');" />". IM_IMAGE_DELETE . "</a>" : "");

at line 358 of the function_image_manager.php file.

Please let me know if this is an acceptable solution or if this will cause other problems?

OK, just needed to get one of my original images with the txt extension, and changing it back to a jpg corrupted the image. Seems to happen with every transition from txt to jpg extension, but did not happen with the former bak extension. Is there a safe way to convert the txt back to a jpg, or is the change to a txt file for backup just always going to result in a corrupt image?

Hi Boudewijn,

I'll start by thanking you for an absolutely brilliant addon! I intend on sending some ahem appreciation your way as soon as possible :cool:

I've been messing around with various photo editing programs for days, trying to master batch processing etc. etc. etc. - this addon is *exactly *what I've been looking for (and more!) Although, I do have one small issue with the "Autofix" feature: the issue is essentially the same one that mutinyzoo mentioned here, except it's only happening with the "Autofix" feature. Clicking the "Combined replace/resize" button manually on an individual basis works as expected. I'm using Image Manager 1.9 on Zen Cart 1.5.1 with PHP 5.3.13.

To be honest I'm quite happy to click the "Combined replace/resize" for each image as I only have a few hundred total images, but I just wanted to make you aware of the issue and get any feedback from you if possible.

Thanks :smile:

ZC 1.5.1

Simply trying to removed unused (products no longer active) images from my server. Is this the correct Add - on. I use 1.5.1 I have 18K products and 100K images. Something is wrong and I need to get rid of some images that apparently should not be on the server.

Thank you.

Hi,

Running ZC 1.5.0 and Image Manager 1.9 . Thought when I look at it on the control panel in admin it says it is version 1.7 which is confusing. I confirmed that the download said it was v1.9 . Anyway according to my client that is using the plugin he selects the following options:
All images
not attached
with errors

These options show him every image in the directory including category images and product images still in use.

Any idea why this would be happening?

hi all
My install is zc 1.5.0, php 5 & mysql 5, using IM 1.9 even though it says 1.7 in admin is this right? My install is in a sub folder and my pics reside in /images/large/gifs/ folder. I dont use small or medium pics, the main reason for install was the watermark and tidy up utilities :) All seemed to install ok, i can view unattached files ok but when i go to view attached files which in my test site which i only have about 100 pics, i get the error message:

Fatal error: Allowed memory size of 73400320 bytes exhausted (tried to allocate 80 bytes) in /mnt/vol1/home/h/i//public_html/zen/adm****/includes/functions/extra_functions/function_image_manager.php on line 140

which i believe from previous posts that its a server memory error ? but should this do this with only 100 large pics? they are sized 500 x various.

When IM installed it created the folders listed below is this right?

Messages
Watermarks are present for: medium, large.
Folder created: /mnt/vol1/home/h/i//public_html/zen****/images/medium/large/gifs/
Folder created: /mnt/vol1/home/h/i//public_html/zen****/images/large/large/gifs/
Folder rights are sufficient

If i view one pic by product id it shows ok with all links, but even thought its in the large/gifs/ folder its showing as a small image saying med & large images are missing? Any advice would be appreciated, its a great plugin and would like to get it working right. Is the problem related to me having large pics only and them beingg there before install?

cheers dessy

Does anybody know how to do what I'm suggesting.
In admin under configuration/Image manager there is a setting for additional images. The setting if for inserting additional images for your product when you turn it on like down below.

Show "Add additional image link" link
When set to 'yes', Image Manager will display a link to upload a new additional image for a product.
You can upload an image with any name; IM will store the image under the name already known, with the specified suffix added.
This option will only show up in 'attached' mode, after first selecting a specific products-ID in the right upper box.

If the uploaded image is large enough, it can be used to also recreate the medium and large size images.
Is there a way to add the upload link to all product id's instead of just one product id when adding additional images under tools. This seems like it will take a long time looking up product id's to add additional images.

Admin/catalog/category
is there a way to add this to the product category page like the image handler has it so you can click on whatever product you would like to add additional images to. Thanks In advance

Does anyone have this running with 1.52 zencart version? It was working, but since upgrade I notice it won't do combine / resize etc. Permissions are okay and sufficient. Cheers

Hi all!
For all of you that want to preserve the transparency of images, I added this function:

function setTransparency($new,$temp) 
  
    { 
        
            $transparencyIndex = imagecolortransparent($temp); 
            $transparencyColor = array('red' => 255, 'green' => 255, 'blue' => 255); 
             
            if ($transparencyIndex >= 0) { 
                $transparencyColor    = imagecolorsforindex($temp, $transparencyIndex);    
            } 
            
            $transparencyIndex    = imagecolorallocate($new, $transparencyColor['red'], $transparencyColor['green'], $transparencyColor['blue']); 
            imagefill($new, 0, 0, $transparencyIndex); 
             imagecolortransparent($new, $transparencyIndex); 
        
    } 

You can call it with setTransparency($new,$temp);
just before imagecopyresampled($new, $temp, 0, 0, 0, 0, $dst_w, $dst_h, $org_w, $org_h);

Thank you very much to Boudewijn for this fantastic mod. For next reviews, it must have a direct link at the product edit screen. anybody?