product_info.php images

[sanctuarybookshop]

I apologise if this as been raised already, but on the product_info page the product image displays once then disappears then reappears again shortly afterwards.Is this a common problem and does anybody know of a workaround?I use large product images on some of my items.This is the section of code I suspect is the problem

 

<?php

if (tep_not_null($product_info['products_image'] and $product_info['products_id'] <52 or $product_info['products_id'] >66)) {

$photoset_layout = '1';

 

$pi_query = tep_db_query("select image, htmlcontent from " . TABLE_PRODUCTS_IMAGES . " where products_id = '" . (int)$product_info['products_id'] . "' order by sort_order");

$pi_total = tep_db_num_rows($pi_query);

 

if ($pi_total > 0) {

$pi_sub = $pi_total-1;

 

while ($pi_sub > 5) {

$photoset_layout .= 5;

$pi_sub = $pi_sub-5;

}

 

if ($pi_sub > 0) {

$photoset_layout .= ($pi_total > 5) ? 5 : $pi_sub;

}

?>

 

<div id="piGal">

 

<?php

$pi_counter = 0;

$pi_html = array();

 

while ($pi = tep_db_fetch_array($pi_query)) {

$pi_counter++;

 

if (tep_not_null($pi['htmlcontent'])) {

$pi_html[] = '<div id="piGalDiv_' . $pi_counter . '">' . $pi['htmlcontent'] . '</div>';

}

 

echo tep_image(DIR_WS_IMAGES . $pi['image'], '', '', '', 'id="piGalImg_' . $pi_counter . '"');

}

?>

 

</div>

 

<?php

if ( !empty($pi_html) ) {

echo ' <div style="display: none;">' . implode('', $pi_html) . '</div>';

}

} else {

?>

 

<div id="piGal">

<?php echo tep_image(DIR_WS_IMAGES . $product_info['products_image'], addslashes($product_info['products_name'])); ?>

</div>

 

<?php

}

}

?>

 

<script type="text/javascript">

$(function() {

$('#piGal').css({

'visibility': 'hidden'

});

 

$('#piGal').photosetGrid({

layout: '<?php echo $photoset_layout; ?>',

width: '250px',

highresLinks: true,

rel: 'pigallery',

onComplete: function() {

$('#piGal').css({ 'visibility': 'visible'});

 

$('#piGal a').colorbox({

maxHeight: '90%',

maxWidth: '90%',

rel: 'pigallery'

});

 

$('#piGal img').each(function() {

var imgid = $(this).attr('id').substring(9);

 

if ( $('#piGalDiv_' + imgid).length ) {

$(this).parent().colorbox({ inline: true, href: "#piGalDiv_" + imgid });

}

});

}

});

});

</script>

<p>

[BrockleyJohn]

Looks to me like standard code, except for the hard-coded not displaying images for products from 52-66, and except for the paragraph immediately following the script, where I would expect to see the product description. Which exact version is it?

 

I first misread your problem to be that the image was appearing several times, but actually you're talking about how the page loads, aren't you?

 

So, when you say you have some large images, how large are they?

 

Have you done anything else that might affect the page load time - any addons in product_info?

[sanctuarybookshop]

I not sure if the large images are the issue, I'd have to double check but I think they are a standard size.

 

Here are two links that might help show what is happening :-

 

http://sanctuarybooks.co.uk/catalog/product_info.php/cPath/7/products_id/98

 

 

http://sanctuarybooks.co.uk/catalog/product_info.php/products_id/392

 

 

I think this part of the code is the problem, my understanding is it displays the first image, then the large images afterwards, somewhere between the two it's as if it blanks the displayed image then redisplays it :-

 

 

<div id="piGal">

 

<?php

$pi_counter = 0;

$pi_html = array();

 

while ($pi = tep_db_fetch_array($pi_query)) {

$pi_counter++;

 

if (tep_not_null($pi['htmlcontent'])) {

$pi_html[] = '<div id="piGalDiv_' . $pi_counter . '">' . $pi['htmlcontent'] . '</div>';

}

 

echo tep_image(DIR_WS_IMAGES . $pi['image'], '', '', '', 'id="piGalImg_' . $pi_counter . '"');

}

?>

 

</div>

 

<?php

if ( !empty($pi_html) ) {

echo ' <div style="display: none;">' . implode('', $pi_html) . '</div>';

}

} else {

?>

 

<div id="piGal">

<?php echo tep_image(DIR_WS_IMAGES . $product_info['products_image'], addslashes($product_info['products_name'])); ?>

</div>

 

<?php

}

}

?>

[sanctuarybookshop]

Little add on - just replaced product_info.php with the original unedited file and it still has the same issue, so it doesn't seem to be that, I don't think its loading times because in the following code if I change the width and maximum width and height values then the image displays at normal size then goes off then appears again at the size special died by the edited values -

 

<script type="text/javascript">

$(function() {

$('#piGal').css({

'visibility': 'hidden'

});

 

$('#piGal').photosetGrid({

layout: '<?php echo $photoset_layout; ?>',

width: '250px',

highresLinks: true,

rel: 'pigallery',

onComplete: function() {

$('#piGal').css({ 'visibility': 'visible'});

 

$('#piGal a').colorbox({

maxHeight: '90%',

maxWidth: '90%',

rel: 'pigallery'

});

[Dan Cole]

@@sanctuarybookshop

 

Seems to work okay when I view it.

 

Dan

[Dan Cole]

@@sanctuarybookshop

 

This thread may help...

 

http://www.oscommerce.com/forums/topic/397406-how-to-fix-images-disappearing-in-product-infophp/?p=1700906

 

Dan

[BrockleyJohn]

I'm guessing it's the first thing at the top of your page that screws everything up:

<link href="https://www.google.co.uk/maps/dir/''/doncaster+christian+book+market/data=!4m5!4m4!1m0!1m2!1m1!1s0x48790dd084045cad:0xab062bacb58d1234?sa=X&ei=azsCVYCWB4msU8OkgsAC&ved=0CJUBEPUXMAw"><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="en">
<head>

Some browsers will just ignore that tag, while others might try and load your googlemaps page as a script, or stylesheet or something. I assume you've pasted it in includes/template_top.php 

 

An actual link you click on should be of the format <a href="url">some text</a> and is in the body of the page while the <link href="url"> format is for loading in external scripts and stylesheets and is in the head. 

 

Get rid of the bit before the <!DOCTYPE

[sanctuarybookshop]

Thank you for that, I didn't spot that, it certainly shouldn't be there as the Google maps directions is on a separate page, so there's no need for it to be in template_top.

 

I'll have a look and let you know if it helps

[sanctuarybookshop]

I've just changed the 'hidden' to 'visible' in the following code.

 

<script type="text/javascript">

$(function() {

$('#piGal').css({

'visibility': 'hidden'

});

 

$('#piGal').photosetGrid({

layout: '<?php echo $photoset_layout; ?>',

width: '250px',

highresLinks: true,

rel: 'pigallery',

onComplete: function() {

$('#piGal').css({ 'visibility': 'visible'});

 

That solved the issue with the image disappearing then reappearing, although there is still a problem with when having large images on a product.

 

http://sanctuarybooks.co.uk/catalog/product_info.php/manufacturers_id/245/products_id/392

 

On clicking this link the 3 images associated appear one below the other, then are replaced by the correct layout of one image with two underneath side by side.

 

Something I need to investigate in more detail, it doesn't appear to be related to the Google maps code referred to in earlier post by John Brockley. I not sure why it appears in product_info.php as a link is provided in the info box labeled as Get Directions which loads the page locateus.php which allows me to enter a location to get directions to our stall.

 

Getting so close to solving it though I'm sure

[BrockleyJohn]

In my browser, you've now got even more nonsense at the top of your code, not less. Have you checked template top? You seem to have made a mistake in implementing Customer Testimonials addon, and that is now adding even more to the code outside the page.

 

Making changes to the script might change the symptoms of your problem but it's probably not going to cure it completely. 

 

The thumbnail in the What's New box loads like an electric shutter coming down.

 

I recommend you make the page valid html before you spend too long fiddling with scripts to change the behaviour. It might not behave the same when you've fixed it.

 

To find where the Google code comes from, try searching through your codebase for the string as it appears. The real link won't look like that as it has a different format.

 

The Customer Testimonials bit is a style tag, so I'm guessing that was meant for template_top.

[sanctuarybookshop]

Thanks for that, I'll have a look on laptop as I'm looking from tablet at the moment

[sanctuarybookshop]

Found the place where the google link was coming from. Have removed that part, next part is the <head> section before the <!doctype> section

[sanctuarybookshop]

Having removed all the suspected problem code before the <doctype> tag and still having the same issue, I removed differences between the stock product_info.php and the 'live' version of product_info.php for stock notification and it cleared up all the problems been encountered. I can live without it giving all the aggro it's been causing.

 

Thanks for all your assistance guys!

[BrockleyJohn]

Glad to hear the problem's gone but not that you had to back out a feature you wanted to make it go.

 

But if you can narrow it down to a particular addon and it has a support thread, that's a good place to check/ask if anyone else had the same problem and how they fixed it.

 

If it doesn't have a support thread, hmmm...