function doComments() {
  if (!document.getElementsByTagName) return false;
  var links=document.getElementsByTagName("a");
  for (var i=0; i < links.length; i++) {
    if (links[i].className.match("commentBubble")) {
			var dest = links[i].rel
      links[i].onclick=function() {
        comment(dest);
        return false;
      }
    }
  }
}
window.onload=doComments;


// Detect if the browser is IE or not.
// If it is not IE, we assume that the browser is NS.
var IE = document.all?true:false;

// If NS -- that is, !IE -- then set up for mouse capture
if (!IE) document.captureEvents(Event.MOUSEMOVE);

// Set-up to use getMouseXY function onMouseMove
document.onmousemove = getMouseXY;

// Temporary variables to hold mouse x-y pos.s
var tempX = 0;
var tempY = 0;

// Main function to retrieve mouse x-y pos.s

function getMouseXY(e) {
  if (IE) { // grab the x-y pos.s if browser is IE
    tempX = event.clientX + document.body.scrollLeft;
    tempY = event.clientY + document.documentElement.scrollTop;
  } else {  // grab the x-y pos.s if browser is NS
    tempX = e.pageX;
    tempY = e.pageY;
  }  
  // catch possible negative values in NS4
  if (tempX < 0){tempX = 0;}
  if (tempY < 0){tempY = 0;}  

  return true
}



function comment(destEmail)
{
	// stuff that will need to change with new site
	var balloon_path = "http://www.wcroads.org/images/";
	
	// create html elements
	var body = document.getElementsByTagName("body")[0];
	var div = document.createElement("div");
	
	var heading = document.createElement("h1");
	var br1 = document.createElement("br");
	var br2 = document.createElement("br");
	
	var nameLabel = document.createElement("label");
	var nameInput = document.createElement("input");
	var nameBR = document.createElement("br");
	
	var emailLabel = document.createElement("label");
	var emailInput = document.createElement("input");
	var emailBR = document.createElement("br");
	
	var subjectLabel = document.createElement("label");
	var subjectInput = document.createElement("input");
	var subjectBR = document.createElement("br");
	
	var commentsLabel = document.createElement("commentsLabel");
	var comments = document.createElement("textarea");
	
	var submitComment = document.createElement("input");
	var cancelComment = document.createElement("input");
	
	
	
	// add styles to containing div tag
	// and add the tag to the document
	div.style.position = "absolute";
	
	var ypos = tempY - 325;
	if(ypos < 0){ypos = 10;}
	div.style.top = ypos + "px";
	
	var xpos = tempX - 10;
	div.style.left = xpos + "px";
	
	div.style.width = "244px";
	div.style.height = "325px";
	div.style.margin = "0";
	div.style.border = "none";
	div.style.padding = "20px";
	div.style.opacity = "1";
	if(IE){
		div.style.background = "url(" + balloon_path + "balloon.gif)";
	}else{
		div.style.background = "url(" + balloon_path + "balloon.png)";
	}
	div.style.backgroundPosition = "top left"
	div.style.backgroundRepeat = "no-repeat";
	div.style.fontSize = "small";
	div.style.lineHeight = "1em";
	div.style.textAlign = "left";
	
	
	
	body.appendChild(div);
	
	// add styles to the heading element
	// and add the element to the containing div
	heading.style.fontSize = "20px";
	heading.style.margin = "0";
	heading.style.padding = "0 0 5px 0";
	heading = div.appendChild(heading);
	heading.innerHTML = "Comment Form";
	
	
	// add styles to the subject label
	// add the element to the containing div
	nameLabel.style.display = "block";
	nameLabel.style.margin = "0";
	nameLabel.style.padding = "0";
	nameLabel = div.appendChild(nameLabel);
	nameLabel.innerHTML = "Name:";
	
	// add styles to the subject input
	// add the element to the containing div
	nameInput.name = "name";
	nameInput.type = "text";
	nameInput.style.display = "block";
	nameInput.style.margin = "0";
	nameInput.style.padding = "0";
	nameInput.style.fontSize = "small";
	nameInput.style.fontFamily = "Arial, Helvetica, sans-serif";
	
	nameInput = div.appendChild(nameInput);
	div.appendChild(nameBR);
	
	// set the focus
	nameInput.focus();
	
	
	// add styles to the subject label
	// add the element to the containing div
	emailLabel.style.display = "block";
	emailLabel.style.margin = "0";
	emailLabel.style.padding = "0";
	emailLabel = div.appendChild(emailLabel);
	emailLabel.innerHTML = "Your Email:";
	
	// add styles to the subject input
	// add the element to the containing div
	emailInput.name = "email";
	emailInput.type = "text";
	emailInput.style.display = "block";
	emailInput.style.margin = "0";
	emailInput.style.padding = "0";
	emailInput.style.fontSize = "small";
	emailInput.style.fontFamily = "Arial, Helvetica, sans-serif";
	
	emailInput = div.appendChild(emailInput);
	div.appendChild(emailBR);
	
	// add styles to the subject label
	// add the element to the containing div
	subjectLabel.style.display = "block";
	subjectLabel.style.margin = "0";
	subjectLabel.style.padding = "0";
	subjectLabel = div.appendChild(subjectLabel);
	subjectLabel.innerHTML = "Subject:";
	
	// add styles to the subject input
	// add the element to the containing div
	subjectInput.name = "subject";
	subjectInput.type = "text";
	subjectInput.style.display = "block";
	subjectInput.style.margin = "0";
	subjectInput.style.padding = "0";
	subjectInput.style.fontSize = "small";
	subjectInput.style.fontFamily = "Arial, Helvetica, sans-serif";
	
	subjectInput = div.appendChild(subjectInput);
	div.appendChild(subjectBR);
	
	
	// add styles to the comment label
	// add the element to the containing div
	commentsLabel.style.display = "block";
	commentsLabel.style.margin = "0";
	commentsLabel.style.padding = "0";
	commentsLabel = div.appendChild(commentsLabel);
	commentsLabel.innerHTML = "Comments:";
	
	// add styles to the Comments text area
	// add the element to the containing div
	comments.style.display = "block";
	comments.style.margin = "0";
	comments.style.padding = "0";
	comments = div.appendChild(comments);
	div.appendChild(br2);
	
	// add styles to the submit button
	// add the element to the containing div
	submitComment.type = "submit";
	submitComment.value = "Submit";
	submitComment = div.appendChild(submitComment);
	
	submitComment.onclick = function(e)
	{
		//get data from form
		email = emailInput.value;
		name = nameInput.value;
		subject = subjectInput.value;
		bodytext = comments.value;
		
		//div.parentNode.removeChild(div);
		div.removeChild(nameLabel);
		div.removeChild(emailLabel);
		div.removeChild(subjectLabel);
		div.removeChild(commentsLabel);
		div.removeChild(nameInput);
		div.removeChild(emailInput);
		div.removeChild(subjectInput);
		div.removeChild(comments);
		div.removeChild(nameBR);
		div.removeChild(emailBR);
		div.removeChild(subjectBR);
		div.removeChild(submitComment);
		div.removeChild(cancelComment);
		
		// create display conformation tags
		var conf = document.createElement("p");
		conf.id = "comment-conf";
		conf = div.appendChild(conf);
		
		// make ajax request
		new Ajax.Request('http://www.wcroads.org/comment.asp', {
			method: 'get',
			onSuccess: function(transport) {
										var notice = $('comment-conf');
										notice.innerHTML = transport.responseText;
								},
			onFailure: function(transport) {
										var notice = $('comment-conf');
										notice.innerHTML = "Sorry, your comment could not be sent.  Please try again later.";
								},
			parameters: {name: name, email: email, subject: subject, comment: bodytext, destEmail: destEmail}
		});
		
		// create other parts
		var closeLink = document.createElement("a");
		closeLink.href = "#";
		closeLink.style.color = "#00c";
		closeLink = div.appendChild(closeLink);
		closeLink.innerHTML = " Close this window";
		closeLink.onclick = function(e){
			div.parentNode.removeChild(div);
		}
	}
	
	
	// add styles to the cancel button
	// add the element to the containing div
	cancelComment.type = "button";
	cancelComment.value = "Cancel";
	cancelComment = div.appendChild(cancelComment);
	
	cancelComment.onclick = function(e)
	{
		div.parentNode.removeChild(div);
	}
	
	
};




function opacityDown(theElement)
{
	var opacity = parseFloat(theElement.style.opacity);

	if (opacity < 0.08)
	{
		theElement.parentNode.removeChild(theElement);
	}
	else
	{
		opacity -= 0.07;
		theElement.style.opacity = opacity;
		setTimeout(function(){opacityDown(theElement);}, 50);
	}
	
	return true;
};




function verticalAlign(theElement, pixelSize)
{
	theElement.parentNode.style.top = document.documentElement.scrollTop + window.innerHeight/2 + "px";
	theElement.style.fontSize = pixelSize + "px";
	theElement.style.lineHeight = pixelSize + "px";
	
	var height = theElement.clientHeight;

	theElement.style.marginTop = -parseInt(height / 2) + "px";

	return true;
};