// GET PROPERTY
	function getIdProperty(id,property) {
		var styleObject = document.getElementById( id );
		if (styleObject != null) {
			styleObject = styleObject.style;
				if (styleObject[property]) {
					return styleObject[ property ];
				}
			}
		return (styleObject != null) ?
		styleObject[property] :
		null;
	}

// SET PROPERTY
	function setIdProperty(id,property,value) {
		var styleObject = document.getElementById(id);
		if (styleObject != null) {
			styleObject = styleObject.style;
			styleObject[ property ] = value;
		}
	}

// DISPLAY VALUE FOR LAYERS
	function switchDisplay(id,formele) {
		thisState = getFormValue(formele);
		if (thisState == 1) {
			setIdProperty(id,"display",'block');
		} else {
			setIdProperty(id,"display",'none');
		}
	}
	
	function switchDisplayHard(id,formele,sta) {
		if (sta == "on") {
			document.getElementById(formele).value = "1";
			setIdProperty(id,"display",'block');
		} else {
			document.getElementById(formele).value = "0";
			setIdProperty(id,"display",'none');
		}
	}

// GET FORM VALUE
	function getFormValue(id) {
		tempV = document.getElementById(id);
		return tempV.value;
	}
	
	function getCheckValue(id) {
		tempV = document.getElementById(id);
		return tempV.checked;
	}
	
	function getColorValue(id) {
		tempV = document.getElementById(id);
		if (tempV.value == "transparent") {
			return tempV.value;
		} else {
			return "#"+tempV.value;
		}
	}
	
// REWRITE TEXT LAYER
	function rwt(txt, id) {
		txt += "\n";
		document.all[id].innerHTML = txt;
	}
	
// COLOR PICKER 
	vars = new Object();
	vars.which = "nothing";
	vars.num = "0";
	vars.defcolor = "";

	function showColorTable(loc,id,num,defcolor) {
		tableEl = document.getElementById(loc);
		var x = getAbsoluteX(tableEl);
		var y = getAbsoluteY(tableEl);
		var x = x+90;
		var y = y;

		var menuEl = document.getElementById("colorstable");
		menuEl.style.left = x + "px";
		menuEl.style.top = y + "px";
		vars.which = id;
		vars.num = num;
		vars.defcolor = defcolor;
		
		var tempval=document.getElementById("colorstable")
		tempval.style.display = "inline";
	}

	function showColorTableNOIE(loc,id,num,defcolor) {
		tableEl = document.getElementById(loc);
		var x = getAbsoluteX(tableEl);
		var y = getAbsoluteY(tableEl);
		var x = x-266;
		var y = y-10;

		var menuEl = document.getElementById("colorstable");
		menuEl.style.left = x + "px";
		menuEl.style.top = y + "px";
		vars.which = id;
		vars.num = num;
		vars.defcolor = defcolor;
		
		var tempval=document.getElementById("colorstable")
		tempval.style.display = "inline";
	}
	
	function hideColorTable() {
		setIdProperty('colorstable',"display",'none');
	}
	
	function colorchoose(thisColor) {
		tempV = document.getElementById(vars.which);
		colorObj = document.getElementById("cshow"+vars.num);
		if (thisColor == "transparent") {
			colorObj.style.background = thisColor;
			tempV.value = thisColor;
		} else if (thisColor == "default") {
			colorObj.style.background = vars.defcolor;
			tempV.value = vars.defcolor;
		} else if (thisColor == "nochange") {
			
		} else {
			colorObj.style.background = "#"+thisColor;
			tempV.value = thisColor;
		}
	}
	
	function getAbsoluteX (elm) {
		var x = 0;
		if (elm && typeof elm.offsetParent != "undefined") {
			while (elm && typeof elm.offsetLeft == "number") {
				x += elm.offsetLeft;
				elm = elm.offsetParent;
			}
		}
		return x;
	}
	
	function getAbsoluteY (elm) {
		var y = 0;
		if (elm && typeof elm.offsetParent != "undefined") {
			while (elm && typeof elm.offsetTop == "number") {
				y += elm.offsetTop;
				elm = elm.offsetParent;
			}
		}
		return y;
	}

// IE TRANSPARENT BORDER
	function ieBorderHack(id) {
		var thisVal = getFormValue(id);
		if (thisVal == "transparent") {
			return "transparent; border:0px";
		} else {
			return "#"+thisVal;
		}
	}

// AUTO UPDATE TEXTFIELD
	function autoUpdate(id,num) {
		tempField = document.getElementById(id);
		tempFieldVal = tempField.value;
		colorObj = document.getElementById("cshow"+num);
		if (tempFieldVal == "transparent") {
			colorObj.style.background = tempFieldVal;
		} else {
			colorObj.style.background = "#"+tempFieldVal;
		}
	}	

// GLOBAL VARIABLES
	updTextSize = false;
	updTextColor = false;
	updLinkSize = false;
	updLinkColor = false;
	updLinkBg = false;
	updLinkHoverSize = false;
	updLinkHoverColor = false;
	updLinkHoverBg = false;
	
	updBoxMyProfile = false;
	updBoxMoreAbout = false;
	updBoxMyBlog = false;
	updBoxMyTestimonials = false;
	updBoxMyFriends = false;
	updBoxRss = false;
	updBoxNavBar = false;
	updBoxFooter = false;
	
	updDate = false;
	updSeeall = false;
	
	chMasterBg = false;
	
	masUserMode = "advanced";
	masBodyFont = "";
	
	masTextSize = "";
	masTextSizeHack = "";
	masTextColor = "";
	masTextColorHack = "";
	masTextBo = "";
	masTextIt = "";
	
	masLinkSize = "";
	masLinkColor = "";
	masLinkBo = "";
	masLinkUl = "";
	masLinkIt = "";
	masLinkBg = "";
	
	masLinkHoverSize = "";
	masLinkHoverColor = "";
	masLinkHoverBo = "";
	masLinkHoverUl = "";
	masLinkHoverIt = "";
	masLinkHoverBg = "";
	
	
	masTextTr = "";
	masLinkTr = "";
	masHeadFont = "";
	masHeadColor = "";
	masHeadTr = "";
	masHeadBgColor = "";
	masBoxBgColor = "";
	masBoxBorderColor = "";
	masBoxBorderSize = "";
	masBoxBorderStyle = "";
	testiEvenRowBgColor = "";
	photoBlocksBgColor = "";
	photoBlocksBorderSize = "";
	photoBlocksBorderColor = "";
	photoBlocksBorderStyle = "";
	friendsNameBgColor = "";
	primaryPhotoBorderColor = "";
	primaryPhotoBorderStyle = "";
	dataLabelsColor = "";
	dataLabelsTr = "";
	buttonsTextColor = "";
	buttonsBorderColor = "";
	buttonsBorderStyle = "";
	buttonsBgColor = "";
	buttonsTextHoverColor = "";
	buttonsBorderHoverColor = "";
	buttonsBgHoverColor = "";
	
	chAllBoxTrans = false;

// FUNCTIONS
	function generateCode() {
// reset variables	
		updTextSize = false;
		updTextColor = false;
		updLinkSize = false;
		updLinkColor = false;
		updLinkBg = false;
		updLinkHoverSize = false;
		updLinkHoverColor = false;
		updLinkHoverBg = false;
		
		updBoxMyProfile = false;
		updBoxMoreAbout = false;
		updBoxMyBlog = false;
		updBoxMyTestimonials = false;
		updBoxMyFriends = false;
		updBoxRss = false;
		updBoxNavBar = false;
		updBoxFooter = false;
		
		updDate = false;
		updSeeall = false;
		
		chMasterBg = false;
		
		masUserMode = "advanced";
		masBodyFont = "";
		
		masTextSize = "";
		masTextSizeHack = "";
		masTextColor = "";
		masTextColorHack = "";
		masTextBo = "";
		masTextIt = "";
		
		masLinkSize = "";
		masLinkColor = "";
		masLinkBo = "";
		masLinkUl = "";
		masLinkIt = "";
		masLinkBg = "";
		
		masLinkHoverSize = "";
		masLinkHoverColor = "";
		masLinkHoverBo = "";
		masLinkHoverUl = "";
		masLinkHoverIt = "";
		masLinkHoverBg = "";
		
		
		masTextTr = "";
		masLinkTr = "";
		masHeadFont = "";
		masHeadColor = "";
		masHeadTr = "";
		masHeadBgColor = "";
		masBoxBgColor = "";
		masBoxBorderColor = "";
		masBoxBorderSize = "";
		masBoxBorderStyle = "";
		testiEvenRowBgColor = "";
		photoBlocksBgColor = "";
		photoBlocksBorderSize = "";
		photoBlocksBorderColor = "";
		photoBlocksBorderStyle = "";
		friendsNameBgColor = "";
		primaryPhotoBorderColor = "";
		primaryPhotoBorderStyle = "";
		dataLabelsColor = "";
		dataLabelsTr = "";
		buttonsTextColor = "";
		buttonsBorderColor = "";
		buttonsBorderStyle = "";
		buttonsBgColor = "";
		buttonsTextHoverColor = "";
		buttonsBorderHoverColor = "";
		buttonsBgHoverColor = "";
		
	
		chAllBoxTrans = false;
	
		masCodeComments = true;
/* get all boxes transparent value		
		if (getCheckValue("super_tabletrans")) {
			chAllBoxTrans = true;
		}*/
// body font
		temBodyFont = getFormValue("mainfont");
		if (temBodyFont == "default") {
			masBodyFont = "Arial, Sans-serif";
		} else if (temBodyFont == "sansserif") {
			masBodyFont =	"Verdana, Arial, Helvetica, sans-serif";
		} else if (temBodyFont == "serif") {
			masBodyFont = "Georgia, Times New Roman, Times, serif";
		} else if (temBodyFont == "monospace") {
			masBodyFont = "Courier New, Courier, Monaco, monospace";
		} else if (temBodyFont == "comic") {
			masBodyFont = "Comic Sans MS, Geneva, Helvetica, sans-serif";
		} else if (temBodyFont == "arial") {
			masBodyFont =	"Arial, Geneva, Helvetica, sans-serif";
		} else if (temBodyFont == "helvetica") {
			masBodyFont = "Helvetica, Geneva, Arial, SunSans-Regular, sans-serif";
		} else if (temBodyFont == "trebuchet") {
			masBodyFont = "Trebuchet MS, Geneva, Arial, Helvetica, SunSans-Regular, sans-serif";
		} else {
			masBodyFont = "Arial, Sans-serif";
		}
// links font
		temLinksFont = getFormValue("linksfont");
		if (temLinksFont == "default") {
			masLinkFont = "Arial, Sans-serif";
		} else if (temLinksFont == "sansserif") {
			masLinkFont =	"Verdana, Arial, Helvetica, sans-serif";
		} else if (temLinksFont == "serif") {
			masLinkFont = "Georgia, Times New Roman, Times, serif";
		} else if (temLinksFont == "monospace") {
			masLinkFont = "Courier New, Courier, Monaco, monospace";
		} else if (temLinksFont == "comic") {
			masLinkFont = "Comic Sans MS, Geneva, Helvetica, sans-serif";
		} else if (temLinksFont == "arial") {
			masLinkFont =	"Arial, Geneva, Helvetica, sans-serif";
		} else if (temLinksFont == "helvetica") {
			masLinkFont = "Helvetica, Geneva, Arial, SunSans-Regular, sans-serif";
		} else if (temLinksFont == "trebuchet") {
			masLinkFont = "Trebuchet MS, Geneva, Arial, Helvetica, SunSans-Regular, sans-serif";
		} else {
			masLinkFont = "Arial, Sans-serif";
		}		
// header font
		temHeadFont = getFormValue("headerfont");
		if (temHeadFont == "default") {
			masHeadFont = "Arial, Sans-serif";
		} else if (temHeadFont == "sansserif") {
			masHeadFont =	"Verdana, Arial, Helvetica, sans-serif";
		} else if (temHeadFont == "serif") {
			masHeadFont = "Georgia, Times New Roman, Times, serif";
		} else if (temHeadFont == "monospace") {
			masHeadFont = "Courier New, Courier, Monaco, monospace";
		} else if (temHeadFont == "comic") {
			masHeadFont = "Comic Sans MS, Geneva, Helvetica, sans-serif";
		} else if (temHeadFont == "arial") {
			masHeadFont =	"Arial, Geneva, Helvetica, sans-serif";
		} else if (temHeadFont == "helvetica") {
			masHeadFont = "Helvetica, Geneva, Arial, SunSans-Regular, sans-serif";
		} else if (temHeadFont == "trebuchet") {
			masHeadFont = "Trebuchet MS, Geneva, Arial, Helvetica, SunSans-Regular, sans-serif";
		} else {
			masHeadFont = "Arial, Sans-serif";
		}
		
// buttons font
		temBtnFont = getFormValue("buttonsfont");
		if (temBtnFont == "default") {
			masBtnFont = "Arial, Sans-serif";
		} else if (temBtnFont == "sansserif") {
			masBtnFont =	"Verdana, Arial, Helvetica, sans-serif";
		} else if (temBtnFont == "serif") {
			masBtnFont = "Georgia, Times New Roman, Times, serif";
		} else if (temBtnFont == "monospace") {
			masBtnFont = "Courier New, Courier, Monaco, monospace";
		} else if (temBtnFont == "comic") {
			masBtnFont = "Comic Sans MS, Geneva, Helvetica, sans-serif";
		} else if (temBtnFont == "arial") {
			masBtnFont =	"Arial, Geneva, Helvetica, sans-serif";
		} else if (temBtnFont == "helvetica") {
			masBtnFont = "Helvetica, Geneva, Arial, SunSans-Regular, sans-serif";
		} else if (temBtnFont == "trebuchet") {
			masBtnFont = "Trebuchet MS, Geneva, Arial, Helvetica, SunSans-Regular, sans-serif";
		} else {
			masBtnFont = "Arial, Sans-serif";
		}		
		
// reset code
		sGeneratedCode = "";
		
// CHECK FOR MASTER TEXT CHANGES
		
			updTextColor = true;
		
		
// CHECK FOR MASTER LINK CHANGES
		
			updLinkColor = true;
		
				
// CHECK FOR MASTER LINK HOVER CHANGES
		
			updLinkHoverColor = true;
		
				
// CHECK FOR MASTER BACKGROUND CHANGES
		
			chMasterBg = true;
		

updTextColor = true;
updLinkColor = true;
updLinkHoverColor = true;
chMasterBg = true;
		
		
// START WRITING CODE
		
// PROFILE BACKGROUND 
		if (chMasterBg) {
			if ((getFormValue("bgimageurl")) != "") {
				sValue = getFormValue("bgimageurl");
				sLength = getFormValue("bgimageurl").length;
				if ((sValue == '') || (sValue == 'http://') || (sValue.indexOf(".") == -1) || (sLength < 4)) {
					// not a valid image url
					sBodyBgimage = "";
					sBodyBgtile = "";
					sBodyBgpos = "";
					sBodyBgattach = "";
				} else {
					sBodyBgimage = "background-image:url("+sValue+"); ";
					sBodyBgpos = "background-position:"+getFormValue("bgposition")+"; ";
					sBodyBgtile = "background-repeat:"+getFormValue("bgtiling")+"; ";
					sBodyBgattach = "background-attachment:"+getFormValue("bgattachment")+"; ";				
				}
			} else {
				sBodyBgimage = "";
				sBodyBgtile = "";
				sBodyBgpos = "";
				sBodyBgattach = "";
			}
			if (masCodeComments) {
				sGeneratedCode = sGeneratedCode + "\r" + "/* PROFILE BACKGROUND */" + "\r";
			}
			sGeneratedCode = sGeneratedCode + "body { "+sBodyBgimage+sBodyBgattach+sBodyBgpos+sBodyBgtile+"background-color:"+getColorValue("bgcolor")+"; }" + "\r";
		}
		
// GLOBAL FONTS
		if ( (updTextColor)) {
			
			if (updTextColor) {
				masTextColor = "color:"+getColorValue("maintextcolor")+"; ";
				masTextColorHack = "color:"+getColorValue("maintextcolor")+" !important; ";
			}
			
				masTextTr = "text-transform:"+getFormValue("maintexttransform")+"; ";
			
			if (masCodeComments) {
				sGeneratedCode = sGeneratedCode + "\r" + "/* GLOBAL FONTS */" + "\r";
			}
			sGeneratedCode = sGeneratedCode + ".usercontent { font-family:"+masBodyFont+"; "+masTextColor+masTextTr+"}" + "\r";
		}
		
// GLOBAL LINK
		if (updLinkColor) {
			if (updLinkColor) {
				masLinkColor = "color:"+getColorValue("mainlinkcolor")+"; ";
			                          }
			
				masLinkTr = "text-transform:"+getFormValue("mainlinktransform")+"; ";
			
			if (masCodeComments) {
				sGeneratedCode = sGeneratedCode + "\r" + "/* GLOBAL LINKS */" + "\r";
			}
			masLinkUl = "text-decoration:"+getFormValue("mainlinkunderline")+"; ";					
			sGeneratedCode = sGeneratedCode + ".usercontent a, .usercontent a:link, .usercontent a:visited, .usercontent a:active { "+masLinkUl+masLinkColor+"}" + "\r";
			sGeneratedCode = sGeneratedCode + ".data a, a.more, .commonbox .viewall { font-family:"+masLinkFont+"; "+masLinkColor+masLinkTr+"} \r";
		}

// GLOBAL LINK HOVER (UPDATES AUTOMATICALLY IF GLOBAL LINK HAS BEEN UPDATED)
		if ( (updLinkColor) || (updLinkHoverColor) ) {
			if (updLinkHoverColor) {
				masLinkHoverColor = "color:"+getColorValue("mainlinkhovercolor")+"; ";
			}
			masLinkHoverUl = "text-decoration:"+getFormValue("mainlinkhoverunderline")+"; ";			
			sGeneratedCode = sGeneratedCode + ".usercontent a:hover { "+masLinkHoverUl+masLinkHoverColor+"}" + "\r";
		}
		
// GLOBAL HEADERS
		
			
				masHeadColor = "color:"+getColorValue("mainlargeheadcolor")+"; ";
			
			
				masHeadTr = "text-transform:"+getFormValue("mainheadtransform")+"; ";
			
			
				masHeadBgColor = "background-color:"+getColorValue("mainlargeheadbgcolor")+"; ";
			
			
			if (masCodeComments) {
				sGeneratedCode = sGeneratedCode + "\r" + "/* GLOBAL HEADERS */" + "\r";
			}
			sGeneratedCode = sGeneratedCode + ".commonbox h1, .commonbox h2 { font-family:"+masHeadFont+"; "+masHeadColor+masHeadTr+masHeadBgColor+"}" + "\r";
		
		
// GLOBAL BOXES
	
			
				masBoxBgColor = "background-color:"+getColorValue("boxbgcolor")+"; ";
			
			
				masBoxBorderColor = "border-color:"+getColorValue("boxbordercolor")+"; ";
			
			
			masBoxBorderSize = "border-width:"+getFormValue("boxbordersize")+"; ";
			masBoxBorderStyle = "border-style:"+getFormValue("boxborderstyle")+"; ";
						
			if (masCodeComments) {
				sGeneratedCode = sGeneratedCode + "\r" + "/* GLOBAL BOXES */" + "\r";
			}
			sGeneratedCode = sGeneratedCode + ".commonbox { "+masBoxBorderSize+masBoxBorderColor+masBoxBorderStyle+masBoxBgColor+"}" + "\r";
				

// testi even row		
		
			testiEvenRowBgColor = "background-color:"+getColorValue("testievenrowbgcolor")+"; ";
			if (masCodeComments) {
				sGeneratedCode = sGeneratedCode + "\r" + "/* TESTIMONIALS EVEN ROW */" + "\r";
			}
			sGeneratedCode = sGeneratedCode + ".commonbox .evenrow { "+testiEvenRowBgColor+"}" + "\r";
		

// INSIDE MAIN BOX
	// primary photo
		
			
				primaryPhotoBorderColor = "border-color:"+getColorValue("primaryphotobordercolor")+"; ";
			
			
				primaryPhotoBorderStyle = "border-style:"+getFormValue("primaryphotoborderstyle")+"; ";
			
						
			if (masCodeComments) {
				sGeneratedCode = sGeneratedCode + "\r" + "/* PRIMARY PHOTO BORDER */" + "\r";
			}
			sGeneratedCode = sGeneratedCode + ".controlpanel .imgblock200 { "+primaryPhotoBorderColor+primaryPhotoBorderStyle+"}" + "\r";
		

	// data / labels
		
			
				dataLabelsColor = "color:"+getColorValue("datalabelscolor")+"; ";
			
			if (getFormValue("datalabelstransform") != "none") {
				dataLabelsTr = "text-transform:"+getFormValue("datalabelstransform")+"; ";
			}
			
			if (masCodeComments) {
				sGeneratedCode = sGeneratedCode + "\r" + "/* DATA / LABELS */" + "\r";
			}
			sGeneratedCode = sGeneratedCode + ".data, .controlpanel .q { "+dataLabelsColor+dataLabelsTr+"}" + "\r";
		

// CONTROL PANEL BUTTONS
	// buttons
	
			
				buttonsTextColor = "color:"+getColorValue("buttonstextcolor")+"; ";
			
			
				buttonsBgColor = "background-color:"+getColorValue("buttonsbgcolor")+"; ";
			
			
				buttonsBorderColor = "border-color:"+getColorValue("buttonsbordercolor")+"; ";
			
				buttonsBorderStyle = "border-style:"+getFormValue("buttonsborderstyle")+"; ";
			
				buttonsTextHoverColor = "color:"+getColorValue("buttonstexthovercolor")+"; ";
			
			
				buttonsBgHoverColor = "background-color:"+getColorValue("buttonsbghovercolor")+"; ";
			
			
				buttonsBorderHoverColor = "border-color:"+getColorValue("buttonsborderhovercolor")+"; ";
			
			
			if (masCodeComments) {
				sGeneratedCode = sGeneratedCode + "\r" + "/* BUTTONS */" + "\r";
			}
			sGeneratedCode = sGeneratedCode + "#controlPanelButtons a, #controlPanelButtons a:link, #controlPanelButtons a:visited { font-family:"+masBtnFont+"; "+buttonsTextColor+buttonsBorderColor+buttonsBorderStyle+buttonsBgColor+"}" + "\r";
			sGeneratedCode = sGeneratedCode + "#controlPanelButtons a:hover { "+buttonsTextHoverColor+buttonsBorderHoverColor+buttonsBgHoverColor+"}" + "\r";
			
		
// MISC
// PHOTO BLOCKS
		
			
				photoBlocksBgColor = "background-color:"+getColorValue("photoblocksbgcolor")+"; ";
			
			
				photoBlocksBorderColor = "border-color:"+getColorValue("photoblocksbordercolor")+"; ";
			
			
				photoBlocksBorderStyle = "border-style:"+getFormValue("photoblocksborderstyle")+"; ";
			
			photoBlocksBorderSize = "border-width:"+getFormValue("photoblocksbordersize")+"; ";
			
			if (masCodeComments) {
				sGeneratedCode = sGeneratedCode + "\r" + "/* PHOTO BLOCKS */" + "\r";
			}
			sGeneratedCode = sGeneratedCode + ".commonbox .imgblock75, .ir { "+photoBlocksBorderSize+photoBlocksBorderColor+photoBlocksBorderStyle+photoBlocksBgColor+"}" + "\r";
		
// FRIENDS NAME BG
		
			friendsNameBgColor = "background-color:"+getColorValue("friendsnamebgcolor")+"; ";
			if (masCodeComments) {
				sGeneratedCode = sGeneratedCode + "\r" + "/* FRIENDS NAME BG */" + "\r";
			}
			sGeneratedCode = sGeneratedCode + ".commonbox .dr { "+friendsNameBgColor+"}" + "\r";
				

// add css comment
		sTagToAddFront = "\r/* FRIENDSTER LAYOUT CREATED USING HOT-LYTS.COM */" + "";
		if (sGeneratedCode != "") {
			sGeneratedCode = sTagToAddFront + "\r" + sGeneratedCode;
		}
		
// display code
		myTextField = document.getElementById("friendstercss");
		//myPreviewField = document.getElementById("previewGenCode");
		myTextField.value = "";
		myTextField.value = sGeneratedCode;
		//myPreviewField.value = sGeneratedCode;
		
	}
	

// PPREVIEW CODE
	function previewCode() {
		generateCode();
		myPreviewVal = document.getElementById("friendstercss").value;
		myPreviewValClean = escape(myPreviewVal);
		window.open("layout.php?fCode="+myPreviewValClean,"previewwin",'toolbar=no,location=no,directories=no,status=yes,menubar=no,scrollbars=yes,resizable=yes,type=fullWindow,fullscreen');
		
	}