/*=============================================================================
This javascript has all the functions necessary to display a quick info box.
The quick info box is a box that popups and shows some short information 
about a product. Some interesting features of the box is that the user is
able to click and drag the box anywhere inside the browser. It also recognizes
when an edge of the browser is reached, and the box will reposition itself so
that it will be displayed in full. In order to modify this code make sure 
you have a good understanding of how AJAX and PHP works together.

Modified: 06//17/08
Created By: John Kim
=============================================================================*/

//========================QUICK INFO BOX CONTENT START=========================
/*-----------------------------------------------------------------------------
Description: AJAX Function that will retrieve the content for the quick info
             box.
-----------------------------------------------------------------------------*/
function getContent (productID,ret)
{
	//create objects
	var content = document.getElementById('content');
	var req = ajaxFunction();
	
	//post productParentTypeID
	var str = 'prodID='+productID+'&ret='+ret;
	
	//ajax function
	req.onreadystatechange = function() 
	{
		//display loading image
		if(req.readyState == 0)
			content.innerHTML = '<center><img class="load" src="quickInfo/ajax-loader.gif" /></center>';
		if(req.readyState == 1)
			content.innerHTML = '<center><img class="load" src="quickInfo/ajax-loader.gif" /></center>';
		if(req.readyState == 2)
			content.innerHTML = '<center><img class="load" src="quickInfo/ajax-loader.gif" /></center>';
		if(req.readyState == 3)
			content.innerHTML = '<center><img class="load" src="quickInfo/ajax-loader.gif" /></center>';
		
		//Complete Request
		if(req.readyState == 4) { 
			if(req.status == 200){
					
				//retrieve a list of patients enclosed in checkboxes
				var response = req.responseText;
				content.innerHTML = response;
			}
			else {
				document.getElementById('errorbox').innerHTML="Error: returned status <br />code " + req.status + " " + req.statusText;
			}
		} 
	};
	req.open("POST", "quickInfo/quickInfo_process.php?action=1", true); 
	req.setRequestHeader("Content-Type", "application/x-www-form-urlencoded"); 
	req.send(str);
}



/*-----------------------------------------------------------------------------
Description: AJAX Function that will retrieve the content for retreiving all
             the products related to a promotions product type
-----------------------------------------------------------------------------*/
//global value used to filter out products for a promotions product type
var filter = ''; 
function getPromoContent(productTypeID,minimum)
{
	//create objects
	var content = document.getElementById('content');
	var req = ajaxFunction();
	
	//post information 
	var str = 'prodTypeID='+productTypeID+'&min='+minimum+'&filter='+filter;
	
	//ajax function
	req.onreadystatechange = function() 
	{
		//display loading image
		if(req.readyState == 0)
			content.innerHTML = '<center><img class="load" src="quickInfo/ajax-loader.gif" /></center>';
		if(req.readyState == 1)
			content.innerHTML = '<center><img class="load" src="quickInfo/ajax-loader.gif" /></center>';
		if(req.readyState == 2)
			content.innerHTML = '<center><img class="load" src="quickInfo/ajax-loader.gif" /></center>';
		if(req.readyState == 3)
			content.innerHTML = '<center><img class="load" src="quickInfo/ajax-loader.gif" /></center>';
		
		//Complete Request
		if(req.readyState == 4) { 
			if(req.status == 200){
					
				//retrieve a list of patients enclosed in checkboxes
				var response = req.responseText;
				content.innerHTML = response;
			}
			else {
				document.getElementById('errorbox').innerHTML="Error: returned status <br />code " + req.status + " " + req.statusText;
			}
		} 
	};
	req.open("POST", "quickInfo/quickInfo_process.php?action=2", true); 
	req.setRequestHeader("Content-Type", "application/x-www-form-urlencoded"); 
	req.send(str);
	
	return;
}



/*-----------------------------------------------------------------------------
Description: set the filter for the promotion content
-----------------------------------------------------------------------------*/
function setFilter(tmpFilter)
{
	filter = tmpFilter;
	return;
}



/*-----------------------------------------------------------------------------
description: create the ajax object
-----------------------------------------------------------------------------*/
function ajaxFunction()
{
	var xmlHttp;
	try
	{
		// Firefox, Opera 8.0+, Safari
		xmlHttp=new XMLHttpRequest();
	}
	catch (e)
	{
		// Internet Explorer
		try
		{
			xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
		}
		catch (e)
		{
			try
			{
				xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
			}	
			catch (e)
			{
				alert("Your browser does not support AJAX!");
				return false;
			}
		}
	}
	
	return xmlHttp;
}
//========================CQUICK INFO BOX CONTENT END==========================









//========================SHOW QUICK INFO BOX START============================
/*-----------------------------------------------------------------------------
Description: show the quick info box
-----------------------------------------------------------------------------*/
function showBox (productID,e)
{
	var container = document.getElementById('quickViewContainer');
	container.style.display = 'none';
	
	//get mouse position
	var mouseXY = new Array();
	mouseXY = mousePos(e);
	
	//get the scroll Position
	var scrollXY = new Array();
	scrollXY = scrollPos();
	
	//position the quickInfoBox
	var posX = mouseXY[0] + 50;
	var posY = mouseXY[1] - 200;

	//retrieve the inner window dimensions
	var winSize = new Array;
	winSize = windowSize();
	winWidth = winSize[0];
	winHeight = winSize[1] + scrollXY[1];

	//if the quick info box reached the bottom of the window
	if((winHeight - (posY + 450)) < 0)
		posY += winHeight - (posY + 450);
	
	//if the quick info box reached the top of the window
	if((mouseXY[1]-(scrollXY[1]+200)) < 0)
		posY -= (mouseXY[1]-(scrollXY[1]+250)) ;

	//if the quick info box reached the far right of the window
	if(winWidth - (posX +500) < 0)
		posX += winWidth - (posX + 550);

	//assign position
	container.style.left = posX+'px';
	container.style.top = posY+'px';
	
	//display the container
	container.style.display = 'block';
	
	//if the productID string starts with a p
	if(productID.match(/^p/))
		getPromoContent(productID,0); //then display promo
	//else display current specials
	else
		getContent(productID,'')
	
	return;
}



/*-----------------------------------------------------------------------------
Description: Return the scroll position
-----------------------------------------------------------------------------*/
function scrollPos()
{
	var scrollX, scrollY;
      
	//find the scroll positions
	if (document.all)
	{
		if (!document.documentElement.scrollLeft)
			scrollX = document.body.scrollLeft;
		else
			scrollX = document.documentElement.scrollLeft;
		   
	 	if (!document.documentElement.scrollTop)
			scrollY = document.body.scrollTop;
	 	else
			scrollY = document.documentElement.scrollTop;
	}   
	else
	{
	 	scrollX = window.pageXOffset;
	 	scrollY = window.pageYOffset;
	}
	
	var scrollXY = new Array();
	scrollXY[0] = scrollX;
	scrollXY[1] = scrollY;
	
	return scrollXY;
}



/*-----------------------------------------------------------------------------
Description: inner window width and height
-----------------------------------------------------------------------------*/
function windowSize()
{
	var winWidth, winHeight;
      
	//find the width and height of the inner window
	if(this.innerWidth)
	{
		winWidth = this.innerWidth;
		winHeight = this.innerHeight;
	}
	else
	{
		winWidth = document.body.clientWidth-50;
		winHeight = document.body.clientHeight;
	}
	
	var winSize = new Array();
	winSize[0] = winWidth;
	winSize[1] = winHeight;
	
	return winSize;
}
//========================SHOW QUICK INFO BOX END==============================










//========================CLOSE QUICK INFO BOX START===========================
/*-----------------------------------------------------------------------------
Description: Mouse Over for the close button
-----------------------------------------------------------------------------*/
//preload the rollover image
image1 = new Image();
image1.src = "./quickInfo/close_over.gif";
function closeOver (over)
{
	//create object
	images = document.getElementById('closeImg');
	
	//mouse over selection
	if(over)
		images.src = './quickInfo/close_over.gif';
	else
		images.src = './quickInfo/close.gif';
		
	return;
}



/*-----------------------------------------------------------------------------
Description: Mouse Over for the close button
-----------------------------------------------------------------------------*/
function closeBox()
{
	var box = document.getElementById('quickViewContainer');
	
	//hide quick info box
	box.style.display = 'none';
	
	//make sure that the mouse move event is not still active
	clickDrag(false)
	
	return;
	
}
//=========================CLOSE QUICK INFO BOX END============================










//===========================CLICK AND DRAG START==============================
var initPos = new Array();
var offsetLeft = 0, offsetTop = 0;
var infoBox;

/*-----------------------------------------------------------------------------
Description: This function will initilialize the process of clicking and 
             dragging the quick info box.
-----------------------------------------------------------------------------*/
function clickDrag (val,e)
{
	//initialize the quick info Box object only once
	if(infoBox == undefined)
		infoBox = document.getElementById('quickViewContainer');
	
	//if mouse is down
	if(val)
	{
		//set up the quick info box to follow the mouse
		offsetLeft = infoBox.offsetLeft;
		offsetTop = infoBox.offsetTop;
		initPos = mousePos(e);
		document.onmousemove = move;
		
		//disable text selection
		document.onselectstart = function() {return false;} // ie
  		document.onmousedown = function() {return false;} // mozilla
	}
	//else reset values
	else
	{
		document.onmousemove = null;
		initPos = new Array();
		offsetLeft = 0;
		offsetTip = 0;
		
		//enable text selection
		document.onselectstart = function() {return true;} // ie
  		document.onmousedown = function() {return true;} // mozilla
	}
	
	return;
}



/*-----------------------------------------------------------------------------
Description: Moves the quick info box
-----------------------------------------------------------------------------*/
function move (e)
{
	//get mouse position
	pos = new Array();
	pos = mousePos(e);
	
	//calculate the offset of the quick info box to the mouse position
	var movex = offsetLeft + (pos[0] - initPos[0]);
	var movey = offsetTop + (pos[1] - initPos[1]);
	
	//update the quick info boxes coordinates
	infoBox.style.top = movey+'px';
	infoBox.style.left = movex+'px';
	
	return;
}



/*-----------------------------------------------------------------------------
Description: Get the mouse position
-----------------------------------------------------------------------------*/
function mousePos (e)
{
	//initialize variables
	var posx=0, posy=0;
	if(!e) e = window.event;
	
	//Navigator
	if(e.pageX || e.pageY)
	{
		posx=e.pageX;
		posy=e.pageY;
	}
	//Explorer
	else if(e.clientX || e.clientY)
	{
		if(document.documentElement.scrollTop)
		{
				posx=e.clientX+document.documentElement.scrollLeft;
				posy=e.clientY+document.documentElement.scrollTop;
		}
		else
		{
			posx=e.clientX+document.body.scrollLeft;
			posy=e.clientY+document.body.scrollTop;
		}
	}
	
	//store positions into an array to return
	var pos = new Array();
	pos[0] = posx;
	pos[1] = posy;

	return pos;
}

//===========================CLICK AND DRAG END================================