//Initial version created by Will Jones at The University of Alabama Libraries
// Modified by R. Todd Vandenbark at Ball State University Libraries

var CommentBox = Class.create();
CommentBox.prototype = {
	initialize: function(){
		this.commentBoxClass = "commentBox";
		this.projectId;
		this.projectName;
		this.anchorName;
		this.learnMoreLink;
		this.version;		
	},
	
	createCommentBox: function(){
		if (this.learnMoreLink != undefined){
			document.write('<a href="'+this.learnMoreLink+'">learn more</a> &bull; ');
		}
		document.write('<a href="javascript: showCommentBox(\''+this.projectId+'\');">add comment</a>');
		document.write('<div id="'+this.projectId+'" class="'+this.commentBoxClass+'"></div>');
		$(this.projectId).style.display = 'none';
		$(this.projectId).style.height = '100px';
		var containerDiv = $(this.projectId);
		this.genCommentBox(containerDiv);
	},
	
	genCommentBox: function(containerDiv){
		var brTag = '<br />';
		//---> Create the comment box
		var commentBoxId = 'commentBox_'+this.projectId;
		var commentBox = '<div id="'+commentBoxId+'">';

		var commentsId = 'comments_'+this.projectId;
		var commentsTextBox = '<textarea id="'+commentsId+'" name="comments" rows="3" cols="63" title="Add comment for '+this.projectName+'"></textarea>';
		
		var submitButton = '<input type="image" name="Submit" src="images/submitred.png" alt="Submit" onClick="submitComment(\''+this.projectId+'\',\'comments_'+this.projectId+'\',\''+this.projectName+'\',\''+this.anchorName+'\')" />';
		
		//--->Generate the cancel button
		var cancelButton = '<a class="image" href="javascript: hideCommentBox(\''+this.projectId+'\')"><img src="images/cancelred.png" alt="Cancel" /></a>';
		
		//---> Create the status box
		var statusBoxId = 'statusBox_'+this.projectId;
		var statusBoxDiv = '<div id="'+statusBoxId+'"></div>';
		containerDiv.innerHTML = commentBox+brTag+commentsTextBox+brTag+submitButton+cancelButton+'</div>'+statusBoxDiv;
		
	}
};

//Functions to handle the display and submittal of the comment form
	//---> Function utilized upon comment submittal
	 function submitComment(element, commnetId, projectVal, anchorVal){	
		//---> get the element with the Id "commentBox" (which contains the comment box)
		var commentBox = $('commentBox_'+element);
		//---> get the element with the Id "statusBox" (which contains the return text, dispplayed after comment submittal)
		var statusBox = $('statusBox_'+element);

	
		//---> Assign variable with value of the comments text field
		var commentVal = $(commnetId).value;

		//---> Fade out the commentBox and fade in the statusBox
		new Effect.Fade('commentBox_'+element, {duration: 0.2, queue: 'front'});
		new Effect.Appear('statusBox_'+element, {duration: 0.2, queue: 'end'});
	
		//---> Perform ajax update -> controled by Prototypejs
		new Ajax.Updater(statusBox, 'includes/comment.php', {
			parameters: {
						project: projectVal,
						anchor: anchorVal,
						comments: commentVal
						}
			});

		if (commentVal == ''){
			new Effect.Fade('statusBox_'+element, {duration: 0.2, delay: 1.0});
			new Effect.Appear('commentBox_'+element, {duration: 0.5, delay: 1.5, afterFinish: function(){ $('comments_'+element).focus();} });
			
		}
		else{
			//---> Blindup the element conaining the statusBox and commentBox divs after a delay of .8 seconds
			new Effect.BlindUp(element, {queue: 'end', delay: 0.8});
		}
	}
	
	function hideCommentBox(element){
		new Effect.BlindUp(element);
	}
	
	//---> Function utilized to display the comment box (i.e., what the "add comment" link is anchored to), with the
	// "element" parameter being the id of the containing div tag that blinds up and down
	function showCommentBox(element){
	new Effect.toggle(element, 'blind', {
			beforeStart: function(){
				new Effect.Appear('commentBox_'+element, {duration: 0.0, queue: 'front'});
				new Effect.Fade('statusBox_'+element, {duration: 0.0, queue: 'end'});
				$('comments_'+element).clear();
			},
			afterFinish: function(){
				if ($('commentBox_'+element).visible()){
					$('comments_'+element).focus();
				}
			}
	});
	}
