﻿// JScript File

/*
Simple Image Trail script- By JavaScriptKit.com
Visit http://www.javascriptkit.com for this script and more
This notice must stay intact
*/

var displayduration=20; //duration in seconds image should remain visible. 0 for always.
var maxImageWidth = 500; //max image display width
var maxImageHeight = 500;  //max image display height
var showtime //event timer object;

function init() {
    document.onmouseover=followmouse;
    followmouse();
}

function enlarge_image (image_name, title, width, height) {

    if (document.getElementById || document.all) {
        // make sure that the width and height variables are set
        document.onmousemove=followmouse;
        imageWidth = (width == 0 ) ? maxImageWidth: width;
        imageHeight = (height == 0) ? maxImageHeight: height;
        
        // make sure that height and width inputs don't exceed the max defaults above
        imageWidth = (imageWidth>maxImageWidth) ? maxImageWidth:imageWidth;
        imageHeight = (imageHeight>maxImageHeight) ? maxImageHeight:imageHeight;


        gettrailobj().innerHTML = '<div style="border: 2px solid #005244;padding: 10px;background:white;overflow:visible;width:' + imageWidth + 'px;"><h2 style="text-align:center">' + title + '</h2><img src="'+ image_name +'" border="0" width="'+ imageWidth+'px" height="'+ imageHeight +'px"></div>'; 

        gettrailobj().style.display = "block"; //make trailimageid layer visible
    }
    if (displayduration>0) //limit time to show trailimageid layer
        showtime = setTimeout("hidetrail()", displayduration*1000);
}

function gettrailobj(){
	return document.getElementById("trailimageid");
}

function showcursor_details() {
	return document.getElementById("cursordetails");
}

function truebody(){
    return (!window.opera && document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
}

function hidetrail(){
    gettrailobj().style.display="none";
    clearTimeout(showtime);
}

function followmouse(e){
    var xOff = 0; //left edge of display
    var yOff = 0; //right edge of display
    var yOffset = 10; //y spacing from cursor
    var xOffset = 10; //x spacing from cursor
    var PageX, PageY;
    var xNew = 0;
    var yNew = 0;
    var winWidth; //assume horizontal scroll bar is present
    var docWidth;
    var docHeight;

    winWidth = document.all? truebody().clientWidth : window.innerWidth-17;
    winHeight=document.all? Math.max(truebody().scrollHeight, truebody().clientHeight) : Math.max(document.body.offsetHeight, window.innerHeight);
    docWidth = gettrailobj().clientWidth
    docHeight = gettrailobj().clientHeight

    if (typeof e != "undefined") { //for Firefox
        xOff = e.pageX - xOffset - docWidth; //left edge of image offset from cursor
        yOff = e.pageY - docHeight - yOffset; //top of image from cursor

        // show to left if it fits otherwise flip to right side
        xNew = (xOff > window.pageXOffset ) ?  xOff  : ( e.pageX + xOffset + docWidth < winWidth) ? e.pageX + xOffset: window.pageXOffset;
        // show to top otherwise flip to bottom
        yNew = (yOff <= window.pageYOffset ) ?  ((e.pageY + docHeight + yOffset) < (window.innerHeight + window.pageYOffset)) ? e.pageY + yOffset : window.pageYOffset : yOff;
        PageX = e.pageX; //absolute left cursor position (page)
        PageY = e.pageY; //absolute top cursor position (page)

		//make sure the image doesn't cover cursor
		if ((xNew + docWidth + xOffset) >= PageX ) { //image positioned to left of cursor
			xNew = PageX -(docWidth + xOffset);
        }
    }
    else {
        if (typeof window.event !="undefined"){ //for IE
            e=window.event;
            xOff = e.clientX - docWidth - xOffset;
            yOff = e.clientY - docHeight - yOffset // yOffset adds clearance above or below cursor

            xNew = truebody().scrollLeft + (xOff > 0 ) ?  xOff : ( e.clientX + docWidth + xOffset < winWidth) ? e.clientX + xOffset : 0;
            yNew = truebody().scrollTop + ((yOff < 0 ) ?  ( e.clientY  + docHeight + yOffset < (truebody().clientHeight) ) ? e.clientY + yOffset : 0 : yOff ) ;
            
			if ((xNew + docWidth + xOffset) >= (e.clientX + truebody().scrollLeft) ) { //image positioned to left of cursor
				xNew = (e.clientX + truebody().scrollLeft) -(docWidth + xOffset);
			}
        }
    }
// for Firefox
//    showcursor_details().innerHTML = '<div style="padding: 10px;border: 2px solid #005244;"><h2 style="text-align:center">Coordinates</h2><p>page(X:Y)Offset ' + window.pageXOffset + ":" + window.pageYOffset + '<br>Page Cursor Position (pageX:pageY) ' + PageX + ':' + PageY  + '<br>Window Cursor Position (clientX:clientY) ' + e.clientX + ':' + e.clientY +  '<br>xOffset:yOffset ' + xOffset + ':' + yOffset + '<br>image dimensions w:h ' + docWidth + ':' + docHeight + '<br>Yields (xOff:yOff)  ' + xOff +':' + yOff + '<br>Yields New x:y ' + xNew +':' + yNew + '<br>window dimensions x:y ' + winWidth + ':' + window.innerHeight + '</p></div>'

// for IE
//    showcursor_details().innerHTML = '<div style="padding: 10px;border: 2px solid #005244;"><h2 style="text-align:center">Coordinates</h2><p>page(X:Y)Offset ' + truebody().scrollLeft + ":" + truebody().scrollTop + '<br>Page Cursor Position (pageX:pageY) ' + gettrailobj().offsetParent.offsetLeft  + ':' + gettrailobj().offsetParent.offsetTop + '<br>Window Cursor Position (clientX:clientY) ' + e.clientX + ':' + e.clientY +  '<br>xOffset:yOffset ' + xOffset + ':' + yOffset + '<br>image dimensions w:h ' + docWidth + ':' + docHeight + '<br>Yields (xOff:yOff)  ' + xOff +':' + yOff + '<br>Yields New x:y ' + xNew +':' + yNew + '<br>WindowHeight.vs.ClientHeight ' + truebody().scrollHeight+ ":" + truebody().clientHeight + '<br>window dimensions x:y ' + winWidth + ':' + winHeight + '</p></div>'
    gettrailobj().style.left=xNew+"px";
    gettrailobj().style.top=yNew+"px";
}

