//-----------------------------------------------------------------
// Define browser-adaptive functions.
// Based on:
//   "JavaScript & DHTML Cookbook"
//   by Danny Goodman
//   Published by O'Reilly & Associates  ISBN 0-596-00467-2

// Retrieve the x coordinate of a positionable object
function getObjectLeft(obj)  {
    var elem = obj;
    var result = 0;
	while(elem){
		result += elem.offsetLeft;
		elem = elem.offsetParent;
	}
    return parseInt(result);
}

// Retrieve the y coordinate of a positionable object
function getObjectTop(obj)  {
    var elem = obj;
    var result = 0;
	while(elem){
		result += elem.offsetTop;
		elem = elem.offsetParent;
	}
    return parseInt(result);
}

//-----------------------------------------------------------------
// Define character eyeball management and fade attributes.

var mouseX = 0;			// x coordinate of mouse (relative to document)
var mouseY = 0;			// y coordinate of mouse (relative to document)
var x0 = 0;		      	// x coordinate of character image (relative to document)
var y0 = 0;				// y coordinate of character image (relative to document)
var r1;					// distance of the mouse from the center of the left eye
var r2;					// distance of the mouse from the center of the right eye

var objLeftPupil;		// the Element associated with the left pupil image
var objRightPupil;		// the Element associated with the right pupil image

// The following are hard-coded based on knowledge of the character image.
var RADIUS = 6;     	// radius of the eye socket, in pixels
var LEFT_X = 91;		// x coordinate of center of left eye (relative to character image)
var LEFT_Y = 61;		// y coordinate of center of left eye (relative to character image)
var RIGHT_X = 128;		// x coordinate of center of right eye (relative to character image)
var RIGHT_Y = 63;		// y coordinate of center of right eye (relative to character image)

// The following could be collected automatically from the appropriate image file.
var pupilradius = 3;	// radius of the pupil.

// The following is computed based on the above two data sets.
var rprime;				// maxiumum distance from the center of the eye socket to the center
                    	//   of the pupil.

// Define character fade-out attributes

var fadeCounter;
var MAX_COUNTER = 100;  // time before character fade (in 100-millisecond intervals).
var fadeState;			// either FADED_IN or FADED_OUT
var FADED_IN = 1;		// constant
var FADED_OUT = 0;		// constant

//-----------------------------------------------------------------
// Define character eyeball management and fade functions.
// Inspired by http://hyppo.com/Java/FollowingEyes/

function moveEyes() {
	var dx1, dy1, dx2, dy2;
	var l1, t1, l2, t2;
	var dbg;
 
    // Find mouse position in the coordinate system of each eye socket.
	dx1 = mouseX - (x0 + LEFT_X);
	dy1 = mouseY - (y0 + LEFT_Y);
	dx2 = mouseX - (x0 + RIGHT_X);
	dy2 = mouseY - (y0 + RIGHT_Y);

    // Find mouse distance from the center of each eye.
	// The "max" clause is a shortcut for the next step.
	r1 = Math.max(RADIUS, Math.sqrt(dx1 * dx1 + dy1 * dy1));
	r2 = Math.max(RADIUS, Math.sqrt(dx2 * dx2 + dy2 * dy2));

    // Compute and set the pupil postion for each eye.
	// If r<RADIUS, then r falls out of these equations and x display of pupil is proportional
	// to x.  Else, use congruent triangles principle to compute x on the edge of the rprime circle.
	l1 = Math.round(rprime*dx1/r1 + LEFT_X - pupilradius);
	t1 = Math.round(rprime*dy1/r1 + LEFT_Y - pupilradius);
	l2 = Math.round(rprime*dx2/r2 + RIGHT_X - pupilradius);
	t2 = Math.round(rprime*dy2/r2 + RIGHT_Y - pupilradius);

  	objLeftPupil.style.left  = (l1 + x0) + "px";
  	objLeftPupil.style.top   = (t1 + y0) + "px";

  	objRightPupil.style.left = (l2 + x0) + "px";
  	objRightPupil.style.top  = (t2 + y0) + "px";

}

//-----------------------------------------------------------------

function resetFadeCounter(){
	fadeCounter = MAX_COUNTER;

	if (fadeState == FADED_OUT){
		fadeState = FADED_IN;
		document.images["imgWhites"].src = "/images/WholeCat.gif";
		decrementFadeCounter();		
	}
}

//-----------------------------------------------------------------

function MoveEvent(event){
    var tempX, tempY;

    // IE EventModel does not pass the event into this function, and it handles
	// coordinates differently.  Normalize these differences and determine the
	// location of the mouse event.
    if (!event){
	    // IE
        event = window.event;
        tempX = event.clientX + document.body.scrollLeft;
        tempY = event.clientY + document.body.scrollTop;
    }else{
	    // other
        tempX = event.clientX + window.pageXOffset;
        tempY = event.clientY + window.pageYOffset;
    }

	// Some mouse events seem to fire spuriously, even when the mouse has not
	// moved.  Only act on mouse events which happen at new coordinates.
    if ((tempX != mouseX) || (tempY != mouseY)){
	 	mouseX = tempX;
		mouseY = tempY;

	    moveEyes();
		resetFadeCounter();
	}
}

//-----------------------------------------------------------------

function windowResized(){
	x0 = getObjectLeft(document.getElementById("imgWhites"));
	y0 = getObjectTop(document.getElementById("imgWhites"));

	moveEyes();
}

//-----------------------------------------------------------------

function windowUnloading(){
  	objLeftPupil.style.left  = "-10px";
  	objLeftPupil.style.top   = "-10px";
  	objRightPupil.style.left = "-10px";
  	objRightPupil.style.top  = "-10px";
}
//-----------------------------------------------------------------

function decrementFadeCounter(){
	// On the first calls, imgWhites may not have been loaded yet
	// so check for its existence.

	if (document.images["imgWhites"] && fadeCounter <=0){

		fadeState = FADED_OUT;
		document.images["imgWhites"].src = "/images/FadedCat.gif";

	}else{
		fadeCounter = fadeCounter - 1;
		window.setTimeout("decrementFadeCounter()", 100);
	}
}

//-----------------------------------------------------------------

function initGoogleEyedCharacter(){
	objLeftPupil = document.getElementById("divLeftPupil");
	objRightPupil = document.getElementById("divRightPupil");

	rprime = RADIUS - pupilradius;  

  	document.onmousemove = MoveEvent;
	window.onresize = windowResized;
	window.onload = windowResized;
	window.onunload = windowUnloading;

	fadeState = FADED_IN;
	fadeCounter = MAX_COUNTER;
	decrementFadeCounter();
}