$(document).ready(function(){
   $("div.forum").each(function(i){
      setEditForum(this, i);
   });
   $("div.newforum").each(function(i){
      setSubmitForum(this, i);
   });
});
	

function setEditForum(obj, i) {
   $(obj).dblclick(function() {
	  var oid = $(this).attr('id');
        createEditBox(oid);
	})
   .mouseover(function() {
      $(obj).addClass("editable");
   })
   .mouseout(function() {
      $(obj).removeClass("editable");
   });
}//end of function setEditForum

function setSubmitForum(obj, i) {
   $(obj).click(function() {
  	var oid = $(this).attr('id');
	this.innerHTML = "";
      createEditBox(oid);
   })
   .mouseover(function() {
      $(obj).addClass("editable");
   })
   .mouseout(function() {
      $(obj).removeClass("editable");
   });
}//end of function setSubmitForum


function saveChanges(buttobj, cancel,oid,n) {
   if(!cancel) {
      var t = $(buttobj).parent().siblings(0).val();
	  postUpdate(oid, t);
   }
   else {
      var t = cancel;
	  if ($('span.saveok').length > 0)
		  $('div.saveok').remove();
   }
   if(t=='') t='(deleted)';
   var htmlcode = '<div id="'+oid+'" class="forum" title="dblclick to edit">'+t+'</div>';
   $(buttobj).parent().parent().after(htmlcode).remove();
   setEditForum($("div.forum").get(n), n); 
}

function save(buttobj, cancel,oid,n) {
   if(!cancel) {
      var t = $(buttobj).parent().siblings(0).val();
      postUpdate(oid, t);
   }
   else {
      var t = cancel;
      if ($('span.saveok').length > 0)
	  $('div.saveok').remove();
   }
   if(t=='') t='(deleted)';
   if (!cancel){
      var htmlcode = 
	'<div id="'+oid+'" class="newforum" title="click here to add another comment">'+
		'<p>click here to add another comment</p></div>'+
	'<br><hr><br>'+
	'<div class="forum">Thank you for the submission.<br>'+t+'</div>';

   }
   else {
      var htmlcode = 
	'<div id="'+oid+'" class="newforum" title="click here to add a comment"><h2>click here to add a comment</h2></div>';
   }
   $(buttobj).parent().parent().after(htmlcode).remove();
   setSubmitForum($("div.newforum").get(n), n); 

}

function postUpdate(oid, data){

 var date = new Date();
 data += "<h6 align='right'>Last edited: " + date.toString() + "</h6>";

 var postData = "name="+oid+"&data="+encodeURIComponent(data);
 $.ajax({
   type: "POST",
   url: "postinfo.php",
   data: postData,
   success: function(msg){
           if ($('span.saveok').length > 0)
              $('span.saveok').html($('span.saveok').html()+'&middot;ok');
           else
          $('<div class="saveok"><br /><hr /><br/><span class="saveok"><em>data saved</em></span><br /><hr /><br /></div>').appendTo('body');
   }
 });
}


//function checkImageType() {
//  var ext = document.f.pic.value;
//  ext = ext.substring(ext.length-3,ext.length);
//  ext = ext.toLowerCase();
//  if((ext != 'gif') 
//  	&&(ext != 'png') 
//	  &&(ext != 'jpg')) {
//    alert('You selected a .'+ext+ ' file; please select a .jpg or.png or .gif file instead!');
//    return false; 
// }
//  else
//    return true; 
//}
	



function insertAfter(referenceNode, newNode) { referenceNode.parentNode.insertBefore(newNode, referenceNode.nextSibling); }
// provides a insertAfter function; this is used in a few places in the code



function createEditBox(areaid)
{
	var area = document.getElementById(areaid); // gets the actual object that will be converted into a RTE
			
	var storeareawidth = area.style.width;
	var storeareaheight = area.style.height;
	var storeareadisplay = area.style.display;

	var w = (($(area).width())+16);
	var h = (($(area).height())+200);

	if (w < 300) w = 300; // min dimentions
	if (h < 100) h = 100;
	if (w > 800) w = 800; // max dimentions
	if (h > 600) h = 600;
			
	area.style.width = w + "px";
	area.style.height = h + "px";

	var type = area.tagName; // gets the tagname of the object (should be TEXTAREA or DIV)
	var mode = "code";
	var rteinstance = null; // this will be the RTE object
	var revert = "";
	if (type == "TEXTAREA") revert = area.value;
	if (type == "DIV") revert = area.innerHTML;

	// creates the nav table on the RTE, with CODE and DESIGN options
	var navtable = document.createElement("table");
	navtable.width = (w + 0) + "px";
	navtable.cellspacing = "3";
	navtable.cellpadding = "0";
	navtable.border = "0";
	navtable.style.border = "1px solid #ccc";
	navtable.style.borderTop = "0";
	navtable.style.cursor = "default";
	var navtablerow = navtable.insertRow(0);
	var navtabledesigncell = navtablerow.insertCell(0);
	navtabledesigncell.id = areaid + "_designmodebutton";
	navtabledesigncell.style.color = "#000000";
	navtabledesigncell.style.fontFamily = "arial";	
	navtabledesigncell.style.fontSize = "12px";	
	navtabledesigncell.width = "65px";
	navtabledesigncell.style.border = "1px solid #ccc";
	navtabledesigncell.innerHTML = '<img src="design.gif">&nbsp;Design';
	var navtablecodecell = navtablerow.insertCell(1);
	navtablecodecell.id = areaid + "_codemodebutton";
	navtablecodecell.style.color = "#000000";
	navtablecodecell.style.fontFamily = "arial";	
	navtablecodecell.style.fontSize = "12px";
	navtablecodecell.width = "80px";
	navtablecodecell.style.border = "1px solid #ccc";
	navtablecodecell.innerHTML = '<img src="html.gif">&nbsp;Edit HTML';
	var navtablesavecell = navtablerow.insertCell(2);
	navtablesavecell.id = areaid + "_savemodebutton";
	navtablesavecell.style.color = "#000000";
	navtablesavecell.style.fontFamily = "arial";	
	navtablesavecell.style.fontSize = "12px";
	navtablesavecell.width = "100px";
	navtablesavecell.style.border = "1px solid #ccc";
	navtablesavecell.innerHTML = '<img src="save.gif">&nbsp;Save and Exit';
	var navtablecancelcell = navtablerow.insertCell(3);
	navtablecancelcell.id = areaid + "_cancelmodebutton";
	navtablecancelcell.style.color = "#000000";
	navtablecancelcell.style.fontFamily = "arial";	
	navtablecancelcell.style.fontSize = "12px";
	navtablecancelcell.width = "70px";
	navtablecancelcell.style.border = "1px solid #ccc";
	navtablecancelcell.innerHTML = '<img src="cancel.gif">&nbsp;Cancel';
	var spacercell = navtablerow.insertCell(4);	
	spacercell.style.border = "0px";
	insertAfter(area, navtable);
			
	// turns the area into a RTE
	editArea();

	// activates the nav table
	document.getElementById(areaid + '_designmodebutton').onclick = editArea;
	document.getElementById(areaid + '_codemodebutton').onclick = codeArea;
	document.getElementById(areaid + '_savemodebutton').onclick = saveandexitArea;
	document.getElementById(areaid + '_cancelmodebutton').onclick = cancelArea;


	function editArea() // if you click "design"
	{
		if (mode != "design")
		{				
			if (mode == "code") removeCodemode();
			// re-turn the object into a RTE
			rteinstance = null;
			rteinstance = new nicEditor({fullPanel : true}).panelInstance(areaid, {hasPanel : true});
			mode = "design";
		}
	}
	function codeArea() // if you click "code"
	{
		if (mode != "code")
		{
			if (mode == "design") removeEditmode();
			area.style.display = "none"; // hide the original object

			var spacer = document.createElement("div");
			spacer.style.border = '1px solid #ccc';
			spacer.style.backgroundColor = "#efefef";
			spacer.style.width = (w - 0) + "px";
			var textareawidth = w;
			var iconsperrow = Math.floor(textareawidth / 20);
			var numofrows = (Math.floor(36 / iconsperrow) + 1);
			if (iconsperrow == 36) numofrows = 1;
			spacer.style.height = ((22 * numofrows + 3) + "px");						
			spacer.id = areaid + "_spacer";
			//area.parentNode.insertBefore(spacer, area);
			var codebox = document.createElement("textarea");
			codebox.style.width = w;
			codebox.style.height = h;
			codebox.id = areaid + "_codebox";
			if (type == "TEXTAREA") codebox.value = area.value;
			if (type == "DIV") codebox.value = area.innerHTML;
			insertAfter(area, spacer);
			insertAfter(spacer, codebox);
			mode = "code";
		}
	}
	function saveandexitArea() // uploads changes via function call and removes the area
	{
		exitArea();
		var data = "";
		if (type == "TEXTAREA") data = area.value;
		if (type == "DIV") data = area.innerHTML;
		postUpdate(areaid, data);
			
	}
	function cancelArea() // cancels the area without saving any changes
	{
		exitArea();
		if (type == "TEXTAREA") area.value = revert;
		if (type == "DIV") area.innerHTML = revert;
	}





	function removeCodemode() // removes the code mode
	{
		// delete the spacer (if it exists)
		var spacer = document.getElementById(areaid + '_spacer');
		if (spacer) spacer.parentNode.removeChild(spacer);
		// delete the code textbox (if it exists)
		var codebox = document.getElementById(areaid + '_codebox');
		if (codebox)
		{
			// take the value from the textbox and stick it back in the original code
			if (type == "TEXTAREA") area.value = codebox.value;
			if (type == "DIV") area.innerHTML = codebox.value;
			codebox.parentNode.removeChild(codebox); // delete the textbox
		}
	}
	function removeEditmode() // removes the design mode
	{
		if (rteinstance != null)
		{
			// remove the RTE, if it exists
			rteinstance.removeInstance(areaid);
			rteinstance = null;
			area.style.display = "";
		}
	}
	function exitArea() // comletely removes RTE from the object
	{
		removeCodemode();
		removeEditmode();
		navtable.parentNode.removeChild(navtable);
		area.style.display = storeareadisplay;
		area.style.width = storeareawidth;
		area.style.height = storeareaheight;
	}
}