//How to use 
//var f = new makeForm("answerText1", 1, "answer");
//f.addListeners(["answerText1","answerText2"]); 
//for bigger forms :)

function makeFormObject(objName)
{
	if(!window[objName])
	{
		window[objName] = new MakeForm(); 
	}
	
	return window[objName]; 
}

function MakeForm(){
	
		var me = this; 
		
		me.init = function init(planId, sectionId, optionsObject)
		{
			me.planId 				= planId; 
			me.sectionId 			= sectionId; 
			me.returnedGroup		= null; 
			me.tempDiv				=  document.createElement("div");

			me.objDivs 				= (me.objDivs)							?	me.objDivs 			 				:	[]; 
			me.groupDivs 			= (me.groupDivs)						?	me.groupDivs		 				:	[]; 
			me.groupTypes 			= (me.groupTypes)						?	me.groupTypes 		 			 	:	[]; 
			me.groups 				= (me.groups)							?	me.groups 		 			 		:	[]; 
			me.sectionDiv 			= (optionsObject.sectionDiv) 			?	optionsObject.sectionDiv 			: 	"sectionId"+me.sectionId ;
			me.ajaxSectionsSubmitUrl= (optionsObject.submitUrl) 			? 	optionsObject.submitUrl 			: 	'sectionsSubmit'; 
			me.addNewUrl			= (optionsObject.addNewUrl)				?	optionsObject.addNewUrl				:	'addNew';
			me.deleteUrl			= (optionsObject.deleteUrl)				?	optionsObject.deleteUrl				:	'deleteNode';
			me.saveButton 			= (optionsObject.saveButton) 			? 	optionsObject.saveButton 			: 	(!optionsObject.nextPreviousButtons) ;
			me.intMakeNextSection	= (optionsObject.nextSection) 			? 	optionsObject.nextSection			: 	false ;
			me.intMakePreviousSection= (optionsObject.previousSection) 		? 	optionsObject.previousSection		: 	false ;
			me.blfinishWizard 		= (optionsObject.finishWizard) 			? 	optionsObject.finishWizard			: 	false ;
			me.nextPreviousButtons 	= (optionsObject.nextPreviousButtons) 	? 	optionsObject.nextPreviousButtons	: 	false ;
			me.clearNextButton 		= (optionsObject.clearNextButton) 		? 	optionsObject.clearNextButton 		: 	false ;
			me.clearPreviousButton 	= (optionsObject.clearPreviousButton) 	?	optionsObject.clearPreviousButton	: 	false ;
			me.blMakeReturnButton	= (optionsObject.makeReturnButton) 		?	optionsObject.makeReturnButton		: 	false ;
			me.title 				= (optionsObject.title) 				? 	optionsObject.title					: 	"Click to edit" ;	
			me.sliceDir 			= (optionsObject.sliceDir) 				? 	optionsObject.sliceDir				: 	null ;
		}


		
		
		me.addListeners=  function addListeners(objDivs)
		{
			objDivs.each(me.addListener);
		}
		
		
		me.addListener = function addListener(objDiv)
		{ 
				var needToAddToArray = true; 
				objDiv.active = true; 
				
				for(var i=0;i<me.objDivs.length;i++)
				{
					if(me.objDivs[i].id.toString() == objDiv.id.toString())
					needToAddToArray = false;
				}
		
				if(needToAddToArray)
				{
					me.objDivs.push(objDiv);
				}
				
				for(var i=0; i<objDiv.id.length; i++)
				{
					var id = objDiv.id[i];
					if($(id))
					{
						objDiv.active = true; 
						objDiv.nodeIdent = objDiv.type + objDiv.nodeId; 
						me.setReturnedGroup(objDiv.groupId)
						me.groups.push(objDiv.groupId );
						me.onclickListener  = me.makeAllEditable.bindAsEventListener(me,objDiv.groupId );
						me.mouseoverListener = me.enterHover.bindAsEventListener(me, objDiv);
						me.mouseoutListener = me.leaveHover.bindAsEventListener(me,objDiv);
						
			    		Event.observe($(id), 'click', me.onclickListener);
			    		Event.observe($(id), 'mouseover', me.mouseoverListener);
			    		Event.observe($(id), 'mouseout', me.mouseoutListener);
						$(id).title = me.title;
						
						if($(id).hasClassName('inputAreaHTML'))
						{
							$(id).innerHTML = $(id).innerHTML.unescapeHTML();
							$(id).unescaped = true; 
							$(id).style.visibility = 'visible';
						}
					}
					else
					{
						objDiv.active = false; 
					}
				}			
			me.groups = me.groups.uniq(); 
		}
		
		me.setContextDiv= function setContextDiv(group, div, type)
		{	
			me.groupDivs[group]  = div;  
			me.groupTypes[group] = type; 

		}
		
		
		me.enterHover = function enterHover(div, objDiv)
		{	
			objDiv.id.each(
				function(id)
				{
					$(id).style.backgroundColor = "#FFFFDD";
				}
			); 
		}
		
		me.leaveHover = function leaveHover(div, objDiv)
		{	
			objDiv.id.each(
				function(id)
				{
					$(id).style.backgroundColor = "transparent";
				}
			); 
		}
		
		me.makeAllGroupsEditable = function makeAllGroupsEditable()
		{
			for(var i=0;i<me.groups.length;i++)
			{
				
				me.makeAllEditable("",me.groups[i] ); 
				
			}
					
		}
		me.makeAllGroupsUnEditable = function makeAllGroupsEditable()
		{
			for(var i=0;i<me.groups.length;i++)
			{
				me.leaveEditMode(me.groups[i])
				
			}
		}

		
		
		me.makeAllEditable = function makeAllEditable(div, groupId)
		{	

			for(var i=0;i<this.objDivs.length;i++)
			{
				var objDiv = this.objDivs[i]; 
				if(objDiv.groupId == groupId )
				{
						me.makeEditableObj(objDiv); 
				}
				
			}
			if(me.saveButton)
			{
				me.makeSubmit(groupId);
				me.makeCancel(groupId); 
			}
			else if(me.nextPreviousButtons)
			{
				if(me.blMakeReturnButton)
				{
					me.makeReturnButton(groupId); 
					return; 
				}
				
				if(me.intMakePreviousSection)this.makePreviousSection(groupId); 
				if(me.intMakeNextSection)this.makeNextSection(groupId); 
				if(me.blfinishWizard)this.makeFinishAndReturn(groupId); 
				
				if(me.clearNextButton && me.clearPreviousButton )
				{
					me.makeSubmit(groupId);
					me.makeCancel(groupId);
				}
				else
				{
					if(!me.clearPreviousButton) this.makePreviousButton(groupId);
					if(!me.clearNextButton)this.makeNextButton(groupId); 
				}

				

			}

		}
		
		me.makeEditableObj= function makeEditableObj(objDiv)
		{
			objDiv.id.each(
				function(id)
				{
					if($(id))
					{
						if($(id).visible())
						{
							objDiv.active = true; 
							me.makeTextInput(id); 
						}
					}
					else
					{
						objDiv.active = false; 
					}
	
				}
			); 
			datePickerController.create();
		}
		me.makeTextInput = function makeTextInput(id)
		{
			
			var text = $(id).innerHTML;
			if (!($(id).unescaped))
			{
				text = text.unescapeHTML(); 
			}
			
			var rows = parseInt(Element.getHeight($(id))/15); 
			Element.hide($(id));
							

			if($(id).hasClassName('inputDate'))
			{
				var textField = document.createElement("input");
				textField.type = "text";
				Element.addClassName(textField,"format-d-m-y highlight-days-67"); 
				Element.addClassName(textField,"inputDateInput");
				textField.name = id;
				textField.id = "input"+id;
				textField.value		= text;
				$(id).parentNode.insertBefore(textField, $(id));
			}
			else if($(id).hasClassName('inputAreaHTML'))
			{
				var progress = document.createElement('span');
				Element.addClassName(progress, 'inputHTMLProgress');
				Element.update(progress, 'Saving....');
				Element.hide(progress);
				progress.id = 'progress' + id;
				$(id).parentNode.insertBefore(progress, $(id));
				var textField = document.createElement("textarea");
				Element.addClassName(textField,"editor_field"); 
				Element.addClassName(textField,"inputHTMLInput");
				textField.rows = rows + 1; 
				textField.name = id;
				textField.id = "input"+id;
				textField.value		= text;
				textField.style.visibility = 'hidden';
				$(id).parentNode.insertBefore(textField, $(id));
				tinyMCE.execCommand('mceAddControl', false, "input"+id);
				
			}
			else if(rows>1)
			{
				var textField = document.createElement("textarea");
				Element.addClassName(textField,"editor_field"); 
				textField.rows = rows + 1 ; 
				textField.name = id;
				textField.id = "input"+id;
				textField.value		= text;
				$(id).parentNode.insertBefore(textField, $(id));
			}
			else
			{
				var textField = document.createElement("input");
				textField.type = "text";
				Element.addClassName(textField,"editor_field"); 
				textField.name = id;
				textField.id = "input"+id;
				textField.value		= text;
				$(id).parentNode.insertBefore(textField, $(id));
			}
				


		}
		
		me.makeDivUneditable = function makeDivUneditable(groupId, Ident)
		{
			for(var i=0;i<me.groups.length;i++)
			{
				var objDiv = me.objDivs[i]; 
				if((objDiv.nodeIdent == Ident)&&(objDiv.groupId ==groupId ))
				{
					makeObjDivLeaveEditMode(objDiv); 	
					
				}
			}
		}
		
		
		me.leaveEditMode =  function leaveEditMode(groupId )
		{
			for(var i=0; i<me.objDivs.length; i++)
			{
				if(me.objDivs[i].groupId == groupId )
				{
					makeObjDivLeaveEditMode(me.objDivs[i])	
				}
			}
		}
		
		function makeObjDivLeaveEditMode(objDiv )
		{
			objDiv.id.each(makeIDLeaveEditMode); 	
		}
		
		function makeIDLeaveEditMode(id)
		{
				if($("input"+id))
				{
					if($("input"+id).hasClassName('inputDateInput'))
					{
						Element.remove($("fd-but-input"+id)); 
					}
					else if($("input"+id).hasClassName('inputHTMLInput'))
					{
						tinyMCE.execCommand('mceRemoveControl', false, "input"+id);
					}
									
						Element.remove($("input"+id)); 
						Element.show($(id));
				}
		}
		
		me.getContextDiv = function getContextDiv(groupId)
		{
			
			
			if(me.groupDivs[groupId])
			{	
			
				return  me.groupDivs[groupId]; 
				
			}
			else
			{
				return me.sectionDiv;
				
			}
		}
		
		me.getContextType = function getContextType(groupId)
		{
			
			
			if(me.groupTypes[groupId])
			{	
			
				return  me.groupTypes[groupId]; 
				
			}
			else
			{
				return null;
				
			}
		}
		


		me.getValues = function getValues(groupId)
		{
			var objDivsfiltered = me.objDivs.findAll
			( 
				function(objDiv)
				{
					if((objDiv.groupId == groupId) &&(objDiv.active))
					{
						objDiv.values = {}; 
						objDiv.id.each(
							function(id)
							{
								var index = id.split("_",2)
								tinyMCE.execCommand('mceRemoveControl', false, "input"+id);
	
								//make sure no character combinations can hurt us :) 
								objDiv.values[index[0]] = $F("input"+id).gsub('\"', '\ "');
								$("input"+id).value = "Saving...."

								// The original save message scheme was showing the HTML source
								// before the rich-text editor was created ... so do an alternative save message
								if ($('progress'+id)) {
									Element.show('progress'+id);
								}
							}
						); 
						 
						return true; 
					}
					else{
						
						return false; 
					}

				}
			); 
			return objDivsfiltered.toJSONString();
			
		}
		me.saved =  function saved(groupId)
		{
			

		}
		
		
		me.onComplete = function onComplete(groupId)
		{
			var context = me.getContextDiv(groupId);  

			
			var oldId = context+"_update"; 
			var contextType = me.getContextType(groupId); 
			
			
			if(contextType)
			{
				var childNode = $$('#'+oldId+' .'+contextType) ; 
				if(childNode.length==1)
				{
					if(childNode[0])
					{
						$(oldId).parentNode.replaceChild(childNode[0] , $(oldId));
					}
					
				}
			}
			else
			{
				$(context)
				{
					$(oldId).parentNode.replaceChild( $(context) , $(oldId));
				}
				
			}

		}
		me.jumpToPointer = function jumpToPointer(groupId, pointer)
		{
			var mode = "jumpTo&newPointer="+pointer;
			me.saveform("xxx", groupId,mode); 
		}
		
		me.saveform =  function saveform(event, groupId, mode)
		{

		
			var context = $(me.getContextDiv(groupId));  
			if(!context)
			{
				return; 
			}
		
			var params = 'planId=' + me.planId + '&sectionId=' + me.sectionId;
			if(mode)
			{
				params +='&mode=' + mode; 
			}
			params +=  '&jsonObj='+encodeURIComponent(me.getValues(groupId)); 
			
			context.id = context.id+"_update"; 
			var updater = new Ajax.Updater(context, me.ajaxSectionsSubmitUrl, {
			method:'get', parameters:params, onComplete:function(){me.onComplete(groupId)} 
			,onFailure:function(){alert('Failure')}
			,onException:function(request, exception){alert(exception)},evalScripts: true
			});
			return false; 
			
		}
		me.onclickCancel = function onclickCancel(cancelLink, groupId)
		{
				Element.remove($("cancel"+groupId + me.sectionId));
				Element.remove($("submit"+groupId + me.sectionId ));
				me.leaveEditMode(groupId); 
				return false;	
		}
		me.makeCancel = function makeCancel(groupId)
		{
			var context = $(me.getContextDiv(groupId));  
			if(!context)
			{
				return; 
			}
			if(!($("cancel"+groupId + me.sectionId)))
			{
			  if(me.sliceDir)
			  {
				var cancelLink = makeButton("cancel"+groupId + me.sectionId, "Cancel", context, "Right"); 
			  }
			  else
			  {
			    var cancelLink = document.createElement("a");
				cancelLink.id = "cancel"+groupId + me.sectionId; 
				Element.addClassName(cancelLink,"editor_cancel");
				context.appendChild(cancelLink);
			  }
				cancelLink.onclick   = me.onclickCancel.bindAsEventListener(cancelLink, groupId );
			}

		}
				 
		function makeButton(id, text, context, classDirection)
		{
					
				  var topDiv = document.createElement("div");
				  var leftDiv = document.createElement("div");
				  var leftImg = document.createElement("img");
				  var middleDiv = document.createElement("div");
				  var middleLink = document.createElement("a");
				  var rightDiv = document.createElement("div");
				  var rightImg = document.createElement("img");
				  
				  leftImg.src = me.sliceDir+"/listButtonLevelOne.png"; 
				  rightImg.src = me.sliceDir+"/listButtonRight.png"; 
				  topDiv.id = id; //"cancel"+groupId + me.sectionId; 
				  middleLink.appendChild(document.createTextNode(text));
				  middleLink.href = "#";
				  
				  leftDiv.appendChild(leftImg);
				  middleDiv.appendChild(middleLink);
				  rightDiv.appendChild(rightImg);
				  
				  Element.addClassName(topDiv,"scriptButton"+classDirection);
				  Element.addClassName(leftDiv,"scriptButtonDiv");
				  Element.addClassName(middleDiv,"scriptButtonDiv");
				  Element.addClassName(rightDiv,"scriptButtonDiv");

				  topDiv.appendChild(leftDiv);
				  topDiv.appendChild(middleDiv);
				  topDiv.appendChild(rightDiv);
				  
				  context.appendChild(topDiv);
				  return middleLink
		}
		
		
		me.makeSubmit = function makeSubmit(groupId)
		{
			var context = $(me.getContextDiv(groupId));  
			if(!context)
			{
				return; 
			}
			
			
			if(!($($("submit"+groupId + me.sectionId))))
			{
				if(me.sliceDir)
				{
					var id = "submit"+groupId + me.sectionId; 
					var SubmitButton = makeButton(id, "Save", context, "Right"); 
				}
				else
				{
					var context = $(me.getContextDiv(groupId)); 
					var SubmitButton = document.createElement("input");
					SubmitButton.type = "button";
					SubmitButton.value = "save";
					SubmitButton.id = "submit"+groupId + me.sectionId; 
					Element.addClassName(SubmitButton,"editor_ok_button");
					context.appendChild(SubmitButton);
				}
				
				SubmitButton.onclick   = me.saveform.bindAsEventListener(SubmitButton, groupId );

			}

		} 
		
		me.makePreviousSection = function makePreviousSection(groupId)
		{
			var context = $(me.getContextDiv(groupId));  
			if(!context)
			{
				return; 
			}
			
			if(!($("previoussection"+groupId + me.sectionId)))
			{
			  if(context)
			  {
			  	var id = "previoussection"+groupId + me.sectionId; 
									
			  	makeSectionNavButton(context,id ,me.intMakePreviousSection,  "Previous Section" , ""); 
			  }
			 }	
		}
 
		me.makeNextSection = function makeNextSection(groupId)
		{

			var context = $(me.getContextDiv(groupId));  
			if(!context)
			{
				return; 
			}
			
			if(!($("nextsection"+groupId + me.sectionId)))
			{
			  if(context)
			  {
			  	var id = "nextsection"+groupId + me.sectionId; 
			  	makeSectionNavButton(context,id ,me.intMakeNextSection,  "Next Section", "Right"); 
			  }
			 }	
		}
		me.makeFinishAndReturn = function makeFinishAndReturn(groupId)
		{

			var context = $(me.getContextDiv(groupId));  
			if(!context)
			{
				return; 
			}
			
			if(!($("finishandreturn"+groupId + me.sectionId)))
			{
			  if(context)
			  {
			  	var id = "finishandreturn"+groupId + me.sectionId; 
			  	makeFinishAndReturnNavButton(context,id,  "Finish and Return", "Right"); 
			  }
			 }	
		}
		me.makeNextButton = function makeNextButton(groupId)
		{
			var context = $(me.getContextDiv(groupId));  
			if(!context)
			{
				return; 
			}
			
			if(!($("next"+groupId + me.sectionId)))
			{

			  if(context)
			  {
			  	var id = "next"+groupId + me.sectionId; 
			  	makeNavButton(context,id , "Next","next" , groupId, "Right"); 

			  }
			 }

		}
		me.makeReturnButton = function makeReturnButton(groupId)
		{
			var context = $(me.getContextDiv(groupId));  
			if(!context)
			{
				return; 
			}
			if(!($("next"+groupId + me.sectionId)))
			{
			  if(context)
			  {
			  	id ="next"+groupId + me.sectionId; 
				makeNavButton(context,id , "Return","return" , groupId, "Right");
			  }
			}
		}
		function makeFinishAndReturnNavButton(context, id, text, directionCL)
		{

				var cl = (directionCL)?directionCL:""; 
				if(me.sliceDir)
				{
					var button = makeButton(id, text, context, cl); 
				}
				else
				{
			      var button = document.createElement("a");
				  button.id = "next"+groupId + me.sectionId; 
			      button.appendChild(document.createTextNode("Return"));
				  Element.addClassName(nextButton,"input_next");
				  context.appendChild(nextButton);
				}
				button.href = "../travelPlans";
		}
		function makeSectionNavButton(context, id,sectionDirectionId , text, directionCL)
		{

				var cl = (directionCL)?directionCL:""; 
				if(me.sliceDir)
				{
					var button = makeButton(id, text, context, cl); 
				}
				else
				{
			      var button = document.createElement("a");
				  button.id = "next"+groupId + me.sectionId; 
			      button.appendChild(document.createTextNode("Return"));
				  Element.addClassName(nextButton,"input_next");
				  context.appendChild(nextButton);
				}
				button.href = "sectionWizard?id="+ me.planId+"&pointer="+sectionDirectionId;
		}
		
		function makeNavButton(context, id, text,mode , groupId, directionCL)
		{
				var cl = (directionCL)?directionCL:""; 
				if(me.sliceDir)
				{
					var button = makeButton(id, text, context, cl); 
				}
				else
				{
			      var button = document.createElement("a");
			      button.href = "#";
				  button.id = "next"+groupId + me.sectionId; 
			      button.appendChild(document.createTextNode("Return"));
				  Element.addClassName(nextButton,"input_next");
				  context.appendChild(nextButton);
				}
				button.onclick   = me.saveform.bindAsEventListener(button, groupId, mode );
		}
		
		me.makePreviousButton = function makePreviousButton(groupId)
		{
			var context = $(me.getContextDiv(groupId));  
			if(!context)
			{
				return; 
			}
			if(!($( "previous"+groupId + me.sectionId)))
			{
			  
			  if(context)
			  {
			  	  makeNavButton(context, "previous"+groupId + me.sectionId, "Previous","previous" , groupId); 
			  }
			}

		}
		me.setReturnedGroup = function setReturnedGroup(group)
		{
			me.returnedGroup =group; 
			
		}
		me.finishMakeNewNode = function finishMakeNewNode()
		{
			if(me.returnedGroup)
			{
				setTimeout(function(){me.makeAllEditable("", me.returnedGroup)},100);
				me.setReturnedGroup(null); 
			}
		}
		me.addNewNode = function addNewNode(nodeType, divId, nodeId, groupId )
		{

			var	params = "&planId=" 	+ 	me.planId;  
				params +="&sectionId=" 	+ 	me.sectionId;
				params +="&nodeId=" 	+	nodeId;
				params +="&nodeType=" 	+	nodeType;
				params +="&groupId=" 	+	groupId;  
			
			
			var updater = new Ajax.Updater(divId, me.addNewUrl, 
			{
				method:'get', 
				parameters:params, 
				onFailure:function(){alert('Failure')},
				onComplete:me.finishMakeNewNode ,
				onException:function(request, exception){alert(exception)
			},
			insertion: Insertion.Bottom, 
			evalScripts: true
			});
		}
		me.finishedDeleting = function finishedDeleting(divId, groupId, nodeId, nodeType)
		{
			me.makeDivUneditable(groupId, nodeType+nodeId)
			Element.remove($(divId));
			
			if(me.nextPreviousButtons)
			{
				me.saveform("xxx", "xxx", "next" );
			}
		}
		me.deleteNode = function deleteNode(nodeType, divId, nodeId, groupId)
		{
			var	params = "&planId=" 	+ 	me.planId;  
				params +="&sectionId=" 	+ 	me.sectionId;
				params +="&nodeId=" 	+	nodeId;
				params +="&nodeType=" 	+	nodeType;

			var request = new Ajax.Request(me.deleteUrl,
			{
				method:'post', 
				parameters:params,
				onSuccess:function(){me.finishedDeleting(divId, groupId, nodeId, nodeType)}
			})

		}
}