﻿/*
	Author: Mark Macumber, Chris Bond
	Date Created: 16/11/2006
	Description: Javascript code to create pop-ups for mouse overs on given HTML elements
*/


/*
	Initial contructor for javascript popups
*/
function Popup(targetElm, divElm)
{
	this.targetElement = targetElm;
	this.floatingDiv = divElm;
	this.opacity = 0;
	this.floatingDiv.fadeInHandle = null;
	this.floatingDiv.fadeOutHandle = null;
	this.isShowing = false;
	this.isFadingOut = false;
	this.isFadingIn = false;

	//assign the appropriate method to ajust opacity based on MSIE or MOZILLA
	if(typeof this.floatingDiv.style.filter != 'undefined') // MSIE
	{
		// if there's not an alpha filter on the element already, add one
		if (this.floatingDiv.style.filter.indexOf("alpha") == -1) {
			this.floatingDiv.style.filter = "alpha(opacity="+this.opacity+")";
		}
		this.renderOpacityCaller = this.renderOpacityForIE;
	}
	else
	{
		this.floatingDiv.style.opacity = "";
	    this.renderOpacityCaller = this.renderOpacity;
	}
	
	this.showHandler = new EventHandler(this.targetElement, "click", "show", this, false);
	this.hideHandler = new EventHandler(this.targetElement, "mouseout", "hide", this, false);
	this.floatingDivHideHandler = new EventHandler(this.floatingDiv, "mouseout", "hide", this, false);

	EventManager.add(this.showHandler);
	EventManager.add(this.hideHandler);
	EventManager.add(this.floatingDivHideHandler);
	
}

Popup.prototype = 
{
	show: function(e)
	{
		this.floatingDiv.style.left = (findPosX(this.targetElement) -  findPosX(this.targetElement.offsetParent)) + 30 + 'px';
		this.floatingDiv.style.top = findPosY(this.targetElement) + (this.targetElement.offsetHeight) + 'px';

		this.isShowing = true;
		var obj = this;
		if (!this.isFadingIn)
		{
			window.clearInterval(this.floatingDiv.fadeInHandle);
			this.floatingDiv.fadeInHandle = window.setInterval(function() { obj.fadeIn(); }, 20)
		}
	},
	
	hide: function(e)
	{
		if(this.isShowing)
		{
			if (!e) var e = window.event;
			
			var relatedObj;
			if (e.relatedTarget) relatedObj = e.relatedTarget;
			else if(e.toElement) relatedObj = e.toElement;
			
			if(relatedObj)
			{
				var temp = relatedObj;
				var hideIt = true;
				
				while (temp.offsetParent) 
				{
					temp = temp.offsetParent;
					if(temp.id == this.floatingDiv.id)
						hideIt = false;
				}
				
				if (hideIt && !this.isFadingOut)
				{	
					if (relatedObj.id != this.floatingDiv.id && relatedObj.id != this.targetElement.id)
					{
						this.stopFadeIn();
						var obj = this;
						window.clearInterval(this.floatingDiv.fadeOutHandle);
						this.floatingDiv.fadeInHandle = window.setInterval(function() { obj.fadeOut(); }, 25)
					}
				}
			}
		}
	}
}

//static methods
Popup.prototype.fadeIn = function()
{
	this.isFadingIn = true;
	this.isFadingOut = false;
	//set object opacity
	this.opacity += 5;
	if (this.opacity >= 100)
	{
		this.opactiy = 100;
		this.stopFadeIn();
		this.isFadingIn = false;
	}
	this.renderOpacityCaller();
}

Popup.prototype.fadeOut = function()
{
	this.isFadingOut = true;
	this.isFadingIn = false;
	//set object opacity
	this.opacity -= 5;
	if (this.opacity <= 0)
	{
		this.opactiy = 0;
		this.stopFadeOut();
		this.isFadingOut = false;
	}
	
	this.renderOpacityCaller();
}

Popup.prototype.stopFadeIn = function()
{
	this.opacity = 100;

	this.isShowing = true;
	this.isFadingIn = false;
	window.clearInterval(this.floatingDiv.fadeInHandle); 
	this.renderOpacityCaller();
}

Popup.prototype.stopFadeOut = function()
{
	this.opacity = 0;
	this.isShowing = false;
	this.isFadingOut = false;
	window.clearInterval(this.floatingDiv.fadeOutHandle); 
	this.renderOpacityCaller();
}

Popup.prototype.renderOpacityForIE = function()
{
	this.floatingDiv.filters.alpha.opacity = this.opacity;
	this.updateVisibility();
}
	
Popup.prototype.renderOpacity = function()
{
	this.floatingDiv.style.opacity = this.opacity/100;
	this.updateVisibility();
}
	
Popup.prototype.updateVisibility = function () {
  if (this.opacity > 0) this.floatingDiv.style.display = '';
  else this.floatingDiv.style.display = 'none';
}

//end static methods


/*********************/
/* Events Classes */

function EventHandler(element, eventType, fn, obj, useCapture)
{
    this.useCapture = useCapture || false;
    this.element = element;
    this.eventType = eventType;
   	var self = this;

	this.__fixE = function(event) {
		if (!event) event = window.event;
		
		if (event.target)
			if (event.target.nodeType == 3) event.target = event.target.parentNode;
		else if (event.srcElement)
			event.target = event.srcElement;

		return event;
	}
	
	this.callback = function(e) {
		e = self.__fixE(e);
		// call the eventhandler
		var args = new Array;
		args[0] = e;
		obj[fn].apply(obj, args);
	}
}

EventManager =
{
    add: function (eventHandler)
    {
        if (eventHandler.element.addEventListener)
        {
            eventHandler.element.addEventListener(eventHandler.eventType, eventHandler.callback, eventHandler.useCapture);
            return true;
        }
        else if (eventHandler.element.attachEvent)
            return eventHandler.element.attachEvent("on" + eventHandler.eventType, eventHandler.callback);
    },
    
    remove: function (eventHandler)
    {
        if (eventHandler.element.removeEventListener)
        {
            eventHandler.element.removeEventListener(eventHandler.eventType, eventHandler.callback, eventHandler.useCapture);
            return true;
        }
        else if (eventHandler.element.detachEvent)
            return eventHandler.element.detachEvent("on" + eventHandler.eventType, eventHandler.callback);
    }
}

/* End EventManager */


/*
	Get Mouse Position method
*/

function getMousePos(e) {
	// posx and posy contain the mouse position relative to the document
	var posx = 0;
	var posy = 0;
	if (!e) var e = window.event;
	if (e.pageX || e.pageY) 	{
		posx = e.pageX;
		posy = e.pageY;
	}
	else if (e.clientX || e.clientY) 	{
		posx = e.clientX + document.body.scrollLeft
			+ document.documentElement.scrollLeft;
		posy = e.clientY + document.body.scrollTop
			+ document.documentElement.scrollTop;
	}
	var arr = new Array(2);
	arr[0] = posx;
	arr[1] = posy;
	return arr;
}


/*
	Get x and Y pos of a given object
*/

function findPosX(obj)
{
	var curleft = 0;
	if (obj.offsetParent) {
		while (obj.offsetParent) {
			curleft += obj.offsetLeft
			obj = obj.offsetParent;
		}
	}
	else if (obj.x) {
		curleft += obj.x;
	}
	return curleft;
}

function findPosY(obj)
{
	var curtop = 0;
	if (obj.offsetParent) {
		while (obj.offsetParent) {
			curtop += obj.offsetTop
			obj = obj.offsetParent;
		}
	}
	else if (obj.y) {
		curtop += obj.y;
	}
	return curtop;
}