var IDBeingEdited = -1;
// Set the TitleText when the user first enters the edit state of a span
var TitleText = "no title";
// Set the TextBody when the user first enters the edit state of a span
var TextBody = "no body";
//Only set the PostType on the way into an edit state.
var PostType = "new"; 

function EnableEditState (ID)
{
	var cancelChanges = false;
	
	// We're building a state engine and adjusting the strings for the edit/save and delete/cancel links as 
	// well as enabling and disabling the edit state of a particular span.
	// If the IDBeingEdited is not -1 and editState == 1, and the user has chosen to Toggle the edit state
	// of an ID that is different than IDBeingEdited, prompt the user to either save their changes or cancel 
	// them. 
	if (IDBeingEdited != -1 && IDBeingEdited != ID)
	{
		if (PromptConfirmation("You are currently editing another post.  Do you want to cancel your changes?"))
		{
			CancelEditState(IDBeingEdited);
		}
		else
		{
			return;
		}
	}
	
	// Save off the current TitleText of the passed in ID belonging to the NewsArticleHeader<ID>
	TitleText = document.all["NewsArticleHeader" + ID].innerHTML;
	// Save off the current TextBody of the passid in ID belonging to the NewsArticleBody<ID>
	TextBody = document.all["NewsArticleBody" + ID].innerHTML;
	// Save off the current IDBeingEdited
	IDBeingEdited = ID;
	PostType = "edit";
	
	// Enable the edit state of the passed in ID belonging to the newsArticleHeader<ID>
	document.all["NewsArticleHeader" + ID].contentEditable="true";
	// Enable the edit state of the passed in ID belonging to the newsArticleBody<ID>
	document.all["NewsArticleBody" + ID].contentEditable="true";
	
	// Change the text for the EditSave<ID> span to Save
//	document.all["EditSave" + ID].innerHTML="Save";
	// Change the text for the DeleteCancel<ID> span to Cancel
//	document.all["DeleteCancel" + ID].innerHTML="Cancel";
	
	// Set the OnClick function pointer for EditSave<ID> to SaveEditState()
	document.all["EnableEditState" + ID].style.display ="none";
	document.all["SaveEditState" + ID].style.display="inline";
	document.all["DeletePost" + ID].style.display="none";
	document.all["CancelEditState" + ID].style.display="inline";
	
	// Set the EditActive style on the two spans
	document.all["NewsArticleBlock" + ID].className="EditActive";
	document.all["NewsArticleBlock" + ID].onselectstart=function (){return true};
	
	DrawNewsArticleButtons(ID);
	
	// Set the OnClick function pointer for DeleteCancel<ID> to CancelEditState()
	
	return false;
}

function ClearNewsArticleButtons(ID)
{
	document.all["NewsArticleButtons" + ID].innerHTML = "";
}

function DrawNewsArticleButtons(ID)
{
	document.all["NewsArticleButtons" + ID].innerHTML = "<button class=\"ToolButtonFixed\" onclick=\"document.execCommand('Bold')\" title=\"Bold (Control + B)\"><b>B</b></button>\
<button class=\"ToolButtonFixed\" onclick=\"document.execCommand('Italic')\" title=\"Italic (Control + I)\"><i>I</i></button>\
<button class=\"ToolButtonFixed\" onclick=\"document.execCommand('Underline')\" title=\"Underline (Control + U)\"><u>U</u></button>\
<button class=\"ToolButtonFixed\" onclick=\"document.execCommand('StrikeThrough')\" title=\"Strike Through\"><strike>S</strike></button>\
<button class=\"ToolButtonFixed\" onclick=\"document.execCommand('SuperScript')\" title=\"Superscript\"><sup>A</sup></button>\
<button class=\"ToolButtonFixed\" onclick=\"document.execCommand('SubScript')\" title=\"Subscript\"><sub>A</sub></button>\
<button class=\"ToolButtonFixed\" onclick=\"document.execCommand('Outdent')\" title=\"Outdent\">&lt;</button>\
<button class=\"ToolButtonFixed\" onclick=\"document.execCommand('Indent')\" title=\"Indent\">&gt;</button>\
<button class=\"ToolButton\" onclick=\"document.execCommand('CreateLink')\" title=\"Link to URL (Control + K)\">Link</button>\
<button class=\"ToolButtonFixed\" onclick=\"document.execCommand('JustifyLeft')\" title=\"Justify Left\">L</button>\
<button class=\"ToolButtonFixed\" onclick=\"document.execCommand('JustifyCenter')\" title=\"Justify Center\">E</button>\
<button class=\"ToolButtonFixed\" onclick=\"document.execCommand('JustifyRight')\" title=\"Justify Right\">R</button>\
<button class=\"ToolButtonFixed\" onclick=\"document.execCommand('InsertUnorderedList')\" title=\"Bullet List\">*</button>\
<button class=\"ToolButtonFixed\" onclick=\"document.execCommand('InsertOrderedList')\" title=\"Ordered List\">1</button>\
<button class=\"ToolButtonFixed\" onclick=\"document.execCommand('InsertHorizontalRule')\" title=\"Horizontal Line\">-</button>\
\
<button class=\"ToolButton\" title=\"Quick Help\
\
Control + B	Bold\
Control + I	Italics\
Control + U	Underline\
Control + K	Make a link to a URL\
\">Help</button>\
";
}

function CancelEditState (ID)
{
	// If the ID is different than the IDBeingEdited, error out and reset the text
	if (IDBeingEdited != ID)
	{
		alert("The post being cancelled is not the post that was edited.  Aborting cancel.");
		return;
	}

	
	// Set the TitleText to the value of the passed in ID belonging to the newsArticleHeader<ID>
	document.all["NewsArticleHeader" + ID].innerHTML = TitleText;
	// Set the TextBody to the value of the passed in ID belonging to the newsArticelBody<ID>
	document.all["NewsArticleBody" + ID].innerHTML = TextBody;
	
	// Disable the edit state of the passed in ID belonging to the newsArticleHeader<ID>
	document.all["NewsArticleHeader" + ID].contentEditable="false";
	// Disable the edit state of the passed in ID belonging to the newsArticleBody<ID>
	document.all["NewsArticleBody" + ID].contentEditable="false";
	
	// Change the text for the EditSave<ID> span to Edit
//	document.all["EditSave" + ID].innerHTML="Edit";
	// Change the text for the DeleteCancel<ID> span to Delete
//	document.all["DeleteCancel" + ID].innerHTML="Delete";
	
	// Set the OnClick function pointer for EditSave<ID> to EnableEditState()
	document.all["EnableEditState" + ID].style.display ="inline";
	document.all["SaveEditState" + ID].style.display="none";
	document.all["DeletePost" + ID].style.display="inline";
	document.all["CancelEditState" + ID].style.display="none";
	// Set the OnClick function pointer for DeleteCancel<ID> to DeleteEditState()
	
	// Clear the TitleText variable
	TitleText = "";
	// Clear the TextBody variable
	TextBody = "";
	IDBeingEdited = -1;
	
	// Clear the border around the span being edited??
	document.all["NewsArticleBlock" + ID].className="";
	document.all["NewsArticleBlock" + ID].onselectstart=function (){return false};
	ClearNewsArticleButtons(ID);
	
	return false;
}

function SaveEditState (ID)
{
	// If the ID is different than the IDBeingEdited, error out and reset the text
	if (IDBeingEdited != ID)
	{
		alert("The post being saved is not the post that was edited.  Cancelling save.");
		return;
	}

	// Change the text for the EditSave<ID> span to Edit
//	document.all["EditSave" + ID].innerHTML="Edit";
	// Change the text for the DeleteCancel<ID> span to Delete
//	document.all["DeleteCancel" + ID].innerHTML="Delete";
	
	// Disable the edit state of the passed in ID belonging to the newsArticleHeader<ID>
	document.all["NewsArticleHeader" + ID].contentEditable="false";
	// Disable the edit state of the passed in ID belonging to the newsArticleBody<ID>
	document.all["NewsArticleBody" + ID].contentEditable="false";
	
	// Set the OnClick function pointer for EditSave<ID> to EnableEditState()
	document.all["EnableEditState" + ID].style.display ="inline";
	document.all["SaveEditState" + ID].style.display="none";
	document.all["DeletePost" + ID].style.display="inline";
	document.all["CancelEditState" + ID].style.display="none";
	// Set the OnClick function pointer for DeleteCancel<ID> to DeleteEditState()
	
	// Clear the TitleText variable
	TitleText = "";
	// Clear the TextBody variable
	TextBody = "";
	IDBeingEdited = -1;
	
	// Save the changes to the EditForm hidden controls
	EditForm.TitleText.value = document.all["NewsArticleHeader" + ID].innerHTML;
	EditForm.TextBody.value = document.all["NewsArticleBody" + ID].innerHTML;
	EditForm.PostID.value = ID;
	EditForm.PostType.value = PostType;
	
	// Do a form post to send the changes back to the server
	EditForm.submit();
	
	// Clear the border around the span being edited??
	document.all["NewsArticleBlock" + ID].className="";
	document.all["NewsArticleBlock" + ID].onselectstart=function (){return false};
	ClearNewsArticleButtons(ID);
	
	return;
}

function NewPost()
{
	// Set the PostType to new
	EditForm.PostType.value = "new";
	EditForm.TitleText.value = "New Post Title";
	EditForm.TextBody.value = "New Post Body";
	EditForm.PostID.value = "-1";
	EditForm.submit();
}

function DeletePost (ID)
{
	// First check to see that we are not editing another post, and if so, prompt the user to save or 
	// cancel their changes to the other post
	if ( IDBeingEdited != -1 )
	{
		if (PromptConfirmation("You are currently editing another post.  Do you want to revert your other changes to continue?"))
		{
			CancelEditState(IDBeingEdited);
		}
		else
		{
			return false;
		}
	}
	
	// Prompt the user to confirm the deletion of the post
	if (PromptConfirmation("Are you sure you want to delete this post?"))
	{
		// Do a forms post back to the server calling the server side function to delete the post passing the ID
		EditForm.PostType.value = "delete";
		EditForm.PostID.value = ID;
		EditForm.submit();
	}

	return false;
}

function PromptConfirmation(confirmationText)
{
	// Prompt the user to confirm what ever the confirmation text is that is passed in, and return the results
	return confirm(confirmationText);
}