Image Handler 5 (for v1.5.5 - v1.5.8) Support Thread

[lat9]

.
Link to specific page.
https://fuzztrip.com/lp-c-1/the-luci...red-p-255.html

Noting that, for a couple of years now, that image-hover feature has been wonky (depending on the browser) and will be removed entirely in the next (v5.2.0) IH release.

[Fuzztrip]

Noting that, for a couple of years now, that image-hover feature has been wonky (depending on the browser) and will be removed entirely in the next (v5.2.0) IH release.

Thanks for the info on that. Guess I'll turn it off now.

[barco57]

@fuzztrip try replacing the contents of your includes/templates/YOUR_TEMPLATE/jscript/jscript_imagehover.js with the following

/*
Simple Image Trail script- By JavaScriptKit.com
Visit http://www.javascriptkit.com for this script and more
This notice must stay intact

Modified by Tim Kroeger ([email protected]) for use with
image handler 2 and better cross browser functionality
*/

var offsetfrommouse=[10,10]; //image x,y offsets from cursor position in pixels. Enter 0,0 for no offset
var displayduration=0; //duration in seconds image should remain visible. 0 for always.
var currentimageheight = 400;	// maximum image size.
var padding=10; // padding must by larger than specified div padding in stylessheet

// Global variables for sizes of hoverimg
// Defined in "showtrail()", used in "followmouse()"
var zoomimg_w=0;
var zoomimg_h=0;


if (document.getElementById || document.all){
  document.write('<div id="trailimageid">');
  document.write('</div>');
}

function getObj(name) {
  if (document.getElementById) {
  	  this.obj = document.getElementById(name);
    this.style = document.getElementById(name).style;
  } else if (document.all) {
    this.obj = document.all[name];
    this.style = document.all[name].style;
  } else if (document.layers) {
    this.obj = document.layers[name];
    this.style = document.layers[name];
  }
}

function gettrail(){
  return new getObj("trailimageid");
}

function truebody(){
  return (!window.opera && document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
}

function showtrail(imagename,title,oriwidth,oriheight,zoomimgwidth,zoomimgheight, image, startx, starty, startw, starth){
	zoomimg_w=zoomimgwidth;
	zoomimg_h=zoomimgheight;
  //if (oriwidth > 0){ offsetfrommouse[0] = oriwidth; }
  //if (oriheight > 0){ offsetfrommouse[1] = -1 *(zoomimgheight-oriheight)/2 - 40; }
  // alert (offsetfrommouse[0] + "," + offsetfrommouse[1]);
  if (zoomimgheight > 0){ currentimageheight = zoomimgheight; }
  trailobj = gettrail().obj;
  trailobj.style.width=(zoomimgwidth+(2*padding))+"px";
  trailobj.style.height=(zoomimgheight+(2*padding))+"px";
  trailobj.setAttribute("startx", startx);
  trailobj.setAttribute("starty", starty);
  trailobj.setAttribute("startw", startw);
  trailobj.setAttribute("starth", starth);
  trailobj.setAttribute("imagename", imagename);
  trailobj.setAttribute("imgtitle", title);
  document.onmousemove=followmouse;
}

function hidetrail(){
  trailstyle = gettrail().style;
  trailstyle.visibility = "hidden";
  document.onmousemove = "";
  trailstyle.left = "-2000px";
  trailstyle.top = "-2000px";
}

function followmouse(e){

  var xcoord=offsetfrommouse[0];
  var ycoord=offsetfrommouse[1];

  var docwidth=document.all? truebody().scrollLeft+truebody().clientWidth : pageXOffset+window.innerWidth-15;
  var docheight=document.all? Math.min(truebody().scrollHeight, truebody().clientHeight) : Math.min(window.innerHeight);

  //if (document.all){
  //	trail.obj.innerHTML = 'A = ' + truebody().scrollHeight + '<br>B = ' + truebody().clientHeight;
  //} else {
  //	trail.obj.innerHTML = 'C = ' + document.body.offsetHeight + '<br>D = ' + window.innerHeight;
  //}
  var relativeX = null;
  var relativeY = null;

  if (typeof e != "undefined"){
    // Not IE
    if ((typeof e.layerX != "undefined") && (typeof e.layerY != "undefined")) {
      relativeX = e.layerX;
      relativeY = e.layerY;
    } else if ((typeof e.x != "undefined") && (typeof e.y != "undefined")) {
      relativeX = e.x;
      relativeY = e.y;
    }

    if (docwidth - e.pageX < zoomimg_w + (3 * padding)) {
      xcoord = e.pageX - xcoord - zoomimg_w - (2 * offsetfrommouse[0]);
    } else {
      xcoord += e.pageX;
    }
    if (docheight - e.pageY < zoomimg_h + (2 * padding)){
      ycoord += e.pageY - Math.max(0,(0 + zoomimg_h + (5 * padding) + e.pageY - docheight - truebody().scrollTop));
    } else {
      ycoord += e.pageY;
    }
  } else if (typeof window.event != "undefined"){
    // IE
    if ((typeof event.x != "undefined") && (typeof event.y != "undefined")) {
      relativeX = event.x;
      relativeY = event.y;
    } else if ((typeof event.offsetX != "undefined") && (event.offsetY != "undefined")) {
      relativeX = event.offsetX;
      relativeY = event.offsetY;
    }

    if (docwidth - event.clientX < zoomimg_w + (3 * padding)) {
      xcoord = event.clientX - xcoord - zoomimg_w - (2 * offsetfrommouse[0]);
    } else {
      xcoord += truebody().scrollLeft + event.clientX;
    }
    if (docheight - event.clientY < zoomimg_h + 50){
      ycoord += truebody().scrollTop + docheight - zoomimg_h - 50;
//      ycoord += event.clientY - Math.max(0,(0 + zoomimg_h + (5 * padding) + event.clientY - docheight - truebody().scrollTop));
    } else {
      ycoord += truebody().scrollTop + event.clientY;
    }
  }

  trail = gettrail();
  startx    = trail.obj.getAttribute("startx");
  starty    = trail.obj.getAttribute("starty");
  startw    = trail.obj.getAttribute("startw");
  starth    = trail.obj.getAttribute("starth");
  imagename = trail.obj.getAttribute("imagename");
  title     = trail.obj.getAttribute("imgtitle");

  // calculate and set position BEFORE switching to visible
  var docwidth=document.all? truebody().scrollLeft+truebody().clientWidth : pageXOffset+window.innerWidth-15;
  var docheight=document.all? Math.max(truebody().scrollHeight, truebody().clientHeight) : Math.max(document.body.offsetHeight, window.innerHeight);
  if(ycoord < 0) { ycoord = ycoord*-1; }
  if ((trail.style.left == "-2000px") || (trail.style.left == "")) { trail.style.left=xcoord+"px"; }
  if ((trail.style.top == "-2000px") || (trail.style.top == "")) { trail.style.top=ycoord+"px"; }
  trail.style.left=xcoord+"px";
  trail.style.top=ycoord+"px";
//	alert (trail.style.left+","+trail.style.top);

  if (trail.style.visibility != "visible") {
    if (((relativeX == null) || (relativeY == null)) ||
      ((relativeX >= startx) && (relativeX <= (startx + startw))
      && (relativeY >= starty) && (relativeY <= (starty + starth)))){
      newHTML = '<div><h1>' + title + '</h1>';
      newHTML = newHTML + '<img src="' + imagename + '"></div>';
      trail.obj.innerHTML = newHTML;
      trail.style.visibility="visible";
    }
  }
}

[lat9]

I've just submitted v5.2.0 of IH-5 for the Zen Cart moderators' review; I'll post back here when it's available for download.

This release contains changes associated with the following GitHub issues:

#139: Removing (buggy) "Small Image Zoom" feature.
#229: Correct handling of missing images.
#231: Various refactorings.
#233: Correcting (PHP 8.0+) Fatal errors due to stricter typing.
#236: Removing template-module overrides; changes in zc156+ core.
#242: Removing (unused) bmz_gif_info.class.php.

[g2ktcf]

I am having some trouble with images...I am not 100% sure this is an IH problem or not.

1.5.7c
OPC
EP4
Fluorspar Template
Clone a Template
IH5
MySQL Backup

Uploading a single image via IH creates the three images as expected. However, if you go beyond the grid layout, all the images appear as broken links. You can see what is happening at https://wlcartistry.com/index.php?ma...roducts_id=374. Most of my products have all three image sizes loaded and they do not create this issue. I want to change my image workflow to only ONE larger image for each product.

I thought IH was designed to work with ZC and only one large image...am I misunderstanding something?

Thanks!
Chris

[lat9]

I am having some trouble with images...I am not 100% sure this is an IH problem or not.

1.5.7c
OPC
EP4
Fluorspar Template
Clone a Template
IH5
MySQL Backup

Uploading a single image via IH creates the three images as expected. However, if you go beyond the grid layout, all the images appear as broken links. You can see what is happening at https://wlcartistry.com/index.php?ma...roducts_id=374. Most of my products have all three image sizes loaded and they do not create this issue. I want to change my image workflow to only ONE larger image for each product.

I thought IH was designed to work with ZC and only one large image...am I misunderstanding something?

Thanks!
Chris

Chris, did you enable Image Handler's operation on the storefront? There's a setting Configuration :: Images :: IH resize images; setting that to true should enable IH's storefront operation.

[g2ktcf]

I took a screenshot of my IH settings and did not attach it.... Sorry for making this harder than it should be.

[lat9]

I took a screenshot of my IH settings and did not attach it.... Sorry for making this harder than it should be.

Chris, you're not making it more difficult, but I'm now guessing that the Fluorspar template that's in use isn't playing nice. You might ask in that template's support-thread and/or contact its author.

[lat9]

I've just submitted v5.2.0 of IH-5 for the Zen Cart moderators' review; I'll post back here when it's available for download.

This release contains changes associated with the following GitHub issues:

#139: Removing (buggy) "Small Image Zoom" feature.
#229: Correct handling of missing images.
#231: Various refactorings.
#233: Correcting (PHP 8.0+) Fatal errors due to stricter typing.
#236: Removing template-module overrides; changes in zc156+ core.
#242: Removing (unused) bmz_gif_info.class.php.

Now available for download: https://www.zen-cart.com/downloads.php?do=file&id=2169

[noppie]

i downloaded this yesterday and i got this debug file and i have no idea how to fix it without reloading all my pictures.most are in png format and some are jpg.
here is my debug file THANK YOU IN ADVANCE

[30-Nov-2021 19:29:43 UTC] Request URI: /shop/kandi-bazaar/3d-kandi-cuffs-bracelets/neon-blue-dm5-w-white-glow-eyes-mouth-kandi-bracelets-rave?number_of_uploads=0&language=en, IP address: 51.222.253.20
#1 imagecreatefromjpeg() called at [/includes/classes/bmz_image_handler.class.php:926]
#2 ih_image->load_imageGD() called at [/includes/classes/bmz_image_handler.class.php:717]
#3 ih_image->resize_imageGD() called at [/includes/classes/bmz_image_handler.class.php:400]
#4 ih_image->get_resized_image() called at [/includes/classes/bmz_image_handler.class.php:258]
#5 ih_image->get_local() called at [/includes/functions/extra_functions/functions_bmz_image_handler.php:123]
#6 handle_image() called at [/includes/functions/html_output.php:200]
#7 zen_image() called at [/includes/templates/kandi/templates/tpl_modules_main_product_image.php:24]
#8 require(/includes/templates/kandi/templates/tpl_modules_main_product_image.php) called at [/includes/templates/kandi/templates/tpl_product_info_display.php:58]
#9 require(/includes/templates/kandi/templates/tpl_product_info_display.php) called at [/includes/modules/pages/product_info/main_template_vars.php:154]
#10 require(/includes/modules/pages/product_info/main_template_vars.php) called at [/includes/templates/kandi/common/tpl_main_page.php:181]
#11 require(/includes/templates/kandi/common/tpl_main_page.php) called at [/index.php:94]
--> PHP Warning: imagecreatefromjpeg(): gd-jpeg: JPEG library reports unrecoverable error: Not a JPEG file: starts with 0x89 0x50 in /includes/classes/bmz_image_handler.class.php on line 926.

[30-Nov-2021 19:29:43 UTC] Request URI: /shop/kandi-bazaar/3d-kandi-cuffs-bracelets/neon-blue-dm5-w-white-glow-eyes-mouth-kandi-bracelets-rave?number_of_uploads=0&language=en, IP address: 51.222.253.20
#1 imagecreatefromjpeg() called at [/includes/classes/bmz_image_handler.class.php:926]
#2 ih_image->load_imageGD() called at [/includes/classes/bmz_image_handler.class.php:717]
#3 ih_image->resize_imageGD() called at [/includes/classes/bmz_image_handler.class.php:400]
#4 ih_image->get_resized_image() called at [/includes/classes/bmz_image_handler.class.php:258]
#5 ih_image->get_local() called at [/includes/functions/extra_functions/functions_bmz_image_handler.php:123]
#6 handle_image() called at [/includes/functions/html_output.php:200]
#7 zen_image() called at [/includes/templates/kandi/templates/tpl_modules_main_product_image.php:24]
#8 require(/includes/templates/kandi/templates/tpl_modules_main_product_image.php) called at [/includes/templates/kandi/templates/tpl_product_info_display.php:58]
#9 require(/includes/templates/kandi/templates/tpl_product_info_display.php) called at [/includes/modules/pages/product_info/main_template_vars.php:154]
#10 require(/includes/modules/pages/product_info/main_template_vars.php) called at [/includes/templates/kandi/common/tpl_main_page.php:181]
#11 require(/includes/templates/kandi/common/tpl_main_page.php) called at [/index.php:94]
--> PHP Warning: imagecreatefromjpeg(): '/images/neonbluegeye_deadnau5.jpg' is not a valid JPEG file in /includes/classes/bmz_image_handler.class.php on line 926.

[30-Nov-2021 19:29:43 UTC] Request URI: /shop/kandi-bazaar/3d-kandi-cuffs-bracelets/neon-blue-dm5-w-white-glow-eyes-mouth-kandi-bracelets-rave?number_of_uploads=0&language=en, IP address: 51.222.253.20
#1 imagecreatefromjpeg() called at [/includes/classes/bmz_image_handler.class.php:926]
#2 ih_image->load_imageGD() called at [/includes/classes/bmz_image_handler.class.php:717]
#3 ih_image->resize_imageGD() called at [/includes/classes/bmz_image_handler.class.php:400]
#4 ih_image->get_resized_image() called at [/includes/classes/bmz_image_handler.class.php:258]
#5 ih_image->get_local() called at [/includes/functions/extra_functions/functions_bmz_image_handler.php:123]
#6 handle_image() called at [/includes/functions/html_output.php:200]
#7 zen_image() called at [/includes/templates/kandi/templates/tpl_modules_main_product_image.php:36]
#8 require(/includes/templates/kandi/templates/tpl_modules_main_product_image.php) called at [/includes/templates/kandi/templates/tpl_product_info_display.php:58]
#9 require(/includes/templates/kandi/templates/tpl_product_info_display.php) called at [/includes/modules/pages/product_info/main_template_vars.php:154]
#10 require(/includes/modules/pages/product_info/main_template_vars.php) called at [/includes/templates/kandi/common/tpl_main_page.php:181]
#11 require(/includes/templates/kandi/common/tpl_main_page.php) called at [/index.php:94]
--> PHP Warning: imagecreatefromjpeg(): gd-jpeg: JPEG library reports unrecoverable error: Not a JPEG file: starts with 0x89 0x50 in /includes/classes/bmz_image_handler.class.php on line 926.

[30-Nov-2021 19:29:43 UTC] Request URI: /shop/kandi-bazaar/3d-kandi-cuffs-bracelets/neon-blue-dm5-w-white-glow-eyes-mouth-kandi-bracelets-rave?number_of_uploads=0&language=en, IP address: 51.222.253.20
#1 imagecreatefromjpeg() called at [/includes/classes/bmz_image_handler.class.php:926]
#2 ih_image->load_imageGD() called at [/includes/classes/bmz_image_handler.class.php:717]
#3 ih_image->resize_imageGD() called at [/includes/classes/bmz_image_handler.class.php:400]
#4 ih_image->get_resized_image() called at [/includes/classes/bmz_image_handler.class.php:258]
#5 ih_image->get_local() called at [/includes/functions/extra_functions/functions_bmz_image_handler.php:123]
#6 handle_image() called at [/includes/functions/html_output.php:200]
#7 zen_image() called at [/includes/templates/kandi/templates/tpl_modules_main_product_image.php:36]
#8 require(/includes/templates/kandi/templates/tpl_modules_main_product_image.php) called at [/includes/templates/kandi/templates/tpl_product_info_display.php:58]
#9 require(/includes/templates/kandi/templates/tpl_product_info_display.php) called at [/includes/modules/pages/product_info/main_template_vars.php:154]
#10 require(/includes/modules/pages/product_info/main_template_vars.php) called at [/includes/templates/kandi/common/tpl_main_page.php:181]
#11 require(/includes/templates/kandi/common/tpl_main_page.php) called at [/index.php:94]
--> PHP Warning: imagecreatefromjpeg(): '/images/neonbluegeye_deadnau5.jpg' is not a valid JPEG file in /includes/classes/bmz_image_handler.class.php on line 926.