//this function retrieves the number of pixels from a CSS value, "343px" will be converted to "343"
function getPixels(id) {
	pixels = id.split("p");
	return parseInt(pixels[0]);
}

//displays the tooltip with name and message once the mouse is positioned above the smiley
function showtip(id,name,loc,url,date,message,email,icq,msn,yahoo) {
	//alert(message);
	tooltip = document.getElementById('tip');

	tooltip.style.top = document.getElementById('img' + id).style.top;
	tooltip.style.left = document.getElementById('img' + id).style.left;
	tooltip.innerHTML = "<strong>" + name + ":</strong>";

	if(url != "")
		tooltip.innerHTML = tooltip.innerHTML+"<br><a href="+url+" target=_blank>"+url+"</a>";

	/*if(date != "")
		tooltip.innerHTML = tooltip.innerHTML+"<br><strong>Date: </strong>"+date;*/

	tooltip.innerHTML = tooltip.innerHTML+"<br>("+loc+")<br><br>"+message+"<br><br>"+email;

	if(icq != "")
		tooltip.innerHTML = tooltip.innerHTML+"<br><strong>ICQ: </strong>"+icq;
	if(msn != "")
		tooltip.innerHTML = tooltip.innerHTML+"<br><strong>MSN: </strong>"+msn;
	if(yahoo != "")
		tooltip.innerHTML = tooltip.innerHTML+"<br><strong>YAHOO: </strong>"+yahoo;

	tooltip.style.visibility = "visible";
	tooltip.style.zIndex = 100;
}

//get the cursor location
function cursorLocation() {
	//needed for other browsers then MSIE
	if(!document.all) {
		document.captureEvents(Event.MOUSEMOVE);
	}
		
	document.getElementById('guestMapImage').onmousemove = showMousePosition;
}

//getting the cursor location works different in MSIE and Gecko (Mozilla/Netscape) browers
function showMousePosition(e) {
	var posY; 
	var posX; 

	if(!document.all) {
		posY = e.pageY;
		posX = e.pageX;
	} else {
		//MSIE needs some correction, especially when scrolling
		posX = window.event.x + document.body.scrollLeft - 1 + getPixels(document.getElementById('guestMapDiv').style.left);
        posY = window.event.y + document.body.scrollTop - 2 + getPixels(document.getElementById('guestMapDiv').style.top);
	}
	//insert the values in the hidden fields after compensating the map position
	document.getElementById('tempY').value = (posY - getPixels(document.getElementById('guestMapDiv').style.top));
	document.getElementById('tempX').value = (posX - getPixels(document.getElementById('guestMapDiv').style.left));
}

//once called, this function will make the form visible and store the current cursor position in some hidden fields
function showForm() {
	var imgArrow = document.getElementById('imgArrow').style;

	imgArrow.visibility = "visible";
	imgArrow.zIndex = 99;

	imgArrow.left = document.getElementById('tempX').value + "px";
	imgArrow.top = (document.getElementById('tempY').value - 12) + "px";
	
	// set click position, the numbers at the end are the image witdh/height divided by 2
	document.getElementById('cursorX').value = document.getElementById('tempX').value - 7;
	document.getElementById('cursorY').value = document.getElementById('tempY').value - 7;

	document.getElementById('mapform').style.visibility = "visible";
	document.getElementById('mapform').style.zIndex = 100;

	document.getElementById('noteDiv').style.visibility = "visible";
	document.getElementById('noteDiv').style.zIndex = 100;
}


//once an emoticon is selected all the others need to be made semi-transparant
function selectEmoticon(name,id) {
	document.getElementById('emoticonValue').value = name;
	
	var i = 1;
	
	//check each emoX element
	while(document.getElementById('emo' + i)) {
		if(id != i) {
			//if the i is unequal to the chosen id, make it semi-transparent
			changeOpac(50,'emo' + i);
		} else {
			//100% visible
			changeOpac(100,'emo' + i);
		}
		i++;
	}
}

//changes the (un)selected emoticon's opacity 
function changeOpac(opacity,id) {
	emoticon = document.getElementById(id).style;

	emoticon.filter = "alpha(opacity=" + opacity + ")";
	emoticon.MozOpacity = (opacity / 100);
	emoticon.opacity = (opacity / 100);
}

//hides any element depending on the id argument
function hide(id) {
	document.getElementById(id).style.visibility = "hidden";
	document.getElementById(id).style.zIndex = 0;
}

//this function is called once the form is submitted, it checks all the fields and returns in an alert() errors if needed.
function validate() {
	var errorMessage = "";

	if(document.getElementById('emoticonValue').value == "") {
		errorMessage = "- You haven't selected an emoticon.\n";
	}
	
	if(document.getElementById('nameValue').value.length < 3) {
		errorMessage += "- Your name is too short.\n";
	}

	if(document.getElementById('locationValue').value.length < 3) {
		errorMessage += "- Location is too short.\n";
	}

	if(document.getElementById('emailValue').value.length < 3) {
		errorMessage += "- Email is short.\n";
	}
	
	//var msgval = new String(document.getElementById('messageValue').value);
	if(document.getElementById('messageValue').value.length < 3) {
		errorMessage += "- Your message is too short.";
	}
	
	//if an error is set, display an alert and return false to prevent the form from being submitted
	if(errorMessage != "") {
		alert("Before continuing, check the following:\n" + errorMessage); 
		return false;
	} else {
		return true;
	}
}