/*
 *	comments.js - Comment related client side code
 *
 *	Written by Jon Burney - Bluestone Creative Ltd
 *	Copyright (c) 2007 Bluestone Creative Ltd
 *
 */

var commentXMLReq = new XMLRequester();
var commenterName , commenterEmail, commenterURL, rememberCommenter, comments, commentRating;
var imageVerify, elmSubmitButton, elmItemType, elmItemID;
var elmFormContainer;

/*
 * Function:		setUpCommentForm()
 * Scope:		Public
 * Arguments:	N/A
 * Returns:		N/A
 * Description:	Sets up the comment form to use AJAX for the submission (this is loaded using the addLoadEvent() function) 
 */
function setUpCommentForm() {

	commentXMLReq.connectorPath = "/_includes/code/comment_proc.asp";
	commentXMLReq.registerHandler("submitComment", processCommentResult); 
	commentXMLReq.HTTPReqType = "post";
	
	commentXMLReq.additionalHeaders[1] = new Array();
	commentXMLReq.additionalHeaders[1][0] = "Content-Type";
	commentXMLReq.additionalHeaders[1][1] = "application/x-www-form-urlencoded";
	
	elmSubmitButton = document.getElementById("comment_submit_button");
	if (elmSubmitButton) {
		elmSubmitButton.onclick = processComment;

		// if the current browser isn't IE then we can change the submit button to be a standard button
		if (navigator.appVersion.indexOf("MSIE") == -1) {
			elmSubmitButton.type = "button";
		}

		commenterName = document.getElementById("commenter_name");
		commenterEmail = document.getElementById("commenter_email");
		commenterURL = document.getElementById("commenter_url");
		comments = document.getElementById("comments");
		imageVerify = document.getElementById("image_verification");
		elmItemType = document.getElementById("comment_item_type");
		elmItemID = document.getElementById("comment_item_id");
		commentRating = document.getElementById("comment_rating_new");
		
		commenterName.disabled = false;
		commenterEmail.disabled = false;
		commenterURL.disabled = false;
		comments.disabled = false;
		imageVerify.disabled = false;
		
		var elmCommentListHeading = document.getElementById("comments_left").getElementsByTagName("h3")[0];
		var elmCommentFormHeading = document.getElementById("comment_form").getElementsByTagName("h3")[0];
		
		elmCommentListHeading.style.cursor = "pointer";
		elmCommentFormHeading.style.cursor = "pointer";
		
		var elmCommentList = document.getElementById("comment_list");
		if (!elmCommentList) {
			//var elmCommentList = document.getElementById("comments_left").getElementsByTagName("p")[0];
			var elmCommentList = document.getElementById("comments_left").getElementsByTagName("div")[0];
		}
		//elmCommentListHeading.onclick = function() {showHideElement(elmCommentList)};
		
		var elmCommentFormIntro = document.getElementById("comment_form").getElementsByTagName("p")[0];
		var elmCommentForm = document.getElementById("comment_form").getElementsByTagName("form")[0];
		elmCommentFormHeading.onclick = function() {showHideElement(elmCommentForm); showHideElement(elmCommentFormIntro);};
		
		if (window.location.href.indexOf("#commentForm") <= 0) {
		  showHideElement(elmCommentForm);
		  showHideElement(elmCommentFormIntro);
		}
		
	}
}


/*
 * Function:		showHideElement()
 * Scope:		Public
 * Arguments:	elmElementReference - The reference to the element that should be shown/hidden
 * Returns:		N/A
 * Description:	Shows or hides a specific element in the DOM
 */
function showHideElement(elmElementReference) {
	if (elmElementReference.style.display == "none") {
		elmElementReference.style.display = "block";
	} else {
		elmElementReference.style.display = "none";
	}
}


/*
 * Function:		processComment()
 * Scope:		Public
 * Arguments:	N/A
 * Returns:		N/A
 * Description:	Processes the data entered by the user, and constructes the HTTP POST data ready to be sent via
 * 					the XML requester object
 */
function processComment() {	
	
	var strComment = comments.value.replace(/\s/g, "+");
	var strCommenterName = commenterName.value.replace(/\s/g, "+");
	
	commentXMLReq.POSTReqs = commenterName.name + "=" + strCommenterName;
	commentXMLReq.POSTReqs += "&" + commenterEmail.name + "=" + commenterEmail.value;
	commentXMLReq.POSTReqs += "&" + commenterURL.name + "=" + commenterURL.value;
	commentXMLReq.POSTReqs += "&" + comments.name + "=" + strComment;
	commentXMLReq.POSTReqs += "&" + imageVerify.name + "=" + imageVerify.value;
	commentXMLReq.POSTReqs += "&" + elmItemType.name + "=" + elmItemType.value;
	commentXMLReq.POSTReqs += "&" + elmItemID.name + "=" + elmItemID.value;
	commentXMLReq.POSTReqs += "&" + commentRating.name + "=" + commentRating.value;

	commentXMLReq.sendRequest("submitComment","");
	disableForm();
}


/*
 * Function:		disableForm()
 * Scope:		Public
 * Arguments:	N/A
 * Returns:		N/A
 * Description:	Disables all of the form elements during the submission process
 */
function disableForm() {
	
	commenterName.disabled = true;
	commenterEmail.disabled = true;
	commenterURL.disabled = true;
	comments.disabled = true;
	imageVerify.disabled = true;

	elmSubmitButton.value = "posting comment...";
	elmSubmitButton.disabled = true;
}


/*
 * Function:		enableForm()
 * Scope:		Public
 * Arguments:	N/A
 * Returns:		N/A
 * Description:	Re-enables the form elements
 */
function enableForm() {
	
	commenterName.disabled = false;
	commenterEmail.disabled = false;
	commenterURL.disabled = false;
	comments.disabled = false;
	imageVerify.disabled = false;
	
	elmSubmitButton.value = "Submit";
	elmSubmitButton.disabled = false;
}


/*
 * Function:		replaceForm()
 * Scope:		Public
 * Arguments:	N/A
 * Returns:		N/A
 * Description:	Removes the form from the DOM and replaces it with a textual message after sucessful submission
 */
function replaceForm(strMessage) {
	elmFormContainer = document.getElementById("comment_form");
	
	var elmCommentForm = elmFormContainer.getElementsByTagName("form");
	var elmCommentFormIntro = elmFormContainer.getElementsByTagName("p");
	
	elmFormContainer.removeChild(elmCommentFormIntro[0]);
	elmFormContainer.removeChild(elmCommentForm[0]);
	
	var elmMessage = document.createElement("p");
	elmMessage.appendChild(document.createTextNode(strMessage));
	elmFormContainer.appendChild(elmMessage);
}


/*
 * Function:		processCommentResult()
 * Scope:		Public
 * Arguments:	N/A
 * Returns:		N/A
 * Description:	Processes the result of the AJAX submission, and either displays an error message, or replaces the form with a 
 *					success message
 */
function processCommentResult(xmlResponse) {
	var xml = xmlResponse.DOMDocument;
	var errors = xml.getElementsByTagName("error");
	var success = xml.getElementsByTagName("success");
	
	if (errors.length > 0) {
		alert(errors[0].firstChild.nodeValue); 
		enableForm();
	} else if (success.length > 0) {
		replaceForm(success[0].firstChild.nodeValue);
	}
	
}


// add the setUpCommentForm() to the list of functions to be executed at page load
addLoadEvent(setUpCommentForm);