/**
 * =~=~=~=~=~=~=~=~=~=~=~=~=~=~=
 * MapQuest Image Slider JavaScript
 * =~=~=~=~=~=~=~=~=~=~=~=~=~=~=
 * js for image sliding functionality
 * =~=~=~=~=~=~=~=~=~=~=~=~=~=~=
 * TOC
 * - default variables
 * - dragStart
 * - dragGo
 * - dragStop
 * - callSlideImage
 * - slideImage
 * - panEast
 * - panWest
 * - panSouth
 * - panNorthWest
 * - panNorthEast
 * - panSouthEast
 * - panSouthWest
 * - swapImageIds
 * - pause
 *
 */ 
 
/**
 * =DEFAULT VARIABLES
 */
var newLeftPos = 0;
var newTopPos = 0;
var imgSlider;
var imgPortView;
var sliderLeftPos;
var sliderTopPos;
var mapHeight;
var mapWidth;
var moveFactor = 2.5; //40% -> 2.5=100/40

var pDir;
var currMapId;
var pDelay = 10;//milliseconds to wait when setTimeout is called recursively

var dragObj = new Object();
dragObj.zIndex = 0;

var isIE = document.all?true:false;

/**
 * =DRAG START 
 * @Drag Start Event
 */
function dragStart(event)
{
	var x, y;
	var btnPressed = isIE?window.event.button:event.which;
	if(btnPressed > 1) return;
	dragObj.elNode = isIE?window.event.srcElement:event.target;
	dragObj.elNode.style.cursor = "move";
	// Get cursor position with respect to the page.
	if (isIE)
	{
		x = window.event.clientX + document.documentElement.scrollLeft + document.body.scrollLeft;
		y = window.event.clientY + document.documentElement.scrollTop  + document.body.scrollTop;
	}
	else
	{
		x = event.clientX + window.scrollX;
		y = event.clientY + window.scrollY;
	}
	// Save starting positions of cursor and element.
	dragObj.cursorStartX = x;
	dragObj.cursorStartY = y;
	// Capture mousemove and mouseup events on the page.
	if (isIE)
	{
		document.attachEvent("onmousemove", dragGo);
		document.attachEvent("onmouseup",   dragStop);
		window.event.cancelBubble = true;
		window.event.returnValue = false;
	}
	else
	{
		document.addEventListener("mousemove", dragGo,   true);
		document.addEventListener("mouseup",   dragStop, true);
		event.preventDefault();
	}
}
/**
 * =DRAG GO 
 * @
 */
function dragGo(event)
{
  if (isIE)
  {
  	window.event.cancelBubble = true;
  	window.event.returnValue = false;
  }
  else
  {
  	event.preventDefault();
  }
}
/**
 * =DRAG STOP 
 * @Drag Stop event
 */
function dragStop(event)
{
	var x,y;
	dragObj.elNode.style.cursor = "default";
	if (isIE)
	{
		document.detachEvent("onmousemove", dragGo);
		document.detachEvent("onmouseup",   dragStop);
		x = window.event.clientX + document.documentElement.scrollLeft + document.body.scrollLeft;
		y = window.event.clientY + document.documentElement.scrollTop + document.body.scrollTop;
	}
	else
	{
		document.removeEventListener("mousemove", dragGo,   true);
		document.removeEventListener("mouseup",   dragStop, true);
		x = event.clientX + window.scrollX;
		y = event.clientY + window.scrollY;
	}
	dragObj.cursorEndX = x;
	dragObj.cursorEndY = y;
	if ((dragObj.cursorStartX > (dragObj.cursorEndX+50)) && (dragObj.cursorEndY > (dragObj.cursorStartY+50)))
		panMap("ne", dragObj.elNode.id);
	else if ((dragObj.cursorStartX > (dragObj.cursorEndX+50)) && (dragObj.cursorStartY > (dragObj.cursorEndY+50)))
		panMap("se", dragObj.elNode.id);
	else if ((dragObj.cursorEndX > (dragObj.cursorStartX+50)) && (dragObj.cursorStartY > (dragObj.cursorEndY+50)))
		panMap("sw", dragObj.elNode.id);
	else if ((dragObj.cursorEndX > (dragObj.cursorStartX+50)) && (dragObj.cursorEndY > (dragObj.cursorStartY+50)))
		panMap("nw", dragObj.elNode.id);
	else if ((dragObj.cursorEndX < (dragObj.cursorStartX+50)) && (dragObj.cursorEndY > (dragObj.cursorStartY+50)))
		panMap("n", dragObj.elNode.id);
	else if ((dragObj.cursorStartX < (dragObj.cursorEndX+50)) && (dragObj.cursorStartY > (dragObj.cursorEndY+50)))
		panMap("s", dragObj.elNode.id);
	else if ((dragObj.cursorEndX > (dragObj.cursorStartX+50)) && (dragObj.cursorEndY < (dragObj.cursorStartY+50)))
		panMap("w", dragObj.elNode.id);
	else if ((dragObj.cursorStartX > (dragObj.cursorEndX+50)) && (dragObj.cursorEndY < (dragObj.cursorStartY+50)))
		panMap("e", dragObj.elNode.id);
	else
		clickMap(event);
}
/**
 * =CALL SLIDE IMAGE
 * @Get the Slide image
 */
function callSlideImage(fNewMapUrl, fCurrMapId, fDir)
{
	//netscape 7.1 got issues with the layout created for mapslide functionality. Hence, work BAU.
    if((mapData.browser.name=="netscape")&&(mapData.browser.version == 7.1))
    {
        document.getElementById(fCurrMapId).src = fNewMapUrl;
        return;
    }
    imgSlider = document.getElementById("map0");
    imgPortView = document.getElementById(fCurrMapId);
    currMapId = fCurrMapId;//this value is accessed from swapImageIds fn.
    pDir = fDir;
    mapHeight = imgPortView.height;
    mapWidth = imgPortView.width;
    //clip the area according to the size of the map
    document.getElementById("mapcontainer").style.clip = "rect(0px," + String(mapWidth + 2) + "px," + String(mapHeight + 2) + "px,0px)";
    document.getElementById("mapcontainer").style.height = String(mapHeight)+"px";
    document.getElementById("mapcontainer").style.width = String(mapWidth)+"px";
    imgSlider.style.zIndex = 1;
    imgPortView.style.zIndex = 0;
    removeEvent(imgSlider, "click", clickMap);
    addEvent(imgSlider, "click", clickMap);
    imgSlider.src = fNewMapUrl;
    //opera 7.5 got issues with subsequent image loading
    if((mapData.browser.name=="opera")&&(mapData.browser.version < 8.0))
    {
    	pause(2500);
    	slideImage();
    }
    else
    {
    	imgSlider.onload = slideImage;
    }
}
/**
 * =SLIDE IMAGE
 * @Slide the image to the dragged direction
 */
function slideImage()
{
	switch(pDir)
	{
		case "e":
			sliderLeftPos = Math.round(mapWidth/moveFactor);
            imgSlider.style.left = String(sliderLeftPos) + "px";
            imgSlider.style.top = "0px";
            imgSlider.style.visibility = "visible";
            panEast();
            break;
        case "w":
            sliderLeftPos = Math.round((0-mapWidth)/moveFactor);
            imgSlider.style.left = String(sliderLeftPos) + "px";
            imgSlider.style.top = "0px";
            imgSlider.style.visibility = "visible";
            panWest();
            break;
        case "n":
            sliderTopPos = Math.round((0-mapHeight)/moveFactor);
            imgSlider.style.left = "0px";
            imgSlider.style.top = String(sliderTopPos) + "px";
            imgSlider.style.visibility = "visible";
            panNorth();
            break;
        case "s":
            sliderTopPos = Math.round(mapHeight/moveFactor);
            imgSlider.style.left = "0px";
            imgSlider.style.top = String(sliderTopPos) + "px";
            imgSlider.style.visibility = "visible";
            panSouth();
            break;
        case "nw":
            sliderLeftPos = Math.round((0-mapWidth)/moveFactor);
            sliderTopPos = Math.round((0-mapHeight)/moveFactor);
            imgSlider.style.left = String(sliderLeftPos) + "px";
            imgSlider.style.top = String(sliderTopPos) + "px";
            imgSlider.style.visibility = "visible";
            panNorthWest();
            break;
        case "ne":
            sliderLeftPos = Math.round(mapWidth/moveFactor);
            sliderTopPos = Math.round((0-mapHeight)/moveFactor);
            imgSlider.style.left = String(sliderLeftPos) + "px";
            imgSlider.style.top = String(sliderTopPos) + "px";
            imgSlider.style.visibility = "visible";
            panNorthEast();
            break;
        case "se":
            sliderLeftPos = Math.round(mapWidth/moveFactor);
            sliderTopPos = Math.round(mapHeight/moveFactor);
            imgSlider.style.left = String(sliderLeftPos) + "px";
            imgSlider.style.top = String(sliderTopPos) + "px";
            imgSlider.style.visibility = "visible";
            panSouthEast();
            break;
        case "sw":
            sliderLeftPos = Math.round((0-mapWidth)/moveFactor);
            sliderTopPos = Math.round(mapHeight/moveFactor);
            imgSlider.style.left = String(sliderLeftPos) + "px";
            imgSlider.style.top = String(sliderTopPos) + "px";
            imgSlider.style.visibility = "visible";
            panSouthWest();
            break;
    }
    pDir = "";
    if((mapData.browser.name=="msie")&&((mapData.browser.version== 5.0)||(mapData.browser.version== 5.5)))
    {
    	imgPortView.style.cursor = "hand";
    }
    else
    {
    	imgPortView.style.cursor = "hand";
    	imgPortView.style.cursor = "pointer";
    }
}
/**
 * =PAN EAST
 * @Pan towards East
 */
function panEast()
{
    imgSlider.style.left = String(sliderLeftPos - newLeftPos) + "px";
    imgPortView.style.left = String(0-newLeftPos) + "px";
	if(newLeftPos == Math.abs(sliderLeftPos))
    {
    	newLeftPos = 0;
        swapImageIds();
        imgSlider.style.visibility = "hidden";
        return;
    }
    if((newLeftPos+20) < Math.abs(sliderLeftPos))
    {
    	newLeftPos = newLeftPos + 20;
    }
    else
    {
    	newLeftPos = Math.abs(sliderLeftPos);
    }
    if(newLeftPos <= Math.abs(sliderLeftPos))
    {
        setTimeout("panEast();",pDelay);
    }
}
/**
 * =PAN WEST
 * @Pan towards West
 */
function panWest()
{
    imgSlider.style.left = String(sliderLeftPos + newLeftPos) + "px";
    imgPortView.style.left = String(newLeftPos) + "px";
    if(newLeftPos == Math.abs(sliderLeftPos))
    {
    	newLeftPos = 0;
        swapImageIds();
        imgSlider.style.visibility = "hidden";
        return;
    }
    if((newLeftPos+20) < Math.abs(sliderLeftPos))
    {
        newLeftPos = newLeftPos + 20;
    }
    else
    {
        newLeftPos = Math.abs(sliderLeftPos);
    }
    if(newLeftPos <= Math.abs(sliderLeftPos))
    {
        setTimeout("panWest();",pDelay);
    }
}
/**
 * =PAN NORTH
 * @Pan towards North
 */
 function panNorth()
 {
 	imgSlider.style.top = String(sliderTopPos + newTopPos) + "px";
    imgPortView.style.top = String(newTopPos) + "px";
 	if(newTopPos == Math.abs(sliderTopPos))
 	{
 		newTopPos = 0;
        swapImageIds();
        imgSlider.style.visibility = "hidden";
        return;
    }
    if((newTopPos+20) < Math.abs(sliderTopPos))
    {
        newTopPos = newTopPos + 20;
    }
    else
    {
        newTopPos = Math.abs(sliderTopPos);
    }
    if(newTopPos <= Math.abs(sliderTopPos))
    {
        setTimeout("panNorth();",pDelay);
    }
}
/**
 * =PAN SOUTH
 * @Pan towards South
 */
function panSouth()
{
	imgSlider.style.top = String(sliderTopPos - newTopPos) + "px";
    imgPortView.style.top = String(0-newTopPos) + "px";
    if(newTopPos == Math.abs(sliderTopPos))
    {
    	newTopPos = 0;
        swapImageIds();
        imgSlider.style.visibility = "hidden";
        return;
    }
    if((newTopPos+20) < Math.abs(sliderTopPos))
    {
        newTopPos = newTopPos + 20;
    }
    else
    {
        newTopPos = Math.abs(sliderTopPos);
    }
    if(newTopPos <= Math.abs(sliderTopPos))
    {
        setTimeout("panSouth();",pDelay);
    }
}
/**
 * =PAN NORTHWEST
 * @Pan towards NorthWest
 */
function panNorthWest()
{
    imgSlider.style.top = String(sliderTopPos + newTopPos) + "px";
    imgSlider.style.left = String(sliderLeftPos + newLeftPos) + "px";
    imgPortView.style.top = String(newTopPos) + "px";
    imgPortView.style.left = String(newLeftPos) + "px";
    if(newLeftPos == Math.abs(sliderLeftPos))
    {
        newTopPos = 0;
        newLeftPos = 0;
        swapImageIds();
        imgSlider.style.visibility = "hidden";
        return;
    }
    if((newLeftPos+20) < Math.abs(sliderLeftPos) && (newTopPos+20) < Math.abs(sliderTopPos))
    {
        newTopPos = newTopPos + 20;
        newLeftPos = newLeftPos + 26;
    }
    else
    {
        newTopPos = Math.abs(sliderTopPos);
        newLeftPos = Math.abs(sliderLeftPos);
    }

    if(newTopPos <= Math.abs(sliderTopPos) && newLeftPos <= Math.abs(sliderLeftPos))
    {
        setTimeout("panNorthWest();",pDelay);
    }
}
/**
 * =PAN NORTHEAST
 * @Pan towards NorthEast
 */
function panNorthEast()
{
    imgSlider.style.top = String(sliderTopPos + newTopPos) + "px";
    imgSlider.style.left = String(sliderLeftPos - newLeftPos) + "px";
    imgPortView.style.top = String(newTopPos) + "px";
    imgPortView.style.left = String(0-newLeftPos) + "px";
    if(newLeftPos == Math.abs(sliderLeftPos))
    {
        newTopPos = 0;
        newLeftPos = 0;
        swapImageIds();
        imgSlider.style.visibility = "hidden";
        return;
    }
    if((newLeftPos+20) < Math.abs(sliderLeftPos) && (newTopPos+20) < Math.abs(sliderTopPos))
    {
        newTopPos = newTopPos + 20;
        newLeftPos = newLeftPos + 26;
    }
    else
    {
        newTopPos = Math.abs(sliderTopPos);
        newLeftPos = Math.abs(sliderLeftPos);
    }
    if(newTopPos <= Math.abs(sliderTopPos) && newLeftPos <= Math.abs(sliderLeftPos))
    {
        setTimeout("panNorthEast();",pDelay);
    }
}
/**
 * =PAN SOUTHEAST
 * @Pan towards SouthEast
 */
function panSouthEast()
{
    imgSlider.style.top = String(sliderTopPos - newTopPos) + "px";
    imgSlider.style.left = String(sliderLeftPos - newLeftPos) + "px";
    imgPortView.style.top = String(0-newTopPos) + "px";
    imgPortView.style.left = String(0-newLeftPos) + "px";
    if(newLeftPos == Math.abs(sliderLeftPos))
    {
        newTopPos = 0;
        newLeftPos = 0;
        swapImageIds();
        imgSlider.style.visibility = "hidden";
        return;
    }
    if((newLeftPos+20) < Math.abs(sliderLeftPos) && (newTopPos+20) < Math.abs(sliderTopPos))
    {
        newTopPos = newTopPos + 20;
        newLeftPos = newLeftPos + 26;
    }
    else
    {
        newTopPos = Math.abs(sliderTopPos);
        newLeftPos = Math.abs(sliderLeftPos);
    }
    if(newTopPos <= Math.abs(sliderTopPos) && newLeftPos <= Math.abs(sliderLeftPos))
    {
        setTimeout("panSouthEast();",pDelay);
    }
}
/**
 * =PAN SOUTHWEST
 * @Pan towards SouthWest
 */
function panSouthWest()
{
    imgSlider.style.top = String(sliderTopPos - newTopPos) + "px";
    imgSlider.style.left = String(sliderLeftPos + newLeftPos) + "px";
    imgPortView.style.top = String(0-newTopPos) + "px";
    imgPortView.style.left = String(newLeftPos) + "px";
    if(newLeftPos == Math.abs(sliderLeftPos))
    {
    	newTopPos = 0;
        newLeftPos = 0;
        swapImageIds();
        imgSlider.style.visibility = "hidden";
        return;
    }
    if((newLeftPos+20) < Math.abs(sliderLeftPos) && (newTopPos+20) < Math.abs(sliderTopPos))
    {
        newTopPos = newTopPos + 20;
        newLeftPos = newLeftPos + 26;
    }
    else
    {
        newTopPos = Math.abs(sliderTopPos);
        newLeftPos = Math.abs(sliderLeftPos);
    }
    if(newTopPos <= Math.abs(sliderTopPos) && newLeftPos <= Math.abs(sliderLeftPos))
    {
        setTimeout("panSouthWest();",pDelay);
    }
}
/**
 * =SWAP IMAGE IDS
 * @Swap the Image Ids
 */
function swapImageIds()
{
	document.getElementById(currMapId).id = "temp";
	document.getElementById("map0").id = currMapId;
	document.getElementById("temp").id = "map0";
	imgSlider = document.getElementById("map0");
	imgPortView = document.getElementById(currMapId);
    imgSlider.style.zIndex = 1;
    imgPortView.style.zIndex = 0;
}
/**
 * =PAUSE
 * @Pause for the specified milliseconds
 */
function pause(numberMillis)
{
	var now = new Date();
    var exitTime = now.getTime() + numberMillis;
    while (true)
    {
    	now = new Date();
        if (now.getTime() > exitTime)
        	return;
    }
}