/*
 *	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 = "/comments/default.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");

    elmRating1      = document.getElementById("star1");
    elmRating2      = document.getElementById("star2");
    elmRating3      = document.getElementById("star3");
    elmRating4      = document.getElementById("star4");
    elmRating5      = document.getElementById("star5");

    if (elmRating1.checked) {commentRating = elmRating1;}
    if (elmRating2.checked) {commentRating = elmRating2;}
    if (elmRating3.checked) {commentRating = elmRating3;}
    if (elmRating4.checked) {commentRating = elmRating4;}
    if (elmRating5.checked) {commentRating = elmRating5;}


    commenterName.disabled    = false;
    commenterEmail.disabled   = false;
    commenterURL.disabled     = false;
    comments.disabled         = false;
    imageVerify.disabled      = false;
    
    var elmCommentsLeft = document.getElementById("comments_left");
    var elmCommentsForm = document.getElementById("comment_form");
    
    if (elmCommentsLeft) { var elmCommentListHeading = elmCommentsLeft.getElementsByTagName("h3")[0]; }
    if (elmCommentsForm) { var elmCommentFormHeading = elmCommentsForm.getElementsByTagName("h3")[0]; }
    
    if (elmCommentListHeading) {elmCommentListHeading.style.cursor = "pointer";}
    if (elmCommentFormHeading) {elmCommentFormHeading.style.cursor = "pointer";}
    
    var elmCommentList = document.getElementById("comment_list");
    if (!elmCommentList) {
      if (elmCommentsLeft) {var elmCommentList = elmCommentsLeft.getElementsByTagName("div")[0];}
    }
  
    var elmCommentFormIntro = elmCommentsForm.getElementsByTagName("p")[0];
    var elmCommentForm = elmCommentsForm.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") {
	 
    if (elmElementReference.parentNode.id == "comment_form") {
      $("#comment_captcha_text_img").attr("src", "/comments/layout/image.asp");
    }
	
		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
$(document).ready(setUpCommentForm);