var body_onAvailable	= function()
{
	var objAttributes	=
	{
		mode : "expand"
	};
	YAHOO.util.Event.addListener( 'addTrigger', 'click', fnFormDisplay, objAttributes, false );
	YAHOO.util.Event.addListener( 'commentForm_submit', 'click', fnCommentForm_onSubmit );

};

var fnFormDisplay = function( objEvent, objAttributes )
{
	// Remove the old listener
	YAHOO.util.Event.removeListener( 'addTrigger', 'click', fnFormDisplay );

	switch( objAttributes[ 'mode' ] )
	{
		case "expand":
		{
			strNewMode	= "collapse";

			// Expand the frame
			var objAccordian	= new YAHOO.util.Anim( 'addCommentFrame', { height : { to: YAHOO.util.Dom.get( 'addCommentFields' ).clientHeight }}, 1.4, YAHOO.util.Easing.elasticOut );

			// Perform the action
			objAccordian.animate();

			break;
		}
		case "collapse":
		{
			strNewMode	= "expand";

			// Collapse the frame 
			var objAccordian	= new YAHOO.util.Anim( 'addCommentFrame', { height : { to : 0 }}, 0.8, YAHOO.util.Easing.backBoth );

			// Perform the actions
			objAccordian.animate();

			break;
		}
	}

	// Add the new listener
	YAHOO.util.Event.addListener( 'addTrigger', 'click', fnFormDisplay, { mode : strNewMode	}, false );

};

var fnCommentForm_onSubmit = function( objEvent )
{
	objCommentForm	= YAHOO.util.Dom.get( "commentForm" );
	strSiteRoot		= YAHOO.util.Dom.get( "siteRoot" ).value;
	strAjaxTarget	= strSiteRoot + "/api/addComment/";

	YAHOO.util.Connect.setForm( objCommentForm );
	YAHOO.util.Connect.asyncRequest( "POST", strAjaxTarget, fnCommentForm_xhrReturn );

	YAHOO.util.Dom.removeClass( "commentIndicator", "hideIt" );

};

var fnCommentForm_xhrReturn = 
{
	success: function ( objResponse )
	{
		// We got a successful response from the server
		YAHOO.util.Dom.addClass( "commentIndicator", "hideIt" );
	
		var root		= objResponse.responseXML.documentElement; 
		var bSuccess	= root.firstChild.getElementsByTagName( 'success' )[0].firstChild.data;
		
		if( bSuccess == "true" )
		{
			//alert( objResponse.responseText );
			// Cool, the comment was posted
			var strTitle	= root.firstChild.getElementsByTagName( 'username' )[0].firstChild.data;
			var strDateTime	= root.firstChild.getElementsByTagName( 'datetime' )[0].firstChild.data;
			var strComment	= root.firstChild.getElementsByTagName( 'comment' )[0].firstChild.data;

			// Add the comment to the list but dont show it yet
			fnAddCommentElement( strTitle, strDateTime, strComment )

			// Collapse the comment form
			var objAccordian	= new YAHOO.util.Anim( 'addCommentFrame', { height : { to : 0 } }, 0.8, YAHOO.util.Easing.backBoth );

			// Show the comment after the animation is done
			objAccordian.onComplete.subscribe( fnShowNewComment );

			// Perform the actions
			objAccordian.animate();

			// Remove the old listener
			YAHOO.util.Event.removeListener( 'addTrigger', 'click', fnFormDisplay );

			// Add the new listener
			YAHOO.util.Event.addListener( 'addTrigger', 'click', fnFormDisplay, { mode : "expand"	}, false );

		}
		else
		{

			// The comment wasnt posted, so we have to add the error to the page
			var	strError	= root.firstChild.getElementsByTagName( 'message' )[0].firstChild.data;

			// Get the 
			objErrorP		= YAHOO.util.Dom.get( "commentError" );

			if( strError.length > 0 && objErrorP )
			{
				objErrorP.innerHTML	= strError;

				// Color fade the new comment
				var attributes = {
					backgroundColor: { from:  '#FFFF9C', to: '#FFFFFF' }
				};

				var anim = new YAHOO.util.ColorAnim( 'commentError', attributes, 2, YAHOO.util.Easing.easeOut );

				// Remove the hidden class if it exists
				if( YAHOO.util.Dom.hasClass( "commentError", "hidden" ))
				{
					// Remove the hidden class
					YAHOO.util.Dom.removeClass( "commentError", "hidden" );


					// Expand the frame to fit the new comment box size
					var objAccordian	= new YAHOO.util.Anim( 'addCommentFrame', { height : { to: YAHOO.util.Dom.get( 'addCommentFields' ).clientHeight }}, 1.4, YAHOO.util.Easing.elasticOut );
					
					// Perform the accordian
					objAccordian.animate();
				}

				anim.animate();
			}
		}
    },
	failure: function ( objResponse )
	{
        alert( "Your comment failed to submit.  Please contact the site administrator." );
    }
};

var fnAddCommentElement = function( strTitle, strDateTime, strComment )
{

	objCommentList	= YAHOO.util.Dom.get( "commentList" );

	// Create the list item container
	objLI	= document.createElement( 'li' );

	objLI.id	= "newComment";

	// Is there a title?  If so, create it in the DOM here
	if( strTitle.length > 0 )
	{

		// Create the element
		var objH4		= document.createElement( 'h4' );

		// Append the text to the element
		objH4.innerHTML	= strTitle;

		// Now attach the element to the container
		objLI.appendChild( objH4 );
	}
	
	// Is there a datetime?  If so, create it in the DOM here
	if( strDateTime.length > 0 )
	{
		// Create the element
		var objH5		= document.createElement( 'h5' );

		// Append the text to the element
		objH5.innerHTML	= strDateTime;

		// Now attach the element to the container
		objLI.appendChild( objH5 );
	}

	// Is there comment text?  If so, create it in the DOM here
	if( strComment.length > 0 )
	{
		// Create the element
		var objP		= document.createElement( 'p' );

		// Append the text to the element
		objP.innerHTML	= strComment;

		// Now attach the element to the container
		objLI.appendChild( objP );
	}
	
	// And now we append the LI to the comment list
	objCommentList.appendChild( objLI );

	// Add the hidden class to the comment
	YAHOO.util.Dom.addClass( "newComment", "hidden" );

	// Add the rowEven class to the comment
	YAHOO.util.Dom.addClass( "newComment", "rowEven" );
};

var fnShowNewComment = function()
{
	objCommentList	= YAHOO.util.Dom.get( "commentList" );

	// Create the list item container
	objLI			= YAHOO.util.Dom.get( "newComment" );
	
	// Remove the hidden class
	YAHOO.util.Dom.removeClass( "newComment", "hidden" );

	// Scroll to the new comment
	window.scrollTo( 0, YAHOO.util.Dom.getY( "newComment" ));

	// Grab the current BG color
	strBGColor	 = YAHOO.util.Dom.getStyle( "newComment", "backgroundColor" )
	
	// Color fade the new comment
	var attributes = {
		backgroundColor: { from:  '#FFFF9C', to: strBGColor }
	};
	
	var anim = new YAHOO.util.ColorAnim( 'newComment', attributes, 2, YAHOO.util.Easing.easeOut );

	anim.animate();


	fnSwapFormSuccess();
};

var fnSwapFormSuccess = function()
{
	//==================================
	// SWAP THE FORM OUT WITH THE MESSAGE 
	//==================================

	// Add the hidden class to the error if it isnt there now
	if( !YAHOO.util.Dom.hasClass( "commentError", "hidden" ))
	{
		YAHOO.util.Dom.addClass( "commentError", "hidden" );
	}

	// Hide the form
	YAHOO.util.Dom.addClass( "formFields", "hidden" );

	// Add the disabled style to the form frame
	YAHOO.util.Dom.addClass( "addCommentFrame", "disabled" );

	// Create the disabled message layer
	var objDisabledContainer	= document.createElement( "div" );
	objDisabledContainer.id		= "disabled";

	// Create the disabled message title
	var objDisabledTitle		= document.createElement( "h4" );
	objDisabledTitle.innerHTML	= "Thanks!";

	// Create the disabled message
	var objDisabledMessage		= document.createElement( "p" );
	objDisabledMessage.innerHTML= "Your comment was processed successfully.";

	// Append the innards
	objDisabledContainer.appendChild( objDisabledTitle );
	objDisabledContainer.appendChild( objDisabledMessage );

	// Snag the element we need to append the message to
	objFieldset	= YAHOO.util.Dom.get( "addCommentFields" );
	
	// Now append the entire message to the page
	objFieldset.appendChild( objDisabledContainer );

};

YAHOO.util.Event.onAvailable( 'songs', body_onAvailable );