window.onload = function () {
  postProcessHTML();
  initOnChangeEvents();
  initSendToFriend();
}
/****************************************************************
 * Postprocess html to:
 * 1. Generate compact form labels
 * 2. Fix IE6 corners bug.
 * --------------------------------------------
 * n.b. Any operation requiring iteration over the divs in the document should be
 * added as a new case in this function such that the browser only has to loop
 * once through the divs collection
 ***************************************************************/
function postProcessHTML() {
	var divs = document.getElementsByTagName('div');

	for (var i=0;i<divs.length;i++) {
		switch(divs[i].className) {
			case 'compactlabel':
				if(isEmpty(divs[i].getElementsByTagName('input')[0].value)){
					divs[i].getElementsByTagName('label')[0].className="";
				}
			
				divs[i].getElementsByTagName('input')[0].onfocus=toggleLabel('hide',divs[i].getElementsByTagName('label')[0],divs[i].getElementsByTagName('input')[0]);
				divs[i].getElementsByTagName('label')[0].onclick=toggleLabel('hide',divs[i].getElementsByTagName('label')[0],divs[i].getElementsByTagName('input')[0]);
				divs[i].getElementsByTagName('input')[0].onblur=toggleLabel('show',divs[i].getElementsByTagName('label')[0],divs[i].getElementsByTagName('input')[0]);
			break;
			
			case 'corner': /*Fix bug where, in ie6, absolutely positioned corners do not align correctly with bottom right corner of parent container when the height/width is an odd number*/
				if($bIE6) {
					if(divs[i].parentNode.clientHeight%2){
						divs[i].style.bottom = -2 + 'px';
					}
					if(divs[i].parentNode.clientWidth%2){
						divs[i].style.right = -2 + 'px';
					}
				}
			break;
		}
	}
}

function toggleLabel(state,labelElement,inputElement) {
	if(state=='show') {
		var returnFunction = function () {
			if(isEmpty(inputElement.value)){
				labelElement.className="";
			}
		}
	} else {
		var returnFunction = function () {labelElement.className="hide";}
	}
  return returnFunction;
}

function isEmpty(inputStr) {
	return (null == inputStr || "" == inputStr);
}


/****************************************************************
* Map overlays
***************************************************************/
//var mapImg;
var mapAreas;

function initMapOverlays(mapName) {
//mapImg = document.getElementById(mapName + 'Image');
mapAreas=document.getElementById(mapName + 'Regions').getElementsByTagName('area');

	for (var i=0;i<mapAreas.length;i++) {
		preloadImage= new Image(); 
		preloadImage.src = "/_images/map/" + mapAreas[i].id + ".png";
		preloadImage=null;
	
		mapAreas[i].onmouseover = function() { regionHover(this.id,mapName); }
		mapAreas[i].onfocus = function() { regionHover(this.id,mapName); }
		
		mapAreas[i].onmouseout = function() { regionUnHover(this.id,mapName); }
		mapAreas[i].onblur = function() { regionUnHover(this.id,mapName); }
		
		document.getElementById(mapAreas[i].id + 'Nav').onmouseover = function() { navHover(this.id,mapName) };
		document.getElementById(mapAreas[i].id + 'Nav').onfocus = function() { navHover(this.id,mapName) };
		
		document.getElementById(mapAreas[i].id + 'Nav').onmouseout = function() { navUnHover(this.id,mapName) };
		document.getElementById(mapAreas[i].id + 'Nav').onblur = function() { navUnHover(this.id,mapName) };
		
	}
}
 
function regionHover(region,mapName) {
	document.getElementById(mapName + 'Image').src = "/_images/map/" + region + ".png";
	document.getElementById(region + 'Nav').parentNode.className="hover";
}

function navHover(region,mapName) {
	document.getElementById(mapName + 'Image').src = "/_images/map/" + region.substring(0,region.length-3) + ".png";
}


function regionUnHover(region,mapName) {
	document.getElementById(mapName + 'Image').src = "/_images/map/" + mapName + ".png";
	document.getElementById(region + 'Nav').parentNode.className="";
}

function navUnHover(region,mapName) {
	document.getElementById(mapName + 'Image').src = "/_images/map/" + mapName + ".png";
	document.getElementById(region).parentNode.className="";
}




/****************************************************************
* Send to friend forms
***************************************************************/
var sendToFriend = document.getElementById('sendToFriend');
var mainColumn = document.getElementById('mainColumn');
var sendToFriendLink = document.getElementById('sendToFriendLink');

function showSendToFriend() {
	sendToFriend.style.position = "absolute";
	sendToFriend.style.top = "0";
	sendToFriend.style.left = "250px";
	mainColumn.style.paddingTop = sendToFriend.clientHeight + 15 + "px";
	sendToFriendLink.style.display = "none"
}

function hideSendToFriend() {
	sendToFriend.style.position = "absolute";
	sendToFriend.style.top = "0";
	sendToFriend.style.left = "-10000px";
	mainColumn.style.paddingTop = "0px";
	sendToFriendLink.style.display = "block"
}

function initSendToFriend() {
	if(document.getElementById('sendToFriend')){
        var sendToFriendHR = document.getElementById('sendToFriendHR');
		var cancelButton = document.getElementById('sendToFriendCancel');
		var sendButton = document.getElementById('sendToFriendSend');

		sendToFriendHR.parentNode.removeChild(sendToFriendHR);

		if(bShowSendToFriend) {
			showSendToFriend();
		} else {
	        hideSendToFriend();
		}

		cancelButton.onclick = function() { hideSendToFriend(); return false; }
		sendToFriendLink.onclick = function() { showSendToFriend(); return false; }
	}
}

/****************************************************************
* Init on change events for select boxes with class="onchange"
***************************************************************/
function initOnChangeEvents() {
	selectBoxes = document.getElementsByTagName('select');
	for (var i=0;i<selectBoxes.length;i++) {
		if(selectBoxes[i].className=="onChangeSubmit") {
			selectBoxes[i].onchange = function() { if (this.value!='false') {this.form.submit();} }
		}
	}
}