/* 
Popup Style:
1 = Pop up or down
2 = No pop overrun of the imagemap
3 = Absolute Position based on css
*/

var _container;
var timeout = false;
var delay = 100;

var name;
var items;
var area;

function showItemsHandler(_name, _items, _area)
{	
	name = _name;
	items = _items;
	area = _area;
	
	if (typeof(showItems) != 'undefined')
	{
		showItems(name, items, area);
	}
}

// show selected items in container
function showItems(name, items, area)
{
	timeout = false;

	var _popup = document.getElementById(name + '_popup');
	var _popup_position = document.getElementById(name + '_popup_position').innerHTML;
	var _popupWrap = document.getElementById(name + '_popupWrap')
	var _popupBottom = document.getElementById(name + '_popupBottom')
	var _dealerMakeSpan = document.getElementById(name + '_popupDealerMake');

	if (items)
	{
		var _itemcount = 0;
		hideItems(name + '_popup');
		for (i = 0; i < items.length; i++)
		{
			var item = document.getElementById(items[i]);
			if (item)
			{
				if (item.innerHTML > '')
				{
					//this is where the links are displayed.
					item.style.display = 'block';
					_itemcount += 1;
					var areaAlt = area.alt;
					setupDealerInformation(_dealerMakeSpan, areaAlt);
				}
			}
		}
		
		// position menu
		if (_popup) 
		{
			_popup.style.visibility = 'hidden';
			_popup.style.display = 'block';
			if (area)
			{
				// relative
				if (_popup_position != 'Absolute' )
				{
					var coords = area.getAttribute("coords").split(",");
					var _maxHeight = _popup.parentNode.offsetHeight;
					var _popupHeight = _popup.offsetHeight;
					var _popupWidth = _popup.offsetWidth;
					var _left = 0;
					var _top = 0;

					//top
					if (_popup_position == 'Top')
					{
						_top = parseInt(coords[1]) - _popupHeight;
						_left = parseInt(coords[0]) + (parseInt(coords[2]) - parseInt(coords[0])) / 2 - _popupWidth / 2;
					}
					//right
					else if (_popup_position == 'Right')
					{
						_top = parseInt(coords[1]);
						var _offset = (parseInt(coords[2]) - parseInt(coords[0])) / 2;
						_offset = _offset - (_popupWidth / 2);
						_offset = 0;
						_left = parseInt(coords[2]) + _offset;
					}
					//bounded
					else if ((parseInt(coords[3]) + _popupHeight > _maxHeight && _popup_position == 'Bounded'))
					{
						_top = parseInt(coords[1]) - _popupHeight;
						var _offset = (parseInt(coords[2]) - parseInt(coords[0])) / 2;
						_offset = _offset - (_popupWidth / 2);
						_offset = 0;
						_left = parseInt(coords[0]) + _offset;
					}
					//bottom
					else
					{	
						_top = parseInt(coords[3]);
						var _offset = (parseInt(coords[2]) - parseInt(coords[0])) / 2;
						_offset = _offset - (_popupWidth / 2);
						_offset = 0;
						
						_left = parseInt(coords[0]) + _offset;
					}
					
					_popup.style.top = _top + 'px';
					_popup.style.left = _left + 'px';
					
					var _logoMap = document.getElementById('logo_background');

					var _topPointer = document.getElementById(name + '_popupPointer');
					var _bottomPointer = document.getElementById(name + '_popupDown');
					var _popupWrap = $(name + '_popupWrap');

					if (_topPointer && _bottomPointer && _popupWrap)
					{
						if (coords)
						{
							setupPopupStructure(name,coords, _popup, _topPointer, _bottomPointer, _maxHeight, _logoMap);
						}
					}
				}
				else
				{
					_popup.style.top = '';
					_popup.style.left = '';
				}	
			}
			if (_itemcount > 0)
			{
				_popup.style.visibility = 'visible';
			}
		}
	}
}

function hideItems(container) 
{
	var e = document.getElementById(container).getElementsByTagName('a');
	for (i = 0; i < e.length; i++)
	{
		e[i].style.display = 'none';
	}
}

function showPopup(container)
{
	timeout = false;
	var el = document.getElementById(container + '_popup');
	el.style.display = "block";
}

function hidePopup(container)
{
	_container = container
	timeout = true;
	setTimeout('hidePopup_NoDelay(_container)', delay);	
}

function hidePopup_NoDelay(container)
{
	var _e = document.getElementById(container + '_popup');
	if (timeout == true)
	{
		_e.style.display = "none";
	}
}

function showRollover(container, area, img)
{
	var _rollover = document.getElementById(img);
	var _rollover_position = document.getElementById(container + '_position').innerText;
	var _container = document.getElementById(container);
	
	if (!_rollover || !_rollover_position || !_container)
	{
		return false;
	}
	
	// hide images
	_container.style.display = 'none';
	var _el = document.getElementById(container).getElementsByTagName("img");
	for (i = 0; i < _el.length; i++)
	{
		_el[i].style.visibility = 'hidden';
	}

	// position image
	var _img = document.getElementById(img);
	if (_rollover_position == 'Relative')
	{
		if (area.coords && _img)
		{
			var coords = area.coords.split(",");
			
			// calc width of area tag
			var _areaHeight = parseInt(coords[3]) - parseInt(coords[1])
			var _areaWidth = parseInt(coords[2]) - parseInt(coords[0])
			
			// calc width of img tag
			var _imgHeight = _img.height;
			var _imgWidth = _img.width;
			
			// calc top and left position to center rollover graphic over the area
			var _top = (_imgHeight / 2) - (_areaHeight / 2)
			var _left = (_imgWidth / 2) - (_areaWidth / 2)
			
			_img.style.top = parseInt(coords[1]) - _top + 'px';
			_img.style.left = parseInt(coords[0]) - _left + 'px';
			_img.onmouseover = area.onmouseover;
			_img.onmouseout = area.onmouseout;
			_img.coords = area.coords;
		}
	}
	
	// show image
	if (_img && _container) 
	{
		_img.style.visibility = 'visible'
		_container.style.display = 'block';
	}
	
	_img.style.position = 'absolute';
}

function hideRollover(img)
{
	var _img = document.getElementById(img);
	if (_img) 
	{
		_img.style.display = 'none';
	}
}

function pointerPositioning(pointer, popupWrap, areaCoords)
{
	var popupWrapL = popupWrap.offsetLeft;
	var areaL = parseInt(areaCoords[0]);
	var areaW = parseInt(areaCoords[2]) - parseInt(areaCoords[0]);
	var pointerW = pointer.offsetWidth;
	var areaC = areaL + 0.5*areaW;
	var pointerL = areaC - 0.5*pointerW - popupWrapL;
	pointer.style.left = pointerL + 'px';
}

function pickTopOrBottom(popup, popupWrap, popupTop, popupMiddle, popupBottom, topPointer, bottomPointer, areaCoords, maxHeight, container)
{
	var containerBottomOffset = container.offsetBottom;
	bottomPointer.style.display = 'block';

	var popupHeight = popupTop.offsetHeight + popupMiddle.offsetHeight + popupBottom.offsetHeight;
	var remainingSpace = maxHeight - areaCoords[3];

	if (remainingSpace < popupHeight)
	{
		var newBottom = maxHeight + popupHeight - areaCoords[1] + 'px';
		popup.style.bottom = newBottom;
		popup.style.top = 'auto';
		topPointer.style.display = 'none';
		bottomPointer.style.display = 'block';
		pointerPositioning(bottomPointer, popupWrap, areaCoords);
	}
	else
	{
		topPointer.style.display = 'block';
		bottomPointer.style.display = 'none';
		pointerPositioning(topPointer, popupWrap, areaCoords);
	}
}

function pickLeftOrRight(anchorCount, popup, popupWrap, areaCoords)
{
	if (anchorCount > 1)
	{
		popupWrap.style.left = '0px';
		popupWrap.style.right = 'auto';	
	}
	else
	{
		var areaCenter = 0.5*(parseInt(areaCoords[2]) + parseInt(areaCoords[0]));

		if (areaCenter > 0.5 * popup.offsetWidth)
		{	
			popupWrap.style.left = 'auto';
			popupWrap.style.right = '10px';
		}
		else
		{
			popupWrap.style.left = '0px';
			popupWrap.style.right = 'auto';
		}	
	}
}

function setupPopup(popup, popupWrap, topSection, middleSection, bottomSection, middleLeft, middleCenter, middleRight, topLeft, topCenter, topRight, bottomLeft, bottomCenter, bottomRight, areaCoords)
{
	var anchorCount = adjustWidths(middleCenter, topCenter, bottomCenter);
	if(anchorCount)
	{
		if (middleLeft && middleCenter)
		{
			middleLeft.style.height = middleCenter.offsetHeight + 'px';
			var middleRightLeftOffset = middleLeft.offsetWidth + middleCenter.offsetWidth;
		}
		else
		{
			var middleRightLeftOffset = 0;
		}

		if (middleRight)
		{
			middleRight.style.left = middleRightLeftOffset + 'px';
			middleRight.style.height = middleCenter.offsetHeight + 'px';
		}
		
		if (middleLeft && middleRight && middleCenter)
		{
			var middleSectionWidth = middleLeft.offsetWidth + middleRight.offsetWidth + middleCenter.offsetWidth;
			
			if (middleSection)
			{
				middleSection.style.width = middleSectionWidth + 'px';
			}
			
			if (topSection)
			{	
				topSection.style.width = middleSectionWidth + 'px';
			}
			
			if (bottomSection)
			{
				bottomSection.style.width = middleSectionWidth + 'px';
			}
			
			if (topLeft && middleLeft)
			{
				topLeft.style.width = middleLeft.offsetWidth + 'px';
			}
			
			if (topRight && middleRight)
			{
				topRight.style.width = middleRight.offsetWidth + 'px';
			}
			
			if (bottomLeft && middleLeft)
			{
				bottomLeft.style.width = middleLeft.offsetWidth + 'px';
			}
			
			if (bottomRight && middleRight)
			{
				bottomRight.style.width = middleRight.offsetWidth + 'px';
			}
			
			if (bottomSection && middleSection)
			{
				bottomSectionVerticalOffset = middleSection.offsetHeight;
				bottomSection.style.top = bottomSectionVerticalOffset + 'px';
			}
		}
		
		pickLeftOrRight(anchorCount, popup, popupWrap, areaCoords);
	}
}

function countDisplayedLinks()
{
	var count = 0;
	var anchorWidth;
	var anchorHeight;

	var anchorArray = $$('.make_element');
	var displayedAnchorArray = [];
	for (i=0;i<=anchorArray.length;i++)
	{	
		if	(anchorArray[i])
		{
			if (anchorArray[i].style.display == 'block')
			{
				count++;
				anchorWidth = anchorArray[i].offsetWidth;
				anchorHeight = anchorArray[i].offsetHeight;
				displayedAnchorArray.push(anchorArray[i]);
			}
		}
	}
	var results = [displayedAnchorArray.length, anchorWidth, anchorHeight];
	return results;
}

function adjustWidths(middleCenter, topCenter, bottomCenter)
{
	var anchorInformation = countDisplayedLinks();
	var anchorCount;
	if (anchorInformation)
	{
		anchorCount = anchorInformation[0];
		var anchorWidth = anchorInformation[1];
		var anchorHeight = anchorInformation[2];
		var fudgeFactor = 30;
		var fudgeFactoredWidth = 0;
		if(anchorCount > 1)
		{
			var doubleWidth = 2 * anchorWidth;
			fudgeFactoredWidth = fudgeFactor + doubleWidth;
			if (middleCenter)
			{
				middleCenter.style.width = fudgeFactoredWidth + 'px';
			}
			if (topCenter)
			{
				topCenter.style.width = fudgeFactoredWidth + 'px';
			}
			
			if (bottomCenter)
			{
				bottomCenter.style.width = fudgeFactoredWidth + 'px';
			}
		}
		else
		{	
			fudgeFactoredWidth = fudgeFactor + anchorWidth;
			if (middleCenter)
			{
				middleCenter.style.width = fudgeFactoredWidth + 'px';
			}
			if (topCenter)
			{	
				topCenter.style.width = fudgeFactoredWidth + 'px';
			}
			
			if (bottomCenter)
			{
				bottomCenter.style.width = fudgeFactoredWidth + 'px';
			}
		}
		return anchorCount;
	}
	else
	{
		anchorCount = 4;
		return anchorCount;
	}
}

function setupDealerInformation(dealerMakeSpan, dealerMakeInformation)
{
	if (dealerMakeSpan)
	{
		if (dealerMakeInformation)
		{
			dealerMakeSpan.innerHTML = dealerMakeInformation + ' ';
		}
		else
		{
			dealerMakeSpan.innerHTML = '';
		}
	}
}

function setupPopupStructure(name, coords, _popup, _topPointer, _bottomPointer, _maxHeight, _logoMap)
{
	var _popupWrap = document.getElementById(name + '_popupWrap');
	var _popupTop = document.getElementById(name + '_popupTop');
	var _popupBottom = document.getElementById(name + '_popupBottom');
	var _popupMiddle = document.getElementById(name + '_popupMiddle');
	var _popupMiddleLeft = document.getElementById(name + '_popupMiddleLeft');
	var _popupMiddleCenter = document.getElementById(name + '_popupMiddleCenter');
	var _popupMiddleRight = document.getElementById(name + '_popupMiddleRight');
	var _popupTopLeft = document.getElementById(name + '_popupTopLeft');
	var _popupTopCenter = document.getElementById(name + '_popupTopCenter');
	var _popupTopRight = document.getElementById(name + '_popupTopRight');
	var _popupBottomLeft = document.getElementById(name + '_popupBottomLeft');
	var _popupBottomCenter = document.getElementById(name + '_popupBottomCenter');
	var _popupBottomRight = document.getElementById(name + '_popupBottomRight');

	setupPopup(_popup, _popupWrap, _popupTop, _popupMiddle, _popupBottom, _popupMiddleLeft, _popupMiddleCenter, _popupMiddleRight, _popupTopLeft, _popupTopCenter, _popupTopRight, _popupBottomLeft, _popupBottomCenter, _popupBottomRight, coords);	
	pickTopOrBottom(_popup, _popupWrap, _popupTop, _popupMiddle, _popupBottom, _topPointer, _bottomPointer, coords, _maxHeight, _logoMap);
}