Image Handler 4 (for v1.5.x) Support Thread

[DivaVocals]

Nope, don't see the problem. The picture of the two delicious looking drinks appears bounded by the resulting popup window sized at 431 x 550 pixels which matches the bmz_cache end description.

That site is not the one I posted before with the issue.. See the EyeItalia site.. That's the site where I am using your code.. The site with the delicious drinks is using the OLD IH4 code, and works correctly.. See my previous post below...

This isn't fully working for me.. While the correct additional image is pulled from the bmz_cache folder and is now showing in the popup, the popup window itself is not sized correctly.. (see here: http://eitestsite(dot)eyeitalia(dot)com/shop/index.php?main_page=product_info&cPath=44&products_id=331)

[mc12345678]

That site is not the one I posted before with the issue.. See the EyeItalia site.. That's the site where I am using your code.. The site with the delicious drinks is using the OLD IH4 code, and works correctly.. See my previous post below...

Okay, sorry, glad that I described what I saw. So, with the eyeitalia site, I see that the image is 250x600 with a bmz resize of 600x600 and the border of the window is to the sides of the image at that dimension. So, what would be expected to be different? Should the height be 550?

With the code copied, which version of the all caps height and width was used? could you try replacing with the $ih variable(s)? $ihConf['large']['width'] and $ihConf['large']['height'] respectively.

[mc12345678]

Okay, sorry, glad that I described what I saw. So, with the eyeitalia site, I see that the image is 250x600 with a bmz resize of 600x600 and the border of the window is to the sides of the image at that dimension. So, what would be expected to be different? Should the height be 550?

With the code copied, which version of the all caps height and width was used? could you try replacing with the $ih variable(s)? $ihConf['large']['width'] and $ihConf['large']['height'] respectively.

(Timed out on edit) Also, be sure that you are using the code snippets (with applicable replacements) that were posted to this forum. I realize I may have sent some code earlier, but I would say that the code has been simplified and as said seems to be working on my site at whatever size I set the maximum to in the admin area.

[DivaVocals]

(Timed out on edit) Also, be sure that you are using the code snippets (with applicable replacements) that were posted to this forum. I realize I may have sent some code earlier, but I would say that the code has been simplified and as said seems to be working on my site at whatever size I set the maximum to in the admin area.

I used the code you posted to this thread.. I updated the additional_images.php module file with the code you posted, and reverted the tpl_main_image.php popup file to the version in the IH4 v4.3.1 fileset.. The result is that the popup DOES show the correct image from the bmz_cache instead of the "no image" product picture.. The problem is that the popup window does not re-size to match the size of the image displayed in the popup.

additional images code used

  for ($i=0, $n=$num_images; $i<$n; $i++) {
    $file = $images_array[$i];
    $products_image_large = str_replace(DIR_WS_IMAGES, DIR_WS_IMAGES . 'large/', $products_image_directory) . str_replace($products_image_extension, '', $file) . IMAGE_SUFFIX_LARGE . $products_image_extension;
//  Begin Image Handler changes 1 of 2
//next line is commented out for Image Handler
    if (function_exists('handle_image')) {
        $newimg = handle_image($products_image_large, addslashes($products_name), LARGE_IMAGE_WIDTH, LARGE_IMAGE_HEIGHT);
        list($src, $alt, $width, $height, $parameters) = $newimg;

        $products_image_large = zen_output_string($src);
    } 
    
    $flag_has_large = file_exists($products_image_large);
//  End Image Handler changes 1 of 2
    $products_image_large = ($flag_has_large ? $products_image_large : $products_image_directory . $file);
    $flag_display_large = (IMAGE_ADDITIONAL_DISPLAY_LINK_EVEN_WHEN_NO_LARGE == 'Yes' || $flag_has_large);
    $base_image = $products_image_directory . $file;
    $thumb_slashes = zen_image(addslashes($base_image), addslashes($products_name), SMALL_IMAGE_WIDTH, SMALL_IMAGE_HEIGHT);
//  Begin Image Handler changes 2 of 2
//  remove additional single quotes from image attributes (important!)
    $thumb_slashes = preg_replace("/([^\\\\])'/", '$1\\\'', $thumb_slashes);
//  End Image Handler changes 2 of 2
    $thumb_regular = zen_image($base_image, $products_name, SMALL_IMAGE_WIDTH, SMALL_IMAGE_HEIGHT);
    $large_link = zen_href_link(FILENAME_POPUP_IMAGE_ADDITIONAL, 'pID=' . $_GET['products_id'] . '&pic=' . $i . '&products_image_large_additional=' . $products_image_large);

    // Link Preparation:
      $script_link = '<script language="javascript" type="text/javascript"><!--' . "\n" . 'document.write(\'' . ($flag_display_large ? '<a href="javascript:popupWindow(\\\'' . str_replace($products_image_large, urlencode(addslashes($products_image_large)), $large_link) . '\\\')">' . $thumb_slashes . '<br />' . TEXT_CLICK_TO_ENLARGE . '</a>' : $thumb_slashes) . '\');' . "\n" . '//--></script>';

    $noscript_link = '<noscript>' . ($flag_display_large ? '<a href="' . zen_href_link(FILENAME_POPUP_IMAGE_ADDITIONAL, 'pID=' . $_GET['products_id'] . '&pic=' . $i . '&products_image_large_additional=' . $products_image_large) . '" target="_blank">' . $thumb_regular . '<br /><span class="imgLinkAdditional">' . TEXT_CLICK_TO_ENLARGE . '</span></a>' : $thumb_regular ) . '</noscript>';

    //      $alternate_link = '<a href="' . $products_image_large . '" onclick="javascript:popupWindow(\''. $large_link . '\') return false;" title="' . $products_name . '" target="_blank">' . $thumb_regular . '<br />' . TEXT_CLICK_TO_ENLARGE . '</a>';

    $link = $script_link . "\n      " . $noscript_link;
    //      $link = $alternate_link;

    // List Box array generation:
    $list_box_contents[$row][$col] = array('params' => 'class="additionalImages centeredContent back"' . ' ' . 'style="width:' . $col_width . '%;"',
    'text' => "\n      " . $link);
    $col ++;
    if ($col > (IMAGES_AUTO_ADDED -1)) {
      $col = 0;
      $row ++;
    }
  } // end for loop

Finally a link where you can see the errant popup behavior:
http://eitestsite(dot)eyeitalia(dot)...roducts_id=331

[mc12345678]

I used the code you posted to this thread.. I updated the additional_images.php module file with the code you posted, and reverted the tpl_main_image.php popup file to the version in the IH4 v4.3.1 fileset.. The result is that the popup DOES show the correct image from the bmz_cache instead of the "no image" product picture.. The problem is that the popup window does not re-size to match the size of the image displayed in the popup.

additional images code used

  for ($i=0, $n=$num_images; $i<$n; $i++) {
    $file = $images_array[$i];
    $products_image_large = str_replace(DIR_WS_IMAGES, DIR_WS_IMAGES . 'large/', $products_image_directory) . str_replace($products_image_extension, '', $file) . IMAGE_SUFFIX_LARGE . $products_image_extension;
//  Begin Image Handler changes 1 of 2
//next line is commented out for Image Handler
    if (function_exists('handle_image')) {
        $newimg = handle_image($products_image_large, addslashes($products_name), LARGE_IMAGE_WIDTH, LARGE_IMAGE_HEIGHT);
        list($src, $alt, $width, $height, $parameters) = $newimg;

        $products_image_large = zen_output_string($src);
    } 
    
    $flag_has_large = file_exists($products_image_large);
//  End Image Handler changes 1 of 2
    $products_image_large = ($flag_has_large ? $products_image_large : $products_image_directory . $file);
    $flag_display_large = (IMAGE_ADDITIONAL_DISPLAY_LINK_EVEN_WHEN_NO_LARGE == 'Yes' || $flag_has_large);
    $base_image = $products_image_directory . $file;
    $thumb_slashes = zen_image(addslashes($base_image), addslashes($products_name), SMALL_IMAGE_WIDTH, SMALL_IMAGE_HEIGHT);
//  Begin Image Handler changes 2 of 2
//  remove additional single quotes from image attributes (important!)
    $thumb_slashes = preg_replace("/([^\\\\])'/", '$1\\\'', $thumb_slashes);
//  End Image Handler changes 2 of 2
    $thumb_regular = zen_image($base_image, $products_name, SMALL_IMAGE_WIDTH, SMALL_IMAGE_HEIGHT);
    $large_link = zen_href_link(FILENAME_POPUP_IMAGE_ADDITIONAL, 'pID=' . $_GET['products_id'] . '&pic=' . $i . '&products_image_large_additional=' . $products_image_large);

    // Link Preparation:
      $script_link = '<script language="javascript" type="text/javascript"><!--' . "\n" . 'document.write(\'' . ($flag_display_large ? '<a href="javascript:popupWindow(\\\'' . str_replace($products_image_large, urlencode(addslashes($products_image_large)), $large_link) . '\\\')">' . $thumb_slashes . '<br />' . TEXT_CLICK_TO_ENLARGE . '</a>' : $thumb_slashes) . '\');' . "\n" . '//--></script>';

    $noscript_link = '<noscript>' . ($flag_display_large ? '<a href="' . zen_href_link(FILENAME_POPUP_IMAGE_ADDITIONAL, 'pID=' . $_GET['products_id'] . '&pic=' . $i . '&products_image_large_additional=' . $products_image_large) . '" target="_blank">' . $thumb_regular . '<br /><span class="imgLinkAdditional">' . TEXT_CLICK_TO_ENLARGE . '</span></a>' : $thumb_regular ) . '</noscript>';

    //      $alternate_link = '<a href="' . $products_image_large . '" onclick="javascript:popupWindow(\''. $large_link . '\') return false;" title="' . $products_name . '" target="_blank">' . $thumb_regular . '<br />' . TEXT_CLICK_TO_ENLARGE . '</a>';

    $link = $script_link . "\n      " . $noscript_link;
    //      $link = $alternate_link;

    // List Box array generation:
    $list_box_contents[$row][$col] = array('params' => 'class="additionalImages centeredContent back"' . ' ' . 'style="width:' . $col_width . '%;"',
    'text' => "\n      " . $link);
    $col ++;
    if ($col > (IMAGES_AUTO_ADDED -1)) {
      $col = 0;
      $row ++;
    }
  } // end for loop

Finally a link where you can see the errant popup behavior:
http://eitestsite(dot)eyeitalia(dot)...roducts_id=331

Okay, so I finally figured out what you have tried to tell me but I couldn't get into my thick head. Apparently the popup is coming in at a width that is too small and the image is being squashed from the sides. I was able to expand the width of the image and it began appearing as more appropriately expected.

At the moment, I am only guessing since I have not started with a fresh cart and applied IH4 to it, but one thing I see is that I have the following jscript_main.php file in the includes/modules/pages/popup_image directory, and am wondering if it has an effect because it seems to address some of the size issues described. I tried disabling the file from my site, but the resizing on my side still worked. I haven't experienced a "shrink" of the image and do not know where the value of 250 is coming from for the width. Also, the images that I get to appear on my site, if I were to shrink the window, the image doesn't shrink with it like how yours expands with the window until at least 600x600 and then shrinks again with a shrinking window.
Do you have the following jscript_main.php file installed in the includes/modules/pages/popup_image directory?

<?php
/**
 * jscript_main
 *
 * @package page
 * @copyright Copyright 2003-2006 Zen Cart Development Team
 * @copyright Portions Copyright 2003 osCommerce
 * @license http://www.zen-cart.com/license/2_0.txt GNU Public License V2.0
 * @version $Id: jscript_main.php 3126 2006-03-07 03:09:40Z drbyte $
 */
?>
<script language="javascript" type="text/javascript"><!--
var i=0;
function resize() {
  i=0;
//  if (navigator.appName == 'Netscape') i=20;
  if (window.navigator.userAgent.indexOf('MSIE 6.0') != -1 && window.navigator.userAgent.indexOf('SV1') != -1) {
      i=30; //This browser is Internet Explorer 6.x on Windows XP SP2
  } else if (window.navigator.userAgent.indexOf('MSIE 6.0') != -1) {
      i=0; //This browser is Internet Explorer 6.x
  } else if (window.navigator.userAgent.indexOf('Firefox') != -1 && window.navigator.userAgent.indexOf("Windows") != -1) {
      i=25; //This browser is Firefox on Windows
  } else if (window.navigator.userAgent.indexOf('Mozilla') != -1 && window.navigator.userAgent.indexOf("Windows") != -1) {
      i=45; //This browser is Mozilla on Windows
  } else {
      i=80; //This is all other browsers including Mozilla on Linux
  }
  if (document.documentElement && document.documentElement.clientWidth) {
//    frameWidth = document.documentElement.clientWidth;
//    frameHeight = document.documentElement.clientHeight;

  imgHeight = document.images[0].height+40-i;
  imgWidth = document.images[0].width+20;

  var height = screen.height;
  var width = screen.width;
  var leftpos = width / 2 - imgWidth / 2;
  var toppos = height / 2 - imgHeight / 2;

    frameWidth = imgWidth;
    frameHeight = imgHeight+i;

  window.moveTo(leftpos, toppos);


//  window.resizeTo(imgWidth, imgHeight);
  window.resizeTo(frameWidth,frameHeight+i);
	}
  else if (document.body) {
    window.resizeTo(document.body.clientWidth, document.body.clientHeight-i);
  }
  self.focus();
}
//--></script>

Not sure if this was supposed to be a part of the IH4 package or not, or if it was part of another installation, but it appears to handle some of what you are describing.

[DivaVocals]

Okay, so I finally figured out what you have tried to tell me but I couldn't get into my thick head. Apparently the popup is coming in at a width that is too small and the image is being squashed from the sides. I was able to expand the width of the image and it began appearing as more appropriately expected.

At the moment, I am only guessing since I have not started with a fresh cart and applied IH4 to it, but one thing I see is that I have the following jscript_main.php file in the includes/modules/pages/popup_image directory, and am wondering if it has an effect because it seems to address some of the size issues described. I tried disabling the file from my site, but the resizing on my side still worked. I haven't experienced a "shrink" of the image and do not know where the value of 250 is coming from for the width. Also, the images that I get to appear on my site, if I were to shrink the window, the image doesn't shrink with it like how yours expands with the window until at least 600x600 and then shrinks again with a shrinking window.
Do you have the following jscript_main.php file installed in the includes/modules/pages/popup_image directory?

<?php
/**
 * jscript_main
 *
 * @package page
 * @copyright Copyright 2003-2006 Zen Cart Development Team
 * @copyright Portions Copyright 2003 osCommerce
 * @license http://www.zen-cart.com/license/2_0.txt GNU Public License V2.0
 * @version $Id: jscript_main.php 3126 2006-03-07 03:09:40Z drbyte $
 */
?>
<script language="javascript" type="text/javascript"><!--
var i=0;
function resize() {
  i=0;
//  if (navigator.appName == 'Netscape') i=20;
  if (window.navigator.userAgent.indexOf('MSIE 6.0') != -1 && window.navigator.userAgent.indexOf('SV1') != -1) {
      i=30; //This browser is Internet Explorer 6.x on Windows XP SP2
  } else if (window.navigator.userAgent.indexOf('MSIE 6.0') != -1) {
      i=0; //This browser is Internet Explorer 6.x
  } else if (window.navigator.userAgent.indexOf('Firefox') != -1 && window.navigator.userAgent.indexOf("Windows") != -1) {
      i=25; //This browser is Firefox on Windows
  } else if (window.navigator.userAgent.indexOf('Mozilla') != -1 && window.navigator.userAgent.indexOf("Windows") != -1) {
      i=45; //This browser is Mozilla on Windows
  } else {
      i=80; //This is all other browsers including Mozilla on Linux
  }
  if (document.documentElement && document.documentElement.clientWidth) {
//    frameWidth = document.documentElement.clientWidth;
//    frameHeight = document.documentElement.clientHeight;

  imgHeight = document.images[0].height+40-i;
  imgWidth = document.images[0].width+20;

  var height = screen.height;
  var width = screen.width;
  var leftpos = width / 2 - imgWidth / 2;
  var toppos = height / 2 - imgHeight / 2;

    frameWidth = imgWidth;
    frameHeight = imgHeight+i;

  window.moveTo(leftpos, toppos);


//  window.resizeTo(imgWidth, imgHeight);
  window.resizeTo(frameWidth,frameHeight+i);
    }
  else if (document.body) {
    window.resizeTo(document.body.clientWidth, document.body.clientHeight-i);
  }
  self.focus();
}
//--></script>

Not sure if this was supposed to be a part of the IH4 package or not, or if it was part of another installation, but it appears to handle some of what you are describing.

This is a default Zen Cart file.. it's not a part of the IH4 fileset, but if it is the source of the sizing issues, then it may need to be included with the appropriate modifications...

[DivaVocals]

This is a straightforward install, and if you review this support thread, you will see that the issues you are reporting are unique to your store.. So the BEST thing to do at this point is to rollback to a pre-IH4 install state and start over.. OR perhaps you might consider paying someone to help you get this installed and properly configured for you..

Thank you.

I am running ZC 1.5.1 and IH4 which I downloaded a week ago and which does not include recent update (if there were any during this week).

I was running ZC 1.5.1 a week ago when I installed IH4 and it was running properly.

With that being said, it was working properly before, and then something changed to where it is not working properly? What else changed on your side? If it was working and then stopped, it's not something related to IH4 and you would need to post help in another thread if you can't resolve on your own.

At this point I am gonna reiterate my previous suggestion.. IH4 is a straightforward install. The issues being reported by EHSI are not common issues and they are local to his site. There are are many variables that could be the cause, and far too many to keep lobbing guesses at.

Bottomline is that IMHO, it is time for EHSI to consider paying someone to look at his site and IH4 install to get him on solid ground.. I have no additional suggestions to offer.. It is clear IH4 is not working properly.. whether that is due to a bad install, something with his template, permissions, or other server issues... is impossible to tell from this vantage POV. IMHO, it is time for someone to look at the actual site from the back-end to get to the bottom of the issue..

[DivaVocals]

Okay, so I finally figured out what you have tried to tell me but I couldn't get into my thick head. Apparently the popup is coming in at a width that is too small and the image is being squashed from the sides. I was able to expand the width of the image and it began appearing as more appropriately expected.

Yureka!! Yes the correct image is displayed, but the popup is not opening up to match the image size.. Yes you can manually resize the popup window, but the point is the popup window should open to the correct size to begin with.
http://eitestsite(dot)eyeitalia(dot)...ge.600x600.jpg

At the moment, I am only guessing since I have not started with a fresh cart and applied IH4 to it, but one thing I see is that I have the following jscript_main.php file in the includes/modules/pages/popup_image directory, and am wondering if it has an effect because it seems to address some of the size issues described. I tried disabling the file from my site, but the resizing on my side still worked. I haven't experienced a "shrink" of the image and do not know where the value of 250 is coming from for the width. Also, the images that I get to appear on my site, if I were to shrink the window, the image doesn't shrink with it like how yours expands with the window until at least 600x600 and then shrinks again with a shrinking window.
Do you have the following jscript_main.php file installed in the includes/modules/pages/popup_image directory?



Not sure if this was supposed to be a part of the IH4 package or not, or if it was part of another installation, but it appears to handle some of what you are describing.

This file was never a part of the IH4 fileset, and it never had to be since the popup windows were never an issue.. However, if that's what is needed here to resolve the issue, then that's the way it has to be..

[DivaVocals]

Okay, sorry, glad that I described what I saw. So, with the eyeitalia site, I see that the image is 250x600 with a bmz resize of 600x600 and the border of the window is to the sides of the image at that dimension. So, what would be expected to be different? Should the height be 550?

With the code copied, which version of the all caps height and width was used? could you try replacing with the $ih variable(s)? $ihConf['large']['width'] and $ihConf['large']['height'] respectively.

When you click the large image link on the EyeItalia site, you will see that the popups for the large images are not resizing to the size of the large image (as they should)