X-Cart forums - Detailed Images Popup with Automatic Window Sizing

X-Cart forums (https://forum.x-cart.com/index.php)

- Dev Questions (https://forum.x-cart.com/forumdisplay.php?f=20)

- - Detailed Images Popup with Automatic Window Sizing (https://forum.x-cart.com/showthread.php?t=4036)

Detailed Images Popup with Automatic Window Sizing

This is my mod to do it ... difference is the popup window resizes to the size of the image. UPDATED: Previously the window resizes after the image was loaded, which would not work on some browsers, code has been changed so that the window opens the correct size and doesn't require a resize! I havn't tested it on mozilla thou, but should work. Can jpsowin please comment if this new method works. Thanks

create a new file called 'view_product_image.php' in the main xcart directory with the following content :

Quote:

<HTML>
<HEAD>
<TITLE>
<?php echo $product . " - " . $imagename ?>
</TITLE>
<Script>
function picloaded() {
picture.alt = "";
}
</script>
</head>
<BODY leftmargin=0 topmargin=0 onload="picloaded()">
[img]product_image.php?imageid=<?php echo $imageid ?>[/img]
</body>
</html>

Next, modify customer/main/product.tpl by removing the existing link to the detail product images and placing the following just under the product thumbnail:

Quote:

{if $active_modules.Detailed_Product_Images ne ""}
{include file="modules/Detailed_Product_Images/product_images_links.tpl" product=$product.product}
{/if}

Now create a file called product_images_links.tpl in modules/Detailed_Product_Images/ with the following content

Quote:

{if $images ne ""}
{literal}
<script>
function viewpic(imageid,imagename,imagex,imagey) {
url = "/view_product_image.php?imageid=" + imageid + "&imagename=" + imagename + "&product={/literal}{$product}{literal}";
window.open (url, null,"width=" + imagex + ",height=" + imagey + ",left=20,top=20");
}
</script>
{/literal}
<table width=90% cellpadding=0 cellspacing=0 border=0>
<tr><font color="#ff0000">Detailed Images</font></td></tr>
<tr><td class=Line height="1">[img]{$ImagesDir}/spacer.gif[/img]</td></tr>
<tr><td><font size="1"></font></td></tr>
{section name=image loop=$images}
{if $images[image].avail eq "Y"}
<tr><td>{$images[image].alt}</td></tr>
{/if}
{/section}
</table>
{/if}

And thats it .. you might want to change the product_images_links.tpl template to match the style of your site.

Examples ...

A product with detailed images
http://shop.cglass.co.uk/customer/product.php?productid=16138&cat=&page=

A product with no detailed image
http://shop.cglass.co.uk/customer/product.php?productid=16242&cat=&page=

Doesn't autoresize with Mozilla... (I'm using 1.5a)
Just thought I'd let you know :)
It also will not let you resize it manually, so the people it doesn't work for are gonna be frustrated.

Better post a reply so you lot know i've updated the script ...

UPDATED: Previously the window resizes after the image was loaded, which would not work on some browsers, code has been changed so that the window opens the correct size and doesn't require a resize! I havn't tested it on mozilla thou, but should work. Can jpsowin please comment if this new method works. Thanks

Thanks darrenkierman, the mod works perfect!

Took me awhile to work it all in.. but looks so much better then the big image on the same page..

This mod should be in the next version..

darrenkierman,

Great mod! I have it working fine on version 3.4.9. I did have to make one slight change to get the image to display (due to the directory where I have X-cart installed). I figured I would mention it in case anyone else has the same problem. I had to adjust the relative path (I believe that is what it's called) of one URL's in the "product_images_links.tpl" from

This

Quote:

url = "/view_product_image.php?imageid="

To This

Quote:

url = "../view_product_image.php?imageid="

Other than that it worked perfect.

Thanks for the mod.
Bob

I was SO hoping this would work...but it didn't for me.

I think it's because I have used the option to store images as files, instead of in the DB.

I can't find any sign of "product_image.php" anywhere.

Can someone help me out and tell me how to do this when I've got product image in the file system, instead of the DB?

Krish Mandal
COMING SOON: fineartphotogifts.com

Quote:

Originally Posted by krishmandal

I can't find any sign of "product_image.php" anywhere.

you don't need it ... as you are creating a new image viewing script called 'view_product_image.php'.

for your information ..., product_image.php wasn't coded to use it within a popup window, therefore had to write my own which removes the margins and puts a title on the popup window.

I actually got this to work, but as an offshoot hack (ugly hack, at that). I figured out what the problem was...I changed early on from storing images in the database to the file system. The port over went without a hitch, except for some small CHMOD-ing.

So, when you choose to have the detailed images in the file system, each images is called d_something, like d_12, d_13 etc. So I used most of the hack, and then changed the right things so that it loads a d_image number.jpg file, and that works.

Krish Mandal
COMING SOON: fineartphotogifts.com

Seems to work in Moz/Firebird from what I can tell...

Quote:

Originally Posted by darrenkierman

Quote:

Originally Posted by krishmandal

I can't find any sign of "product_image.php" anywhere.

Hey!! Actually, after seeing that the detail images in my admin for product-modify weren't showing up, I got suspicious. Looks like you do need product_image.php after all. The detailed images in the admin view don't show if you don't have it, AND that's why the hack didn't work for me initially, because your mod does indeed need the product_image.php to work:

Code:

[img]product_image.php?imageid=<?php echo $imageid ?>[/img]

See the "src=" part?

So I downloaded the installation tarball, found product_image.php, and put it back where I suspected it should be (right in the /xcart directory, or in my case the /shop directory) and everything is now working as you said it should.

Now I don't need my ugly hack. Whew. Glad I'm not nuts. So far.

Krish Mandal
COMING SOON: fineartphotogifts.com