/*
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 (tim@breakmyzencart.com) 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.

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){
 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.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 = "-500px";
 trailstyle.top = "-500px";
}

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"){
  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 < 300){
   xcoord = e.pageX - xcoord - 286; // Move to the left side of the cursor
  } else {
   xcoord += e.pageX;
  }
  if (docheight - e.pageY < (currentimageheight + 0)){
   ycoord += e.pageY - Math.max(0,(0 + currentimageheight + e.pageY - docheight - truebody().scrollTop));
  } else {
   ycoord += e.pageY;
  }
 } else if (typeof window.event != "undefined"){
  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 < 300){
   xcoord = event.clientX + truebody().scrollLeft - xcoord - 286; // Move to the left side of the cursor
  } else {
   xcoord += truebody().scrollLeft+event.clientX;
  }
  if (docheight - event.clientY < (currentimageheight + 0)){
   ycoord += event.clientY + truebody().scrollTop - Math.max(0,(0 + currentimageheight + event.clientY - docheight));
  } 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 == "-500px") || (trail.style.left == "")) { trail.style.left=xcoord+"px"; }
 if ((trail.style.top == "-500px") || (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";
  }
 }
}