function websiteObject(){
	var _self = this;
	this.properties  = new Object();
	_self.properties['type'] = "website";
	_self.properties['id'] = "website";
	_self.properties['holderDiv'] = document.getElementById("websiteDiv");
	_self.properties['bgImg'] = "";
	_self.properties['bgRepeat'] = "";
	_self.properties['bgColor'] = "white";
	_self.properties['topMargin'] = 40;	
	
	this.select		   = function()				{return false};
	this.unSelect 	   = function()				{return false};
	this.endResize     = function()				{}
	this.startResize   = function()				{}
	this.resizeLeft	   = function()			{}
	this.resizeUp	   = function()				{}
	this.resizeDown    = function()			{}
	this.resizeRight   = function()				{}
	this.changeColor   = function(color)	{_siteSettings.setWebsiteBgColor(color)}
	this.setBGImage    = function(imageSrc,repeat){_siteSettings.setWebsiteBgImg(imageSrc,repeat)}
	this.getBGImage    = function()			{return	_self.properties['bgImg']} 
	this.getBGRepeat   = function()			{return _self.properties['bgRepeat']}
	this.removeBGImage = function()		{ _siteSettings.removeWebsiteBgImg()}
	this.toXML  = function()						{_siteSettings.createBGXML()}
}
function webpageObject(){
	var _self = this;
	this.mainPage = document.getElementById("mainPage");	
	this.properties  = new Object();
	_self.properties['children'] = new Object();
	_self.properties['id'] = "mainPage";
	_self.properties['type'] = "webPage";
	_self.properties['holderDiv'] = _self.mainPage;
	_self.properties['websiteDiv'] = document.getElementById("websiteDiv");
	_self.properties['alignment'] = "full";	
	_self.properties['width'] = 850;
	_self.properties['height'] = 800;
	_self.properties['bgImg'] = "";
	_self.properties['bgRepeat'] = "";
	_self.properties['bgColor'] = "white";
	_self.properties['borderObj'] = _objectManager.createBorderObj("1px solid black");
	_self.properties['bars'] = "s|se|e"
	
	this.select		   = function()				{return false};
	this.unSelect 	   = function()				{return false};
	this.startResize   = function()				{}
	this.resizeLeft	   = function()			{}
	this.resizeUp	   = function()				{}
	this.resizeDown    = function(differenceY)	{_siteSettings.resizeDown(differenceY)}
	this.resizeRight   = function(differenceX)	{_siteSettings.resizeRight(differenceX)}
	this.endResize     = function()				{_siteSettings.endResize(); _objectManager.endResize(_self); }
	this.changeColor   = function(color)	{_siteSettings.setBGColor(color)}
	this.changeBorder  = function(borderObj)	{_objectManager.changeBorder(_self.mainPage,borderObj); _self.properties['borderObj'] = borderObj; _siteSettings.changeBorder();};
	this.getBorder     = function()				{return _self.properties['borderWeight'] +" "+ _self.properties['borderStyle']+" "+ _self.properties['borderColor'];};
	this.setBGImage    = function(imageSrc,repeat)		{_siteSettings.setBGImage(imageSrc,repeat)}
	this.getBGImage    = function()			{return	_self.properties['mainPageBgImg']} 
	this.getBGRepeat   = function()			{return _self.properties['mainPageBgRepeat']}
	this.removeBGImage = function()		{ _siteSettings.removeBGImage()}
	this.collapseElement = function()		{_siteSettings.collapseMainPage();}
}
function footerObject(){
	var _self = this;
	this.footer = document.getElementById("mainPage_footer");	
	this.properties  = new Object();
	_self.properties['children'] = new Object();
	_self.properties['id'] = "mainPage_footer";
	_self.properties['type'] = "footer";
	_self.properties['holderDiv'] = _self.footer;
	_self.properties['bars'] = "n|s"
	init();
	function init(){
		_self.properties['holderDiv'].style.zIndex = 10;
		_self.properties['holderDiv'].onmousedown = function(e){if (!e) var e = window.event;
											_elementsManager.selectElement(this,e.ctrlKey);
											_dragSelect.startDragSelect(e);
											e.cancelBubble = true;} 
	}
	this.select		   = function()				{return false};
	this.unSelect 	   = function()				{return false};
	this.startResize   = function()				{}
	this.resizeLeft	   = function()			{}
	this.resizeDown    = function(differenceY)	{_siteSettings.resizeFooter("down",differenceY);}
	this.resizeUp    = function(differenceY)	{_siteSettings.resizeFooter("up",differenceY);}
	this.resizeRight   = function(differenceX)	{}
	this.endResize     = function()				{_siteSettings.endResizeFooter(); }	
	this.toXML = function()						{_siteSettings.footerToXML(); }
	this.appendTo      = function(parentObject)	{parentObject.appendChild(_self.properties["holderDiv"]);}
	this.changeBorder  = function(borderObj)	{_self.properties['borderObj'] = borderObj;_siteSettings.changeFooterBorder()};	
}

function SiteSettings(){
	var _self = this;
	var _webpage = new webpageObject();  //main page
	var _website = new websiteObject();  //div that surrounds the min page. only when site is centered
	var _footer = new footerObject();  //div that surrounds the min page. only when site is centered
	var _designers = new Object();
	var _h_marker = document.getElementById("horizontal_marker_div");
	var _h_marker_display = document.getElementById("h_marker_display");
	var _v_marker = document.getElementById("vertical_marker_div");
	var _v_marker_display = document.getElementById("v_marker_display");
	var _markerTop = 130;
	var _markerLeft = 180;
	var _leftRulerOffset = 0;
	var _topRulerOffset = 0;
	var _templateUsed = false;	
	
	var _toolkitOptions_page = new Object();
	_toolkitOptions_page['pageTitle'] = 'pageTitle';	
	_toolkitOptions_page['metaData'] = 'metaData';	
	_toolkitOptions_page['bgColor'] = 'bgColor';
	_toolkitOptions_page['border'] = 'border';
	_toolkitOptions_page['bgImg'] = 'bgImg';
	_toolkitOptions_page['siteDimensions'] = 'siteDimensions';
	_toolkitOptions_page['siteAlignment'] = 'siteAlignment';
	
	var _toolkitOptions_site = new Object();	
	_toolkitOptions_site['bgColor'] = 'bgColor';
	_toolkitOptions_site['bgImg'] = 'bgImg';
	_toolkitOptions_site['topMargin'] = 'topMargin';
	
	var _toolkitOptions_footer = new Object();
	_toolkitOptions_footer['border'] = 'border';
	
	var _itemMenuOptions = new Object()
	_itemMenuOptions['clearPage'] = 'clearPage';
	
	var _itemMenuOptions_site = new Object()
	_itemMenuOptions_site['addElement'] = 'addElement';
	
	var _itemMenuOptions_footer = new Object()
	_itemMenuOptions_footer['addElement'] = 'addElement';
	
	_website.properties['itemMenu'] = _itemMenuOptions_site;
	_webpage.properties['itemMenu'] = _itemMenuOptions;
	_footer.properties['itemMenu'] = _itemMenuOptions_footer;
	_webpage.properties['toolkit'] = _toolkitOptions_page;
	_website.properties['toolkit'] = _toolkitOptions_site;
	_footer.properties['toolkit'] = _toolkitOptions_footer;
	
	_elementsManager.addToAllElementsTable(_webpage);
	_elementsManager.addToAllElementsTable(_website);
	_objectManager.addElement(_webpage,_footer,true);
	
	this.templateUsed = function(option){
		_templateUsed = option;
		_toolkitOptions_page['pageTemplate'] = "pageTemplate";
		_toolkitOptions_site['pageTemplate'] = "pageTemplate";
		_toolkitOptions_footer['pageTemplate'] = "pageTemplate";
		delete _toolkitOptions_page['bgColor'];
		delete _toolkitOptions_page['border'];
		delete _toolkitOptions_page['bgImg'];
		delete _toolkitOptions_page['siteDimensions'];
		delete _toolkitOptions_page['siteAlignment'];
		delete _toolkitOptions_site['bgColor'];
		delete _toolkitOptions_site['bgImg'];
		delete _toolkitOptions_site['topMargin'];
		delete _toolkitOptions_footer['border'];
	}
	
	this.setAlignment = function(alignment){		
			_webpage.properties['alignment'] = alignment;
			setProperDimensions(alignment)
			_elementsManager.selectElementById("mainPage");
	}
	function setProperDimensions(alignment)	{
		var websiteDiv = _website.properties['holderDiv'];
		var mainPage = _webpage.properties['holderDiv'];
		var footer = _footer.properties['holderDiv'];
		
		if(alignment =="center"){
			websiteDiv.style.display = "block";
			mainPage.style.left = parseInt(websiteDiv.style.left) + 40;
			mainPage.style.top = parseInt(websiteDiv.style.top) + parseInt(_website.properties['topMargin']);
			websiteDiv.style.width = parseInt(mainPage.style.width) + 80;
			websiteDiv.style.height = parseInt(mainPage.style.height)+parseInt(_website.properties['topMargin'])*2;			
		}
		else{
			websiteDiv.style.display = "none";
			mainPage.style.left = parseInt(websiteDiv.style.left);
			mainPage.style.top = parseInt(websiteDiv.style.top);
		}
		footer.style.top = parseInt(mainPage.style.height) - (parseInt(footer.style.height));
		setRulerPosition();
	}
	
	this.setWebsiteBgImg = function(bgImg, repeat){						
		_website.properties['holderDiv'].style.backgroundImage = "url(" + bgImg + ")";
		_website.properties['holderDiv'].style.backgroundRepeat = repeat;
		_website.properties['bgImg'] = bgImg;
		_website.properties['bgRepeat'] = repeat;
	}
	
	this.setWebsiteBgColor = function(color)	{
		if(color == "old"){
			if(_website.properties['oldbgColor']!= undefined)color = _website.properties['oldbgColor'];
			else color = "#F1F1F1";
		}
		if(color!="transparent") _website.properties['oldbgColor'] = color;
		_website.properties['holderDiv'].style.background = color;		
		_website.properties['bgColor'] = color;	
		_self.setWebsiteBgImg(_website.properties['bgImg'],_website.properties['bgRepeat']);
	}
	
	this.getWebsiteBgImg = function(){return _website.properties['bgImg'];	}	
	this.getWebsiteBgRepeat = function(){return _website.properties['bgRepeat'];}
	
	this.removeWebsiteBgImg = function(){
		_website.properties['holderDiv'].style.backgroundImage = "";
		_website.properties['holderDiv'].style.backgroundRepeat = ""; 
		_website.properties['bgImg'] = "";
		_website.properties['bgRepeat'] = "";
	}
	this.footerToXML = function(){
		var xml = "<footer>"		
		xml+="<top>"+parseInt(_footer.footer.style.top)+"</top>";
		xml+="<height>"+parseInt(_footer.footer.style.height)+"</height>";
		xml+="<zIndex>"+parseInt(_footer.footer.style.zIndex)+"</zIndex>";
		xml+= xmlTag("border", _objectManager.borderToString(_footer.properties["borderObj"]));
		var children = _footer.properties["children"];
		for(eachChild in children){	xml+=children[eachChild].toXML();}
		xml += "</footer>"
		return xml;
	}
	this.loadFooter = function(height,border,zIndex){
		if(height!=undefined &&height!="")_footer.footer.style.height = height;
		if(zIndex!="" && zIndex!="undefined")_footer.footer.style.zIndex=zIndex;
		var borderObj = _objectManager.loadBorderObj(border);
		_footer.changeBorder(borderObj)
		_footer.endResize();		
	}
	this.createXML = function(){
		var xml = "<siteSettings>"
		var siteProperties = _webpage.properties; 
		xml+= xmlTag("alignment",_webpage.properties['alignment'])
		xml+= xmlTag("bgImg",_website.properties['bgImg'])
		xml+= xmlTag("bgRepeat",_website.properties['bgRepeat'])
		xml+= xmlTag("bgColor",_website.properties['bgColor'])
		xml+= xmlTag("topMargin",_website.properties['topMargin'])
		var pageTitle =_webpage.properties['pageTitle'];
		if(pageTitle == undefined) pageTitle =""; 
		xml+= xmlTag("pageTitle","<![CDATA[" +pageTitle+"]]>" )
		xml+= "<mainPage>"
			xml+= xmlTag("width",parseInt(_webpage.properties['width']))
			xml+= xmlTag("height",parseInt(_webpage.properties['height']))
			xml+= xmlTag("bgImg",_webpage.properties['bgImg'])
			xml+= xmlTag("bgRepeat",_webpage.properties['bgRepeat'])
			xml+= xmlTag("bgColor",_webpage.properties['bgColor'])
			xml+= xmlTag("border", _objectManager.borderToString(_webpage.properties["borderObj"]));
		xml+="</mainPage>"
		xml+= _metaData.toXML();
		xml += "</siteSettings>";	
		return xml;
	}
	this.createBGXML =function(){
		var xml="<background>";
		var elements = _website.properties.children;
		for(eachElement in elements){
			xml+=elements[eachElement].toXML();
		}
		xml+="</background>";
		return xml;
	}
		
	function xmlTag(tagName,tagData){return "<" + tagName +">" + tagData + "</" + tagName + ">"}
	
	this.loadSettings = function(alignment,height,width,bgImg,bgRepeat,bgColor,mainPageBgImg,mainPageBgRepeat,mainPageBgColor,border,topMargin,pageTitle)	{
		//do website stuff first
		_website.properties['topMargin'] = topMargin;
		_website.properties['bgImg'] = bgImg;
		_website.properties['bgRepeat'] = bgRepeat;
		if(_website.properties['height']==undefined)_website.properties['height'] = height;		
		_self.setAlignment(alignment);
		_self.setWebsiteBgColor(bgColor);
		
		//do page stuff next
		_self.changePageSize(parseInt(width),parseInt(_website.properties['height']));
		setProperDimensions(alignment)
		_webpage.properties['pageTitle'] = pageTitle;
		_webpage.properties['bgImg'] = mainPageBgImg;
		_webpage.properties['bgRepeat'] = mainPageBgRepeat;
		_webpage.changeColor(mainPageBgColor)
		_webpage.changeBorder(_objectManager.loadBorderObj(border));		

	}	
	this.changePageSize = function(width, height)	{
			_webpage.mainPage.style.width = width;
			_webpage.mainPage.style.height = height;
			if(width == 800 && height == 600)
				document.getElementById("SS8x6").checked = true;
			else if(width == 1024 && height == 768)
				document.getElementById("SS1x7").checked = true;
			else{
				document.getElementById("SS8x6").checked = false;
				document.getElementById("SS1x7").checked = false;
			}
			document.getElementById("ssWidth").value = width;
			document.getElementById("ssHeight").value = height;
			_webpage.endResize();
	}
	this.resizeDown = function(differenceY){    
    	if(parseInt(_webpage.mainPage.style.height) + differenceY > 1)	
        	_webpage.mainPage.style.height = parseInt(_webpage.mainPage.style.height) + differenceY;
    }    
    this.resizeRight = function(differenceX){
    	if(!_templateUsed){
	    	if(parseInt(_webpage.mainPage.style.width) + differenceX > 1)
	        	_webpage.mainPage.style.width = parseInt(_webpage.mainPage.style.width) + differenceX;
    	}	
    }
    this.resizeFooter = function(direction,differenceY){
    	if(!_templateUsed){
	    	_footer.footer.style.background = "#B8B8B8";
	    	if(direction =="down")_resizeManager.resizeDown(_footer.footer,differenceY);
	    	if(direction =="up")_resizeManager.resizeUp(_footer.footer,differenceY);
    	} 
    }
	this.endResize = function() {  
		_footer.footer.style.background = "transparent";  	
   	   _webpage.properties['width'] = parseInt(_webpage.mainPage.style.width);
       _webpage.properties['height'] = parseInt(_webpage.mainPage.style.height);             
       setProperDimensions(_webpage.properties['alignment']);
       var bottomSpacerDiv = document.getElementById("bottom_spacer_div");
       if(bottomSpacerDiv!= null && bottomSpacerDiv!= undefined)
       		bottomSpacerDiv.style.top = _webpage.properties['height'] + 170;
       	_elementsManager.showItemMenu();
       	_self.setRuler();
    }
    this.endResizeFooter = function(){
    	_footer.footer.style.background = "transparent";
    	if(parseInt(_footer.footer.style.top) + parseInt(_footer.footer.style.height)>parseInt(_webpage.mainPage.style.height)){
    		_webpage.properties['height'] = parseInt(_footer.footer.style.top) + parseInt(_footer.footer.style.height); 
    		_webpage.mainPage.style.height = parseInt(_footer.footer.style.top) + parseInt(_footer.footer.style.height);
    	}
    	setProperDimensions(_webpage.properties['alignment']);
    	_self.setRuler();
    }   
	this.setBGColor = function(color){
		if(color == "old"){
			if(_webpage.properties['oldbgColor']!= undefined)color = _webpage.properties['oldbgColor'];
			else color = "#F1F1F1";
		}
		if(color!="transparent") _webpage.properties['oldbgColor'] = color;
		_webpage.mainPage.style.background = color;
		_webpage.properties['bgColor'] = color;
		_self.setBGImage(_webpage.properties['bgImg'], _webpage.properties['bgRepeat']);
	}
	
	this.changeBorder = function(){
		// this is to highlight the page if no border is present.
		if(_objectManager.noBorderPresent(_webpage)){
			_webpage.mainPage.style.border = "1px dashed #B8B8B8"
		}
	}	
	this.changeFooterBorder = function(){
		_objectManager.changeBorder(_footer.footer,_footer.properties["borderObj"]);
		if(_objectManager.noBorderPresent(_footer)){
			_footer.footer.style.borderTop = "1px dotted #B8B8B8"
		}
	}
	this.setBGImage = function(bgImg, repeat){		
		_webpage.mainPage.style.backgroundImage = "url("+ bgImg +")"; 
		_webpage.mainPage.style.backgroundRepeat = repeat;
		_webpage.properties['bgImg'] = bgImg;
		_webpage.properties['bgRepeat'] = repeat;					
	}
	
	this.removeBGImage = function(){
		_webpage.mainPage.style.backgroundImage = ""; 
		_webpage.properties['bgImg'] = "";
		_webpage.properties['bgRepeat'] = "";	
	}
	this.setTopMargin = function(topMargin){
		if(parseInt(topMargin)>= 0){
			_webpage.properties['holderDiv'].style.top = parseInt(_website.properties['holderDiv'].style.top) + parseInt(topMargin);
			_website.properties['topMargin'] = parseInt(topMargin);
			setProperDimensions(_webpage.properties['alignment'])
		}	
	}
	this.collapseMainPage = function(){
		_webpage.properties.holderDiv.style.display = "none";
		var topPos = parseInt(_webpage.properties.holderDiv.style.top);
		var leftPos = parseInt(_webpage.properties.holderDiv.style.left);
		var div = document.createElement("div");
		div.id = "collapseMainPage_div";
		div.onclick = function(){_siteSettings.expandMainPage()};
		_pm.setStyle(div,"position:absolute; top:"+topPos+"; left:"+leftPos+";cursor:pointer;width:53; height:58;backgroundimage:work/WebsiteEditor/Images/itemMenu/pageIcon.gif;");
		document.body.appendChild(div);
		_elementsManager.selectElementById("website");
	}
	this.expandMainPage = function(){
		var div = document.getElementById("collapseMainPage_div");
		div.parentNode.removeChild(div);
		_webpage.properties.holderDiv.style.display = "block";
		_elementsManager.selectElementById("mainPage");
	}
	this.loadDesigner = function(designer,link){
		_designers[designer] = link;
	}
	this.getDesigners = function(){
		var designersXML = "";
		for(eachDesigner in _designers){
			designersXML +="<designer>";
			designersXML +="<name>"+eachDesigner+"</name>";
			designersXML +="<link>"+_designers[eachDesigner]+"</link>";
			designersXML +="</designer>";
		}
		if(designersXML!="")return "<designers>"+designersXML+"</designers>";
		else return "";
	}
	this.setPageTitle = function(title){_webpage.properties['pageTitle'] = title;}
	this.getPageTitle = function(){
		var pageTitle =_webpage.properties['pageTitle'];
		if(pageTitle == undefined) pageTitle =""; 
		return pageTitle
	}
	this.setRuler = function(){
		var h_ruler = document.getElementById("horizontal_marker_holder");
		var v_ruler = document.getElementById("vertical_marker_holder");
		var h_resize_marker = document.getElementById("h_ruler_resize");
		var v_resize_marker = document.getElementById("v_ruler_resize");
		h_ruler.innerHTML = "";
		v_ruler.innerHTML = "";
		var  width = parseInt(_webpage.properties['width']);
		var  height = parseInt(_webpage.properties['height']);
		h_ruler.style.width = width;
		h_resize_marker.style.left = width;
		v_resize_marker.style.top = height;
		for(i=0; i < Math.floor(width/100); i++)
			h_ruler.appendChild(makeMarker((i+1)*100,(i*100) +88,0));
		
		v_ruler.style.height = height;
		for(i=0; i < Math.floor(height/100); i++)
			v_ruler.appendChild(makeMarker((i+1)*100,-5,(i*100) +93));
		
	}
	function makeMarker(title,leftPos,topPos){
		var div = document.createElement("div");
		div.align = "center";
		div.innerHTML = title;
		_pm.setStyle(div,"position:absolute;left:"+leftPos+";top:"+topPos+";width:22;height:11;background:#FFFFFF;border:1px solid #B8B8B8;font-size:8px;")
		return div;
	}
	
	//this is to show the top,left position when moving an element
	this.setRulerOffset = function(e){
		if (!e) var e = window.event;
		var element = _elementsManager.getCurrentElement();
		var absPosition = _objectManager.getAbsolutePosition(element);
		_topRulerOffset = ((e.clientY - (_markerTop +1)) - absPosition['top']) +  parseInt(document.body.scrollTop);
		_leftRulerOffset = ((e.clientX - (_markerLeft + 1)) - absPosition['left']) +  parseInt(document.body.scrollLeft);
	}
	
	this.removeRulerOffset =function(){
		_topRulerOffset = 0;
		_leftRulerOffset = 0;
	}
	this.showRulerPosition = function(e){
		if (!e) var e = window.event;
		var bodyScrollTop = parseInt(document.body.scrollTop);
		var bodyScrollLeft = parseInt(document.body.scrollLeft);
		var leftPos = Math.max(0, (e.clientX - (_markerLeft + 1) - _leftRulerOffset) + bodyScrollLeft);
		_h_marker.style.left = leftPos;
		_h_marker_display.style.left = leftPos - 11;
		_h_marker_display.innerHTML = leftPos;
		
		var topPos = Math.max(0, (e.clientY - (_markerTop +1) - _topRulerOffset)  + bodyScrollTop);
		_v_marker.style.top = topPos;
		_v_marker_display.style.top = topPos - 8;
		_v_marker_display.innerHTML = topPos;	
	}
	function setRulerPosition(){
		var h_ruler = document.getElementById("ruler_horizontal_div");
		var v_ruler = document.getElementById("ruler_vertical_div");
		var topPos = parseInt(_webpage.properties['holderDiv'].style.top);
		var leftPos = parseInt(_webpage.properties['holderDiv'].style.left);
		
		if( _webpage.properties['alignment'] == "center"){
			topPos = parseInt(_website.properties['holderDiv'].style.top) + parseInt(_website.properties['topMargin']);
			leftPos = parseInt(_website.properties['holderDiv'].style.left) + 40;							
		}
		_markerTop =topPos;
		_markerLeft = leftPos;
		v_ruler.style.top = topPos;
		h_ruler.style.left = leftPos;	
	}
	var _oldMouseX = 0;
    var _oldMouseY = 0;
    var _direction = "e";
	
	this.resizePageDownRight = function(e,direction){
		if (!e) e = window.event;
		var bodyScrollTop = parseInt(document.body.scrollTop);
		var bodyScrollLeft = parseInt(document.body.scrollLeft);
		var holderDiv = _webpage.properties["holderDiv"];
		_topRulerOffset = e.clientY - (parseInt(holderDiv.style.height) + parseInt(holderDiv.style.top))+ bodyScrollTop;
		_leftRulerOffset = e.clientX - (parseInt(holderDiv.style.width)+ parseInt(holderDiv.style.left)) + bodyScrollLeft;
		
		_oldMouseX = e.clientX;
       _oldMouseY = e.clientY;
       _direction = direction;
       document.onmousemove = resizePage;
       document.onmouseup = endResizePage;
	}
	
	function resizePage(e){
		if (!e) e = window.event;
		switch(_direction){
			case "right": _webpage.resizeRight(e.clientX - _oldMouseX);break;
			case "down": _webpage.resizeDown(e.clientY - _oldMouseY);break;
			default: break;
		}
		_oldMouseX = e.clientX;
	   _oldMouseY = e.clientY;
	}
	function endResizePage(){
		document.onmousemove    	= null;
		document.onmouseup      	= null;
		_self.removeRulerOffset();
		 _webpage.endResize();
	}
	var _showRuler = true;
	this.displayRuler = function(){
		if(_showRuler){
			document.getElementById("ruler_horizontal_div").style.display = "block";
			document.getElementById("ruler_vertical_div").style.display = "block";
			document.getElementById("show_ruler_div").innerHTML = "Hide Ruler";
			setMouseEvents(true);
			_self.hideRulerOptions();
		}else{
			hideRuler();
		}
		_showRuler = !_showRuler;
	}
	function hideRuler(){
		document.getElementById("ruler_horizontal_div").style.display = "none";
		document.getElementById("ruler_vertical_div").style.display = "none";
		document.getElementById("show_ruler_div").innerHTML = "Show Ruler";
		setMouseEvents(false);
		_self.hideRulerOptions();
	}
	
	this.displayRulerOptions = function(){
		document.getElementById("ruler_options_menu").style.display = "block";
	}
	this.hideRulerOptions = function(){
		document.getElementById("ruler_options_menu").style.display = "none";
	}
	
	function setMouseEvents(option){
		if(option){
			if(document.addEventListener != undefined)document.addEventListener('mousemove',rulerPosition,false)
			if(document.attachEvent != undefined)document.attachEvent('onmousemove',rulerPosition)
		}else{
			if(document.addEventListener != undefined)document.removeEventListener('mousemove',rulerPosition,false)
			if(document.attachEvent != undefined)document.detachEvent('onmousemove',rulerPosition)
		}
	}
	function rulerPosition(e){_siteSettings.showRulerPosition(e);}
	
	this.checkPageOverflow = function(elements){
		var page = _webpage.properties["holderDiv"];
		for (eachElement in elements){
			var type = elements[eachElement].properties["type"];
			if(type != "webPage" && type !="website" && type !="footer"){
				var pageHeight = parseInt(page.style.height) - parseInt(_footer.footer.style.height);
				var pageWidth = parseInt(page.style.width);
				var elementDiv = elements[eachElement].properties["holderDiv"]
				var topPos =  parseInt(elementDiv.style.top);
				var height = parseInt(elementDiv.offsetHeight);			
				if((topPos + height) > pageHeight){
					page.style.height = pageHeight + ((topPos + height) - pageHeight)+parseInt(_footer.footer.style.height) + 20;
					_webpage.endResize();
				}
				if (!_templateUsed){
					var leftPos =  parseInt(elementDiv.style.left);
					var width = parseInt(elementDiv.offsetWidth);			
					if((leftPos + width) > pageWidth){
						page.style.width = pageWidth + ((leftPos + width) - pageWidth) + 20;
						_webpage.endResize();
					}
				}
			}
		}
	}
}