﻿//
//	ImageTrailSch.js
//		Image trail script for mouseovers
//    

/*
Simple Image Trail script- By JavaScriptKit.com
Visit http://www.javascriptkit.com for this script and more
This notice must stay intact

Further modifications - see source control.

2007-08-29
Copied for schematics. TODO: Merge with imagetrail.js.

2007-08-09
Modified to move the image into position before making it visible, for an IE problem.
With the large image, it was visible in the original 0,0 position before moving,
  which immediately fired a mouseout event before it could move the image.
  This then fired a mouseover, etc. The image would flicker in place.
Init'ing the image away from the source image helped, 
  except if you quickly moved the mouse over the large image,
  this was also a mouseout, causing the same problem.
Moving the image first guarantees that it won't appear underneath the mouse.

2006-11-16
Modified from original to put on image mouseovers instead of always, as on jadefish.
Trailing styled text instead of a div. Can generalize for different callers.
*/

var trailimage;
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 showstate = 0;    // 0 = not yet visible, 1 = flag to set visible, 2 = visible.
var imageName = "";
var displayName = "";

if (document.getElementById || document.all)
  document.write('<div id="trailimageid" style="position:absolute;visibility:hidden;left:0px;top:0px;width:0px;height:0px;z-index:100;"></div>');

function gettrailobj(){
  if (document.getElementById)
    return document.getElementById("trailimageid").style;
  else if (document.all)
    return document.all.trailimagid.style;
}

function gettrailobject(){
  if (document.getElementById)
    return document.getElementById("trailimageid");
  else if (document.all)
    return document.all.trailimagid;
}

function truebody(){
  return (!window.opera && document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body;
}

function showtrail(displayNameReq, imageNameReq){
  showstate = 1;
  imageName = imageNameReq;
  displayName = displayNameReq;

  document.onmousemove=followmouse;

  
  //var newHTML = '<div align="center" style="padding: 8px 2px 2px 2px;"><img src="' + imageName + '" border="0"></div>';
  //var newHTML = '<img src="' + imageName + '" border="0">';  // Pass in imageName if it varies.
  //var newHTML = '<div class="MouseTrailText">Click here to enlarge</div>';
  
  //gettrailobject().innerHTML = newHTML;
  //gettrailobj().visibility = "visible";
  //if (displayduration>0)
  //  setTimeout("hidetrail()", displayduration * 1000);
}

function hidetrail(){
  gettrailobj().visibility="hidden";
  document.onmousemove="";
  showstate = 0;        // Not really necessary, but the 3 states clarify it.
}

function followmouse(e){
  var xcoord = offsetfrommouse[0];
  var ycoord = offsetfrommouse[1];

  if (typeof e != "undefined"){
    xcoord += e.pageX;
    ycoord += e.pageY;
  }
  else if (typeof window.event != "undefined"){
    xcoord += truebody().scrollLeft + event.clientX;
    ycoord += truebody().scrollTop + event.clientY;
  }

  // Screen edge checking.
  //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 (xcoord+trailimage[1]+3>docwidth || ycoord+trailimage[2]> docheight)
  //  gettrailobj().display="none"
  //else 
  //  gettrailobj().display=""

  // Set the position.
  gettrailobj().left = xcoord + "px";
  gettrailobj().top = ycoord + "px";

  // Moved the visibility down here. See comments at the top.
  if (showstate == 1)
  {
    showstate = 2;
    
    //var newHTML = '<div align="center" style="padding: 8px 2px 2px 2px;"><img src="' + imageName + '" border="0"></div>';
    var newHTML = '<div align="center" class="SchImageTrail">' + displayName + '<br /><img src="' + imageName + '" border="0"></div>';
    //var newHTML = '<img src="' + imageName + '" border="0">';  // Pass in imageName if it varies.
    //var newHTML = '<div class="MouseTrailText">Click here to enlarge</div>';
    
    gettrailobject().innerHTML = newHTML;
    gettrailobj().visibility = "visible";
    if (displayduration>0)
      setTimeout("hidetrail()", displayduration * 1000);
  }

}

// document.onmousemove=followmouse
