function MenuObject(){
	var _self = this;
	this.properties = new Object();
	_self.properties['type'] = "menu";
	_self.properties['headings'] = new Object();
	_self.properties['children'] = new Object();
	_self.properties["itemMenu"] = _userMenuManager.copyOptions("itemMenu");
	_self.properties["toolkit"] = _userMenuManager.copyOptions("toolkit");
	
	this.select 	   = function()				{_userMenuManager.selectedMenu = _self;_self.properties['menuBackgroundDiv'].select();}
	this.unSelect 	   = function()				{_self.properties['menuBackgroundDiv'].unSelect();}  
	this.appendTo      = function(parentObject)	{_userMenuManager.appendTo(parentObject)}
	this.toXML 	   	   = function()				{_userMenuManager.selectedMenu = _self; return _userMenuManager.toXML()}
	this.setPosition   = function(topPos,leftPos){_self.properties['holderDiv'].style.top = topPos;_self.properties['holderDiv'].style.left = leftPos;}
	this.getCorners    = function()				{return _self.properties['menuBackgroundDiv'].getCorners();}
	this.changeCorner  = function(corner,value)	{_self.properties['menuBackgroundDiv'].changeCorner(corner,value)}
	this.changeColor   = function(color)		{_self.properties['menuBackgroundDiv'].changeColor(color);_self.properties['bgColor']= _self.properties['menuBackgroundDiv'].properties['bgColor'];}
	this.changeBorder  = function(borderObj)	{_self.properties['menuBackgroundDiv'].changeBorder(borderObj); _self.properties['borderObj'] = borderObj;};
	this.getBorder     = function()				{return _self.properties['menuBackgroundDiv'].getBorder();}
	this.startResize   = function()				{_self.properties['menuBackgroundDiv'].startResize()}
	this.resizeUp      = function(differenceY)	{_self.properties['menuBackgroundDiv'].resizeUp(differenceY)}
	this.resizeDown    = function(differenceY)	{_self.properties['menuBackgroundDiv'].resizeDown(differenceY)}
	this.resizeRight   = function(differenceX)	{_self.properties['menuBackgroundDiv'].resizeRight(differenceX)}
	this.resizeLeft    = function(differenceX)	{_self.properties['menuBackgroundDiv'].resizeLeft(differenceX)}
	this.endResize	   = function()				{_self.properties['menuBackgroundDiv'].endResize()}
	this.setBGImage    = function(bgImg, bgRepeat){_self.properties['menuBackgroundDiv'].setBGImage(bgImg,bgRepeat);_self.properties['bgImg'] = bgImg; _self.properties['bgRepeat'] = bgRepeat;}
	this.removeBGImage = function()				{_self.properties['menuBackgroundDiv'].removeBGImage();_self.properties['bgImg'] = ""; _self.properties['bgRepeat'] = "";}
	this.setSize	   = function(height,width)	{_self.properties['menuBackgroundDiv'].setSize(height,width) }
	this.copyElement   = function()				{_userMenuManager.selectedMenu = _self; return _userMenuManager.copyElement()}
	this.deleteElement  = function()				{_self.properties['menuBackgroundDiv'].deleteElement() }
}

function Heading(){
	var _self = this;
	this.properties = new Object();
	_self.properties['type'] = "heading";
	_self.properties['link'] = "";
	_self.properties['cursor'] = "pointer";
	_self.properties['children'] = new Object();
	this.deleteElement  = function()	{}
	this.unSelect = function(){
		if(_self['hover']!=undefined)_self['hover'].unSelect();
		if(_self['normal']!=undefined)_self['normal'].unSelect();
	}
}

function UserMenuManager(){	
	var _self = this;	
	var _copyHeadings = new Object();			
	this.selectedMenu = null;
	
	var _toolkitOptions = new Object();
	_toolkitOptions['bgColor'] = 'bgColor';
	_toolkitOptions['border'] = 'border';
	_toolkitOptions['corners'] = 'corners';
	_toolkitOptions['bgImg'] = 'bgImg';
	_toolkitOptions['elementSize'] = 'elementSize';
	_toolkitOptions['elementPosition'] = 'elementPosition';
	
	var _itemMenuOptions = new Object()
	_itemMenuOptions['addHeading'] = 'addHeading';
	
	
	function makeNormalHeading(){
		var normalHeading = _divManager.createDiv(35,150,"#F1F1F1",_objectManager.createBorderObj("1px solid #B8B8B8"),"0000","all");
		var normalText = _textAreaManager.createTextArea(20,80,"transparent",_objectManager.createBorderObj("0px solid black"),"simpleText");
		normalText.setInnerHTML('Heading');
		normalText.setPosition(7,50);	
		normalText.properties['subType'] = "HeadingTitle"	
		_objectManager.addElement(normalHeading,normalText,true)
		return normalHeading;
	}	
	
	function makeHoverHeading(){
		var hoverHeading = _divManager.createDiv(35,150,"#c2daff",_objectManager.createBorderObj("1px solid #B8B8B8"),"0000","all");
		var hoverText = _textAreaManager.createTextArea(20,80,"transparent",_objectManager.createBorderObj("0px solid black"),"simpleText");
		hoverText.setInnerHTML('Heading');
		hoverText.setPosition(7,50);
		hoverText.properties['subType'] = "HeadingTitle"
		_objectManager.addElement(hoverHeading,hoverText,true);
		return hoverHeading;
	}
	
	
	this.createMenu = function(createMode,direction, height, width, divColor, borderObj){		
		_self.selectedMenu = new MenuObject();
		setProperty("id",_objectManager.createId("menu"));		
		setProperty("direction", direction);
		setProperty("currentView", "normal");		
		if (createMode == "new"){
			createBackgroundDiv(height, width, divColor, borderObj);
		}
		return _self.selectedMenu;
	}
	function createBackgroundDiv(height, width, divColor, borderObj){
		setProperty("bgColor",divColor);	
		setProperty("borderObj",borderObj);
		var menuBackgroundDiv = _divManager.createDiv(height,width,divColor,borderObj,"0000","all");
		var messageDiv = document.createElement("div");
		messageDiv.innerHTML = '<div align="center" style="margin:5;" >Click <img style="border:1px solid #000000;" src="work/WebsiteEditor/Images/itemMenu/add.jpg"/> to add a new heading.</div>';
		setProperty("messageDiv",messageDiv);
		menuBackgroundDiv.properties["holderDiv"].appendChild(messageDiv);
		registerBackgroundDiv(menuBackgroundDiv)
	}
	function registerBackgroundDiv(menuBackgroundDiv){
		_objectManager.changeId(menuBackgroundDiv,getProperty("id"));
		menuBackgroundDiv.properties['id']= getProperty("id")
		menuBackgroundDiv.properties['holderDiv'].id = getProperty("id");
		setProperty("menuBackgroundDiv", menuBackgroundDiv);
		setProperty("holderDiv", menuBackgroundDiv.properties['holderDiv']);
	}
	
	this.copyOptions = function(option){
		var options = new Object();
		if(option == "toolkit") return _objectManager.cloneObject(_toolkitOptions);
		else return _objectManager.cloneObject(_itemMenuOptions);
	}
	
	function setProperty(property,value){
		if(_self.selectedMenu != undefined)	_self.selectedMenu.properties[property] = value;
	}
	function getProperty(propertyName){
		if(_self.selectedMenu != undefined)	return _self.selectedMenu.properties[propertyName];
		else return undefined;
	}
	
	this.appendTo = function(parentObject){
		parentObject.appendChild(getProperty("menuBackgroundDiv").properties['holderDiv']);
	}
	function getNextHeadingPosition(direction){
		var menuHeadings = getProperty("headings")
		nextPositionTop = 0;
		nextPositionLeft = 5;
			
	for (var eachHeading in menuHeadings){
			var elementHolderDiv = menuHeadings[eachHeading]['normal'].properties["holderDiv"];	
			var headerHolderDiv =menuHeadings[eachHeading].properties["holderDiv"];
			var newTop = parseInt(elementHolderDiv.style.top)+ parseInt(elementHolderDiv.style.height) + parseInt(headerHolderDiv.style.top)
			var newLeft = parseInt(elementHolderDiv.style.left)+ parseInt(elementHolderDiv.style.width) + parseInt(headerHolderDiv.style.left)
			nextPositionTop =Math.max(nextPositionTop, newTop)
			nextPositionLeft = Math.max(nextPositionLeft, newLeft)
	}
		if(	nextPositionTop == 0 && nextPositionLeft == 5){
			var messageDiv =  getProperty("messageDiv");	
			if(messageDiv != undefined) messageDiv.parentNode.removeChild(messageDiv);
			delete _self.selectedMenu.properties["messageDiv"];
		}
		if(direction == "vertical") return nextPositionTop;
		else return nextPositionLeft;
	}
	
	function createNewHeading(headingHeight, headingWidth){
		var heading = new Heading();
		var headingDiv = document.createElement('div');
		var menuHolderDiv = getProperty("holderDiv");
		var height = parseInt(menuHolderDiv.style.height);
		var width  = parseInt(menuHolderDiv.style.width);
		var nextHeadingTop  = getNextHeadingPosition("vertical") + 5;
		var nextHeadingLeft = getNextHeadingPosition("horizontal"); 
		
		if(getProperty("direction") == "vertical"){	
			if(nextHeadingTop + headingHeight > height){
				var newHeight = height + (nextHeadingTop + headingHeight - height) 
				_self.selectedMenu.setSize(newHeight + 5 ,width);
				_elementsManager.displaySubMenus();			
			}
			_pm.setStyle(headingDiv,"position:absolute;top:"+ nextHeadingTop +"; left:5;")
		}else{			
			if(nextHeadingLeft + headingWidth > width){
				var newWidth = width + (nextHeadingLeft + headingWidth - width) 
				_self.selectedMenu.setSize(height,newWidth + 5);
				_elementsManager.displaySubMenus();
			}
			_pm.setStyle(headingDiv,"position:absolute;top:5;left:"+ nextHeadingLeft +";")
		}
			
		menuHolderDiv.appendChild(headingDiv);		
		heading.properties['holderDiv'] = headingDiv;
		heading.properties['dragSelect'] = "none";
		heading.properties['parentId'] =  _self.selectedMenu.properties['id'];
		heading.properties['id'] = _objectManager.createId("heading")				
		headingDiv.id = heading.properties['id'];
		_elementsManager.addToAllElementsTable(heading);
		return heading;
	}
	
	this.addHeading = function(){
		var menuHeadings = getProperty("headings")
		/* create normal heading*/		
		var newHeading = makeNormalHeading();
		var height = parseInt(newHeading.properties['holderDiv'].style.height)
		var width = parseInt(newHeading.properties['holderDiv'].style.width)
		var heading = createNewHeading(height,width); 
		
		newHeading.properties["holderDiv"].style.top = 0; 
		newHeading.properties["holderDiv"].style.left = 0;
		newHeading.properties["parentId"] = heading.properties['id'];
		newHeading.properties["parent"] = heading;				
		newHeading.appendTo(heading.properties['holderDiv']);
		_elementsManager.addToAllElementsTable(newHeading);
		
		heading['normal'] = newHeading;
		
		/* create hover heading*/
		var hoverHeading = makeHoverHeading()
		hoverHeading.properties["holderDiv"].style.top = 0;
		hoverHeading.properties["holderDiv"].style.left = 0;
		hoverHeading.properties["holderDiv"].style.display = "none";
		hoverHeading.properties["display"] = "none";
		hoverHeading.properties["parentId"] = heading.properties['id'];
		hoverHeading.properties["parent"] = heading;
		hoverHeading.appendTo(heading.properties['holderDiv']);
		_elementsManager.addToAllElementsTable(hoverHeading);
						
		heading['hover'] = hoverHeading;
		menuHeadings[heading.properties['id']] = heading;
		_self.selectedMenu.select();
		
		newHeadingTitle = _objectManager.findElementByProperty(newHeading,"subType","HeadingTitle");
		hoverHeadingTitle = _objectManager.findElementByProperty(hoverHeading,"subType","HeadingTitle");
		newHeadingTitle.properties['siblingId'] = hoverHeadingTitle.properties["id"];
		hoverHeadingTitle.properties['siblingId'] = newHeadingTitle.properties["id"];
		
		_objectManager.setProperty(hoverHeading,"display","none");
		_objectManager.setPropertyIncludeChildren(hoverHeading,"dragSelect","none");
		
		heading.properties['children'][newHeading.properties["id"]] = newHeading;
		heading.properties['children'][hoverHeading.properties["id"]] = hoverHeading;
		getProperty("children")[heading.properties["id"]] = heading;
		
		var itemMenu = getProperty("itemMenu");
		itemMenu['toggleHeadings'] = 'toggleHeadings';
		itemMenu['previewMenu']= 'previewMenu';
		_elementsManager.selectElementObj(_self.selectedMenu);
	}
		
	this.toggleHeadings = function(){
		_self.endPreviewMenu();
		mode = getProperty("currentView");
		makeHeadingsIdentical(mode);
		if (mode == "normal") mode = "hover";
		else mode = "normal";
		setProperty("currentView", mode);
		showHeadings(mode);
	}
	
	function showHeadings(mode){	
		var menuHeadings = getProperty("headings")	
		for (eachHeading in menuHeadings){		
			if (mode == 'hover'){
				menuHeadings[eachHeading]['hover'].properties["holderDiv"].style.display = "block"
				menuHeadings[eachHeading]['normal'].properties["holderDiv"].style.display = "none";
				_objectManager.setProperty(menuHeadings[eachHeading]['hover'],"display","block");
				_objectManager.setProperty(menuHeadings[eachHeading]['normal'],"display","none");
				_objectManager.setPropertyIncludeChildren(menuHeadings[eachHeading]['hover'],"dragSelect","true");
				_objectManager.setPropertyIncludeChildren(menuHeadings[eachHeading]['normal'],"dragSelect","none");				
			}
			else{
				menuHeadings[eachHeading]['hover'].properties["holderDiv"].style.display = "none"
				menuHeadings[eachHeading]['normal'].properties["holderDiv"].style.display = "block";
				_objectManager.setProperty(menuHeadings[eachHeading]['normal'],"display","block");
				_objectManager.setProperty(menuHeadings[eachHeading]['hover'],"display","none");	
				_objectManager.setPropertyIncludeChildren(menuHeadings[eachHeading]['hover'],"dragSelect","none");
				_objectManager.setPropertyIncludeChildren(menuHeadings[eachHeading]['normal'],"dragSelect","true");				
			}
		}			
		_elementsManager.selectElementById(_self.selectedMenu.properties.id);
	}
	/*
	 * makes the hover and normal headings identical in size and posiiton
	 */
	function makeHeadingsIdentical(mode){		
		var menuHeadings = getProperty("headings")
		for (eachHeading in menuHeadings)	{		
			if (mode == 'hover')
				changeHeading(menuHeadings[eachHeading]['hover'], menuHeadings[eachHeading]['normal'])
			else
				changeHeading(menuHeadings[eachHeading]['normal'], menuHeadings[eachHeading]['hover'])				
		}		
	}
	
	function changeHeading(heading, headingToChange){
		headingToChange.setPosition(heading.properties["holderDiv"].style.top,heading.properties["holderDiv"].style.left)
		headingToChange.setSize(heading.properties["holderDiv"].style.height,heading.properties["holderDiv"].style.width)
		headingTitle = _objectManager.findElementByProperty(heading,"subType","HeadingTitle");
		headingToChangeTitle = _objectManager.findElementByProperty(headingToChange,"subType","HeadingTitle");
		if(headingTitle != null && headingToChangeTitle != null)
			headingToChangeTitle.setPosition(headingTitle.properties["holderDiv"].style.top,headingTitle.properties["holderDiv"].style.left)
	}		
		
	this.toXML = function(){
		showHeadings("normal");
		setProperty("currentView", "normal");//make top layer visible
		/* used to set the background div to 0,0 when creating the HTML */
		var topPos  = getProperty('holderDiv').style.top;
		var leftPos = getProperty('holderDiv').style.left;
		var zIndex 	= getProperty('holderDiv').style.zIndex;
		if(zIndex =="")zIndex = 0;
		makeHeadingsIdentical(getProperty("currentView"));
		var dimensions = _objectManager.getProperDimensions(_self.selectedMenu)
		var xml = "<element>" ;
		xml+= xmlTag("type","menu");
		xml+= xmlTag("id",getProperty('id'));		
		xml+= xmlTag("top",dimensions['top'])
		xml+= xmlTag("left",dimensions['left'])
		xml+= xmlTag("height",dimensions['height'])
		xml+= xmlTag("width",dimensions['width']);
		xml+= xmlTag("zindex",zIndex);
		xml+= xmlTag("parentId",getProperty('parentId'));
		xml+= xmlTag("direction",getProperty('direction'));
		getProperty("menuBackgroundDiv").setPosition(0,0);
		getProperty("menuBackgroundDiv").properties['holderDiv'].style.zIndex = 0;		
		getProperty("menuBackgroundDiv").properties['parentId'] = getProperty('parentId');
		xml+= xmlTag("backgroundDiv",getProperty("menuBackgroundDiv").toXML());
		getProperty("menuBackgroundDiv").setPosition(topPos,leftPos);		
		getProperty("menuBackgroundDiv").properties['holderDiv'].style.zIndex = zIndex;
		var menuHeadings = getProperty("headings");
		for (eachHeading in menuHeadings)	{
			var headingXML = xmlTag("top",menuHeadings[eachHeading].properties['holderDiv'].style.top);
			headingXML += xmlTag("left",menuHeadings[eachHeading].properties['holderDiv'].style.left);
			
			headingXML += xmlTag("onmouseover",'_commonJS.rollHeading(this,"'+menuHeadings[eachHeading]["hover"].properties["id"]+'","' + menuHeadings[eachHeading]["normal"].properties["id"]+'")');
			headingXML += xmlTag("onmouseout",'_commonJS.rollHeading(this,"'+menuHeadings[eachHeading]["normal"].properties["id"]+'","' + menuHeadings[eachHeading]["hover"].properties["id"]+'")');
			
			headingXML += xmlTag("id",menuHeadings[eachHeading].properties['id'])
			headingXML += xmlTag("parentId",menuHeadings[eachHeading].properties['parentId'])
			headingXML += xmlTag("link","<![CDATA["+ menuHeadings[eachHeading].properties['link']+"]]>")
			var linkTarget = menuHeadings[eachHeading].properties['linkTarget'];
			if(linkTarget == undefined) linkTarget = "_parent";
			headingXML += xmlTag("linkTarget",linkTarget)
					
			_objectManager.setCursorForChildren(menuHeadings[eachHeading]['normal'],menuHeadings[eachHeading].properties['cursor']);
			_objectManager.setCursorForChildren(menuHeadings[eachHeading]['hover'],menuHeadings[eachHeading].properties['cursor']);
			
			headingXML += xmlTag("normal",menuHeadings[eachHeading]['normal'].toXML());
			headingXML += xmlTag("hover",menuHeadings[eachHeading]['hover'].toXML())			
			xml+= xmlTag("heading",headingXML);
		}
		xml += "</element>" ;
		return xml;
	}
	
	function xmlTag(tagName,tagData){return "<" + tagName +">" + tagData + "</" + tagName + ">"}
	
	this.loadMenu = function(id, parentId,topPos,leftPos,direction,zIndex){
		_self.selectedMenu = new MenuObject();
		setProperty("id", id);		
		setProperty("parentId", parentId);
		setProperty("direction", direction);
		setProperty("currentView", "normal");	
		var menuBackgroundDiv = _elementsManager.getElementFromElementsTable(id);
		
		/* this switching around of the id is used for when loading in a menu from the community that has the same id
		 * as a menu in the current page...it gets pretty tricky*/
		if(menuBackgroundDiv.properties.id != id){
			var oldId =  menuBackgroundDiv.properties.id;
			var newId = _objectManager.createId("menu");
			_objectManager.changeId(menuBackgroundDiv,newId);
			setProperty("id", newId);
			var elementsTable = _elementsManager.getElementsTable();
			delete elementsTable[oldId];
			_elementsManager.mapNewID(id, _self.selectedMenu)
		}
		menuBackgroundDiv.properties['holderDiv'].style.zIndex = zIndex;
		setProperty("bgColor", menuBackgroundDiv.properties['bgColor']);
		setProperty("menuBackgroundDiv", menuBackgroundDiv);
		setProperty("holderDiv", getProperty('menuBackgroundDiv').properties['holderDiv']);
		setProperty("bgImg", getProperty('menuBackgroundDiv').properties['bgImg']);
		setProperty("bgRepeat", getProperty('menuBackgroundDiv').properties['bgRepeat']);
		
		
		var parentElement =  _elementsManager.getElementFromElementsTable(menuBackgroundDiv.properties['parentId']);
		parentElement.properties['children'][menuBackgroundDiv.properties['id']] = _self.selectedMenu;
		_elementsManager.addToAllElementsTable(_self.selectedMenu);	
		
		if(_objectManager.needToHighlightElement(menuBackgroundDiv)){
			topPos=topPos-1;
			leftPos=leftPos-1;
		}
		_self.selectedMenu.unSelect();
		_self.selectedMenu.setPosition(topPos,leftPos);	
	}
	
	this.deleteHeading = function(headingId){
		var menuHeadings = getProperty("headings");
		if(menuHeadings != undefined){
			menuHeadings[headingId] = null;
			delete menuHeadings[headingId];
			var numHeadings = 0;
			for(eachHeading in menuHeadings)
				numHeadings++;	
			
			if(numHeadings == 0){
				var itemMenu = getProperty("itemMenu");
				itemMenu['toggleHeadings'] = null;
				itemMenu['previewMenu']= null;
				delete itemMenu['toggleHeadings'];
				delete itemMenu['previewMenu'];
			}
		}
	}
	
	this.loadHeading = function(topPos,leftPos,id,parentId,link){	
		var itemMenu = getProperty("itemMenu");
		itemMenu['toggleHeadings'] = 'toggleHeadings';
		itemMenu['previewMenu']= 'previewMenu';
		
		var menu = _elementsManager.getElementFromElementsTable(parentId)
		var menuHeadings = menu.properties["headings"];
		parentId = menu.properties.id;
		
		var heading = new Heading();
		/* create heding div */
		var headingDiv = document.createElement('div');
		_pm.setStyle(headingDiv,"position:absolute;top:"+ topPos +"; left:" + leftPos+";")
		
		if(_elementsManager.getElementFromElementsTable(id) != undefined)
		{
			_elementsManager.mapNewID(id, heading)
			id = _objectManager.createId("heading");
		}
		
		headingDiv.id = id;
		menu.properties["holderDiv"].appendChild(headingDiv);
		heading.properties['holderDiv'] = headingDiv;
		heading.properties['parentId'] =  parentId;
		heading.properties['id'] = id;
		heading.properties['link'] = link;
		heading.properties['dragSelect'] = "none";
		
		_elementsManager.addToAllElementsTable(heading);
		menuHeadings[heading.properties['id']] = heading;
	}
	this.assignHeadings = function(headingId,normalHeadingId,hoverHeadingId){
		var menuHeadings = getProperty("headings")
		id = _elementsManager.getElementFromElementsTable(headingId).properties.id;
		menuHeadings[id]['normal'] = _elementsManager.getElementFromElementsTable(normalHeadingId);
		menuHeadings[id]['hover'] = _elementsManager.getElementFromElementsTable(hoverHeadingId);
		menuHeadings[id]['hover'].properties['holderDiv'].style.display = 'none';
		_objectManager.setProperty(menuHeadings[id]['hover'],"display","none");
		_objectManager.setPropertyIncludeChildren(menuHeadings[id]['hover'],"dragSelect","none");
		 
	}
	this.previewMenu = function(){
		if(getProperty('preview') == 'on'){ _self.endPreviewMenu();}
		else{	
			setProperty('preview','on')
			makeHeadingsIdentical(getProperty("currentView"));;
			setProperty("currentView", "normal");
			showHeadings("normal");
			
			var menuHeadings = getProperty("headings");
			for (eachHeading in menuHeadings)	{
				menuHeadings[eachHeading].properties['holderDiv'].onmouseover = function(){var menu = _elementsManager.getElementFromElementsTable(this.parentNode.id);
																							   menu.properties['headings'][this.id]['hover'].properties["holderDiv"].style.display = 'block';
																							   menu.properties['headings'][this.id]['normal'].properties["holderDiv"].style.display = 'none';}
				menuHeadings[eachHeading].properties['holderDiv'].onmouseout  = function(){var menu = _elementsManager.getElementFromElementsTable(this.parentNode.id);
																							   menu.properties['headings'][this.id]['hover'].properties["holderDiv"].style.display = 'none';
																							   menu.properties['headings'][this.id]['normal'].properties["holderDiv"].style.display = 'block';}
			}
			var itemMenu = getProperty("itemMenu");
			for(eachItem in itemMenu){
				itemMenu[eachItem] = null;
				delete itemMenu[eachItem];
			}
			itemMenu['endPreview'] = "endPreview"
		}
		_elementsManager.selectElementById(_self.selectedMenu.properties.id);
	}
	
	this.endPreviewMenu = function(){
		setProperty('preview','off');
		var menuHeadings = getProperty("headings");
		for (eachHeading in menuHeadings){
			menuHeadings[eachHeading].properties['holderDiv'].onmouseover = "";
			menuHeadings[eachHeading].properties['holderDiv'].onmouseout  = "";
		}
		var itemMenu = getProperty("itemMenu");
		itemMenu['addHeading'] 		= 'addHeading';
		itemMenu['toggleHeadings']  = 'toggleHeadings';
		itemMenu['previewMenu']		= 'previewMenu';
		itemMenu["endPreview"] = null;
		delete itemMenu["endPreview"];
		_elementsManager.selectElementById(_self.selectedMenu.properties.id);
	}
	
	this.copyElement = function(){
		var copyFromMenu = _self.selectedMenu;
		var menuHeadings = copyFromMenu.properties["headings"];
		var newMenu = _self.createMenu("copy",copyFromMenu.properties['direction'],"","","","");
		newMenu.properties["itemMenu"] = _objectManager.cloneObject(copyFromMenu.properties['itemMenu']);
		newMenu.properties["toolkit"] = _objectManager.cloneObject(copyFromMenu.properties['toolkit']);
		// copy bg stuff
		var bgDiv = copyFromMenu.properties["menuBackgroundDiv"].copyElement();
		_elementsManager.removeFromAllElementsTable(bgDiv.properties['id'])
		registerBackgroundDiv(bgDiv)
		
		//copy headings
		var menuHeadings = copyFromMenu.properties["headings"];
		var newMenuHeadings = newMenu.properties["headings"];	
				
		for (eachHeading in menuHeadings)	{
			var newHeading = createNewHeading();
			newHeading.properties['holderDiv'].style.top = menuHeadings[eachHeading].properties['holderDiv'].style.top;
			newHeading.properties['holderDiv'].style.left = menuHeadings[eachHeading].properties['holderDiv'].style.left;
			newHeading['hover'] = menuHeadings[eachHeading]['hover'].copyElement();
			newHeading['normal'] = menuHeadings[eachHeading]['normal'].copyElement();
			
			_objectManager.addElement(newHeading,newHeading['hover'], true)
			_objectManager.addElement(newHeading,newHeading['normal'], true)
			newMenuHeadings[newHeading.properties['id']] = newHeading;
			
			newMenu.properties["children"][newHeading.properties["id"]] = newHeading;
			_objectManager.setProperty(newHeading['hover'],"display","none");
			_objectManager.setPropertyIncludeChildren(newHeading['hover'],"dragSelect","none");
			newHeading['hover'].properties["holderDiv"].style.display = "none";
			
			var newHeadingTitle = _objectManager.findElementByProperty(newHeading['normal'],"subType","HeadingTitle");
			var hoverHeadingTitle = _objectManager.findElementByProperty(newHeading['hover'],"subType","HeadingTitle");
			newHeadingTitle.properties['siblingId'] = hoverHeadingTitle.properties["id"];
			hoverHeadingTitle.properties['siblingId'] = newHeadingTitle.properties["id"];
		}
		return newMenu;
	}
	
	this.displaySubMenu = function(mode,menuElement){
		hideSubMenu();
		_self.selectedMenu = menuElement;
		var holderDiv = menuElement.properties["holderDiv"];
		var position = _utilities.findPos(holderDiv);
		var subMenu = document.getElementById("userMenuOptions_div");
		subMenu.style.top = position[1] + parseInt(holderDiv.style.height);
		subMenu.style.left = position[0];
		subMenu.style.display = "block";
		var itemProperties = menuElement.properties["itemMenu"]
		for(eachProperty in itemProperties){
			switch(eachProperty){
				case "addHeading": document.getElementById("userMenuAdd_div").style.display ="block"; break;
				case "toggleHeadings": document.getElementById("userMenuSwitch_div").style.display ="block"; break;
				case "previewMenu": document.getElementById("userMenuPreview_div").style.display ="block"; break;
				case "endPreview": document.getElementById("userMenuEnd_div").style.display ="block"; break;				
				default: break;
			}	
		}
		if(mode!="menu")document.getElementById("userMenuCopy_div").style.display ="block";
	}
	function hideSubMenu(){
		document.getElementById("userMenuAdd_div").style.display ="none";
		document.getElementById("userMenuSwitch_div").style.display ="none";
		document.getElementById("userMenuPreview_div").style.display ="none";
		document.getElementById("userMenuEnd_div").style.display ="none";	
		document.getElementById("userMenuCopy_div").style.display ="none";	
	}
	this.copyHeading = function(copyHeading){
		if(copyHeading!=null && copyHeading != undefined){
			if(_copyHeadings[copyHeading.properties["id"]] == undefined){
				var newHeading = createNewHeading(parseInt(copyHeading['normal'].properties["holderDiv"].style.height),parseInt(copyHeading['normal'].properties["holderDiv"].style.width));		
				newHeading['hover'] = copyHeading['hover'].copyElement();
				newHeading['normal'] = copyHeading['normal'].copyElement();
				newHeading['normal'].setPosition(0,0);
				newHeading['hover'].setPosition(0,0);
				_objectManager.addElement(newHeading,newHeading['hover'], true)
				_objectManager.addElement(newHeading,newHeading['normal'], true)
				_objectManager.setProperty(newHeading['hover'],"display","none");
				_objectManager.setPropertyIncludeChildren(newHeading['hover'],"dragSelect","none");
				newHeading['hover'].properties["holderDiv"].style.display = "none";
				var menuHeadings = getProperty("headings")
				menuHeadings[newHeading.properties['id']] = newHeading;
				
				var newHeadingTitle = _objectManager.findElementByProperty(newHeading['normal'],"subType","HeadingTitle");
				var hoverHeadingTitle = _objectManager.findElementByProperty(newHeading['hover'],"subType","HeadingTitle");
				if(newHeadingTitle !=null) newHeadingTitle.properties['siblingId'] = hoverHeadingTitle.properties["id"];
				if(hoverHeadingTitle !=null) hoverHeadingTitle.properties['siblingId'] = newHeadingTitle.properties["id"];
				_copyHeadings[copyHeading.properties["id"]]  = copyHeading;	
				newHeading.unSelect();			
			}
		}
	}
	
	this.clearCopyHeadings = function(){
		delete _copyHeadings;
		_copyHeadings = new Object();
	}
	
}