var sliders=new Array();
var fontBrowsers=new Array();
var colorBrowsers=new Array();
var currentColorId=-1;
var currentDown=-1;
var dragStart;
var startValue;
var iPhoneName=new Array();
var browserName=new Array();
var redSlider;
var greenSlider;
var blueSlider;
var alphaSlider;
var colorBrowser;
var currentUpload='';
var copy=new Array();
copy[0]=new Array();
copy[1]=new Array();
iPhoneName.push('AmericanTypewriter');
browserName.push('American Typewriter');
iPhoneName.push('AmericanTypewriter-Bold');
browserName.push('American Typewriter-Bold');
iPhoneName.push('AppleGothic');
browserName.push('AppleGothic');
iPhoneName.push('ArialMT');
browserName.push('Arial');
iPhoneName.push('Arial-BoldMT');
browserName.push('Arial-Bold');
iPhoneName.push('Arial-ItalicMT');
browserName.push('Arial-Italic');
iPhoneName.push('Arial-BoldItalicMT');
browserName.push('Arial-BoldItalic');
iPhoneName.push('ArialRoundedMTBold');
browserName.push('Arial Rounded MT Bold');
iPhoneName.push('Courier');
browserName.push('Courier');
iPhoneName.push('Courier-Bold');
browserName.push('Courier-Bold');
iPhoneName.push('Courier-Oblique');
browserName.push('Courier-Oblique');
iPhoneName.push('Courier-BoldOblique');
browserName.push('Courier-BoldOblique');
iPhoneName.push('Georgia');
browserName.push('Georgia');
iPhoneName.push('Georgia-Bold');
browserName.push('Georgia-Bold');
iPhoneName.push('Georgia-Italic');
browserName.push('Georgia-Italic');
iPhoneName.push('Georgia-BoldItalic');
browserName.push('Georgia-BoldItalic');
iPhoneName.push('Helvetica');
browserName.push('Helvetica');
iPhoneName.push('Helvetica-Bold');
browserName.push('Helvetica-Bold');
iPhoneName.push('Helvetica-Oblique');
browserName.push('Helvetica-Oblique');
iPhoneName.push('Helvetica-BoldOblique');
browserName.push('Helvetica-BoldOblique');
iPhoneName.push('MarkerFelt-Thin');
browserName.push('MarkerFelt');
iPhoneName.push('STHeitiTC-Light');
browserName.push('STHeiti');
iPhoneName.push('TimesNewRomanPSMT');
browserName.push('Times New Roman');
iPhoneName.push('TimesNewRomanPS-BoldMT');
browserName.push('Times New Roman-Bold');
iPhoneName.push('TimesNewRomanPS-ItalicMT');
browserName.push('Times New Roman-Italic');
iPhoneName.push('TimesNewRomanPS-BoldItalicMT');
browserName.push('Times New Roman-BoldItalic');
iPhoneName.push('TrebuchetMS');
browserName.push('Trebuchet MS');
iPhoneName.push('TrebuchetMS-Bold');
browserName.push('Trebuchet MS-Bold');
iPhoneName.push('TrebuchetMS-Italic');
browserName.push('Trebuchet MS-Italic');
iPhoneName.push('Trebuchet-BoldItalic');
browserName.push('Trebuchet MS-BoldItalic');
iPhoneName.push('Verdana');
browserName.push('Verdana');
iPhoneName.push('Verdana-Bold');
browserName.push('Verdana-Bold');
iPhoneName.push('Verdana-Italic');
browserName.push('Verdana-Italic');
iPhoneName.push('Verdana-BoldItalic');
browserName.push('Verdana-BoldItalic');
iPhoneName.push('Zapfino');
browserName.push('Zapfino');
var errorMessage;
document.onselectstart = function() {return false;}
function loadBackgroundImage() {
	setClassStyle(0,"mainDiv","backgroundImage","url(users/"+userId+"/"+themeId+"/bg.png?rand="+Math.random()+")");
	setClassStyle(0,"landscapePreview","backgroundImage","url(users/"+userId+"/"+themeId+"/landscapeBg.png?rand="+Math.random()+")");
}
function loadArrowImage() {
	setClassStyle(0,"arrow","backgroundImage","url(users/"+userId+"/"+themeId+"/arrow.png?rand="+Math.random()+")");
}
function uploadBackgroundImage() {
	if (currentUpload=='') {
		showLoading();
		currentUpload='bg';
		document.forms['bgUploadForm'].submit();
	}
}
function uploadArrowImage() {
	if (currentUpload=='') {
		showLoading();
		currentUpload='arrow';
		document.forms['arrowUploadForm'].submit();
	}
}
function uploadCompleted() {
	if (currentUpload=='bg') {
		var answer=document.getElementById('uploadFrame').contentWindow.document.getElementById('uploadAnswer').innerHTML;
		if (answer=='OK') {
			hideLoading(null);
			loadBackgroundImage();
		} else {
			errorMessage=answer;
			hideLoading(displayUploadError);
		}
	}
	if (currentUpload=='arrow') {
		var answer=document.getElementById('uploadFrame').contentWindow.document.getElementById('uploadAnswer').innerHTML;
		if (answer=='OK') {
			hideLoading(null);
			loadArrowImage();
		} else {
			errorMessage=answer;
			hideLoading(displayUploadError);
		}
	}
	currentUpload='';
}
function displayUploadError() {
	displayAlert(errorMessage,null);
}
//Slider
function createSlider(property,changeSelector, defaultValue, minValue, maxValue) {
	var newValue=186*((defaultValue-minValue)/(maxValue-minValue));
	document.write('<input type="hidden" id="'+property+'" name="'+property+'" value="'+defaultValue+'"><table cellspacing="0" cellpadding="0" border="0"><tr><td><div id="sliderbg'+sliders.length+'" class="sliderBg"><div id="slider'+sliders.length+'" class="sliderPoint" onMouseDown="sliderDown(event,'+sliders.length+')" style="margin-left:'+newValue+'px;"></div></div></td><td align="right" width="25"><input type="text" id="sliderInfo'+sliders.length+'" style="width:25px; padding:0px; border:0px; background:inherit; font-family:Helvetica,Arial; font-size:12px; margin:0px; text-align:right;" onFocus="setTimeout(\'sliderValueFocus('+sliders.length+')\',1);" onBlur="sliderValueChanged('+sliders.length+');" onKeyDown="sliderKeyDown(event,'+sliders.length+')" value="'+defaultValue+'"></td></tr></table>');
	//<span id="sliderInfo'+sliders.length+'">'+defaultValue+'</span>
	var sliderParams=new Array()
	sliderParams[0]=changeSelector;
	sliderParams[1]=document.getElementById(property);
	sliderParams[2]=minValue;
	sliderParams[3]=maxValue;
	sliderParams[4]=true;
	sliderParams[5]=document.getElementById("slider"+sliders.length);
	sliderParams[6]=document.getElementById("sliderInfo"+sliders.length);
	sliderParams[7]=document.getElementById("sliderbg"+sliders.length);
	sliders.push(sliderParams);
	sliderParams[0](defaultValue);
	return sliders.length-1;
}
function sliderValueChanged(id) {
	var value=sliders[id][6].value;
	if (value<sliders[id][2]) {
		value=sliders[id][2];
	}
	if (value>sliders[id][3]) {
		value=sliders[id][3];
	}
	if (parseInt(value)!=value) {
		value=sliders[id][1].value;
	}
	setSliderValue(id,value);
	if (sliders[id][0]!=null) {
		sliders[id][0](sliders[id][1].value);
	}
}
function sliderValueFocus(id) {
	sliders[id][6].select();
}
function sliderKeyDown(e,id) {
	var keycode;
	if (window.event) {
		keycode = window.event.keyCode;
	} else {
		keycode = e.which;
	}
	if (keycode == 13) {
		sliderValueChanged(id);
		sliders[id][6].select();
	}
}
function getAllSliderPlistFormat() {
	var plist='';
	var counter=0;
	while (counter<sliders.length) {
		if (sliders[counter][1].id!='colorBrowserRed' && sliders[counter][1].id!='colorBrowserGreen' && sliders[counter][1].id!='colorBrowserBlue' && sliders[counter][1].id!='colorBrowserAlpha') {
			plist+='<key>'+sliders[counter][1].id+'</key><integer>'+parseInt(sliders[counter][1].value)+'</integer>';
		}
		counter++;
	}
	return plist;
}
function setSliderValueFromProperty(property,value) {
	var counter=0;
	var id=-1;
	while (counter<sliders.length) {
		if (sliders[counter][1].id==property) {
			id=counter;
			counter=sliders.length;
		}
		counter++;
	}
	if (id!=-1) {
		if (value<sliders[id][2]) {
			value=sliders[id][2];
		}
		if (value>sliders[id][3]) {
			value=sliders[id][3];
		}
		setSliderValue(id,value);
		if (sliders[id][0]!=null) {
			sliders[id][0](sliders[id][1].value);
		}
	}
}
function setSliderValue(id,value) {
	if (value<0) {
		sliders[id][4]=false;
		value=value*(-1);
		sliders[id][7].style.opacity=0.5;
		sliders[id][6].disabled=true;
	} else {
		sliders[id][4]=true;
		sliders[id][7].style.opacity=1.0;
		sliders[id][6].disabled=false;
	}
	var currentValue=186*((sliders[id][1].value-sliders[id][2])/(sliders[id][3]-sliders[id][2]));
	sliders[id][1].value=value;
	var newValue=186*((sliders[id][1].value-sliders[id][2])/(sliders[id][3]-sliders[id][2]));
	animateElement(sliders[id][5],'marginLeft',currentValue,newValue,250,0,null);
	sliders[id][6].value=sliders[id][1].value;
}
function sliderDown(e,id) {
	if (sliders[id][4]) {
		currentDown=id;
		dragStart=e.clientX;
		startValue=186*((sliders[currentDown][1].value-sliders[currentDown][2])/(sliders[currentDown][3]-sliders[currentDown][2]));
		document.onmousedown = function() {return false;}
		document.onmousemove = OnMouseMove;
		document.onmouseup = OnMouseUp;
	}
	return false;
}
function OnMouseMove(e) {
	if (!animating) {
		var newValue=startValue+e.clientX-dragStart;
		if (newValue<0) {
			newValue=0;
		}
		if (newValue>186) {
			newValue=186;
		}
		sliders[currentDown][5].style.marginLeft=newValue+"px";
		sliders[currentDown][1].value=Math.round((newValue/186)*(sliders[currentDown][3]-sliders[currentDown][2])+sliders[currentDown][2]);
		sliders[currentDown][6].value=sliders[currentDown][1].value;
		if (sliders[currentDown][0]!=null) {
			sliders[currentDown][0](sliders[currentDown][1].value);
		}
	}
}
function getSliderValue(id) {
	return sliders[id][1].value;
}
function OnMouseUp(e) {
	sliders[currentDown][5].style.marginLeft=186*((sliders[currentDown][1].value-sliders[currentDown][2])/(sliders[currentDown][3]-sliders[currentDown][2]))+"px";
	document.onmousedown = null;
	document.onmousemove = null;
	document.onmouseup = null;
	currentDown=-1;
}
//Font browser
function createFontBrowser(property,changeSelector,currentValue) {
	document.write('<input type="hidden" id="'+property+'" name="'+property+'" value="'+currentValue+'"><select class="fontBrowser" id="fontBrowser'+fontBrowsers.length+'" onChange="changeFont('+fontBrowsers.length+');">');
	var counter=0;
	while (counter<iPhoneName.length) {
		if (currentValue==iPhoneName[counter]) {
			document.write('<option value="'+iPhoneName[counter]+'" selected>'+browserName[counter]+'</option>');
		} else {
			document.write('<option value="'+iPhoneName[counter]+'">'+browserName[counter]+'</option>');
		}
		counter++;
	}
	document.write('</select>');
	var browserParams=new Array();
	browserParams[0]=changeSelector;
	browserParams[1]=document.getElementById(property);
	browserParams[2]=document.getElementById('fontBrowser'+fontBrowsers.length);
	fontBrowsers.push(browserParams);
	browserParams[0](currentValue);
}
function getAllFontBrowserPlistFormat() {
	var plist='';
	var counter=0;
	while (counter<fontBrowsers.length) {
		plist+='<key>'+fontBrowsers[counter][1].id+'</key><string>'+fontBrowsers[counter][1].value+'</string>';
		counter++;
	}
	return plist;
}
function setFontBrowser(property,fontName) {
	var counter=0;
	var id=-1;
	var fontIndex=-1;
	while (counter<fontBrowsers.length) {
		if (fontBrowsers[counter][1].id==property) {
			id=counter;
			counter=fontBrowsers.length;
		}
		counter++;
	}
	if (id!=-1) {
		counter=0;
		while (counter<iPhoneName.length) {
			if (iPhoneName[counter]==fontName) {
				fontIndex=counter;
				counter=iPhoneName.length;
			}
			counter++;
		}
		if (fontIndex!=-1) {
			fontBrowsers[id][2].selectedIndex=fontIndex;
			changeFont(id);
		}
	}
}
function changeFont(id) {
	fontBrowsers[id][1].value=fontBrowsers[id][2].options[fontBrowsers[id][2].selectedIndex].value;
	if (fontBrowsers[id][0]!=null) {
		fontBrowsers[id][0](fontBrowsers[id][1].value);
	}
}
function setFont(element,iPhoneFontName) {
	var counter=0;
	var browserFontName;
	while (counter<browserName.length) {
		if (iPhoneFontName==iPhoneName[counter]) {
			browserFontName=browserName[counter];
			counter=browserName.length;
		}
		counter++;
	}
	var fontAndStyle=browserFontName.split('-');
	setClassStyle(0,element,"fontFamily",'"'+iPhoneFontName+'","'+fontAndStyle[0]+'"');
	if (fontAndStyle.length==2) {
		if (fontAndStyle[1]=="Bold") {
			setClassStyle(0,element,"fontWeight","Bold");
			setClassStyle(0,element,"fontStyle","normal");
		}
		if (fontAndStyle[1]=="Italic") {
			setClassStyle(0,element,"fontWeight","normal");
			setClassStyle(0,element,"fontStyle","Italic");
		}
		if (fontAndStyle[1]=="Oblique") {
			setClassStyle(0,element,"fontWeight","normal");
			setClassStyle(0,element,"fontStyle","Oblique");
		}
		if (fontAndStyle[1]=="BoldItalic") {
			setClassStyle(0,element,"fontWeight","Bold");
			setClassStyle(0,element,"fontStyle","Italic");
		}
		if (fontAndStyle[1]=="BoldOblique") {
			setClassStyle(0,element,"fontWeight","Bold");
			setClassStyle(0,element,"fontStyle","Oblique");
		}
	} else {
		setClassStyle(0,element,"fontWeight","normal");
		setClassStyle(0,element,"fontStyle","normal");
	}
}
//Color browser
function createColorBrowser(property,changeSelector,red,green,blue,alpha) {
	var rgba="rgba("+Math.abs(red)+","+Math.abs(green)+","+Math.abs(blue)+","+Math.abs(alpha/100)+")";
	document.write('<input type="hidden" id="'+property+'Red" name="'+property+'Red" value="'+red+'"><input type="hidden" id="'+property+'Green" name="'+property+'Green" value="'+green+'"><input type="hidden" id="'+property+'Blue" name="'+property+'Blue" value="'+blue+'"><input type="hidden" id="'+property+'Alpha" name="'+property+'Alpha" value="'+alpha+'"><div class="colorDivBg"><div class="colorDiv" style="background-color:'+rgba+';" id="colorPreview'+colorBrowsers.length+'" onClick="showColorBrowser(event,'+colorBrowsers.length+')"></div></div>');
	var colorParams=new Array();
	colorParams[0]=changeSelector;
	colorParams[1]=document.getElementById(property+'Red');
	colorParams[2]=document.getElementById(property+'Green');
	colorParams[3]=document.getElementById(property+'Blue');
	colorParams[4]=document.getElementById(property+'Alpha');
	colorParams[5]=document.getElementById('colorPreview'+colorBrowsers.length);
	colorBrowsers.push(colorParams);
	colorParams[0](rgba);
}
function getAllColorBrowserPlistFormat() {
	var plist='';
	var counter=0;
	while (counter<colorBrowsers.length) {
		plist+='<key>'+colorBrowsers[counter][1].id.replace('Red','')+'</key><dict>';
		plist+='<key>red</key><integer>'+parseInt(colorBrowsers[counter][1].value)+'</integer>';
		plist+='<key>green</key><integer>'+parseInt(colorBrowsers[counter][2].value)+'</integer>';
		plist+='<key>blue</key><integer>'+parseInt(colorBrowsers[counter][3].value)+'</integer>';
		plist+='<key>alpha</key><integer>'+parseInt(colorBrowsers[counter][4].value)+'</integer>';
		plist+='</dict>';
		counter++;
	}
	return plist;
}
function setColorBrowser(property,red,green,blue,alpha) {
	var counter=0;
	var id=-1;
	while (counter<colorBrowsers.length) {
		if (colorBrowsers[counter][1].id==property+'Red') {
			id=counter;
			counter=colorBrowsers.length;
		}
		counter++;
	}
	if (id!=-1) {
		setColorBrowserWithId(id,red,green,blue,alpha);
	}
}
function setColorBrowserWithId(id,red,green,blue,alpha) {
	if (colorBrowsers[id][1].value>=0) {
		colorBrowsers[id][1].value=red;
	}
	if (colorBrowsers[id][2].value>=0) {
		colorBrowsers[id][2].value=green;
	}
	if (colorBrowsers[id][3].value>=0) {
		colorBrowsers[id][3].value=blue;
	}
	if (colorBrowsers[id][4].value>=0) {
		colorBrowsers[id][4].value=alpha;
	}
	var defId=currentColorId;
	currentColorId=id;
	colorChanged();
	currentColorId=defId;
	if (currentColorId!=-1) {
		setSliderValue(redSlider,colorBrowsers[id][1].value);
		setSliderValue(greenSlider,colorBrowsers[id][2].value);
		setSliderValue(blueSlider,colorBrowsers[id][3].value);
		setSliderValue(alphaSlider,colorBrowsers[id][4].value);
	}
}
function showColorBrowser(e,id) {
	if (!animating) {
	currentColorId=id;
	if (colorBrowser.style.display=='none') {
		colorBrowser.style.display="block";
		animateElement(colorBrowser,'alpha',0,1,250,0,null);
		colorBrowser.style.left=e.pageX-100+"px";
		colorBrowser.style.top=e.pageY+"px";
	} else {
		animateElement(colorBrowser,'x',colorBrowser.offsetLeft,e.pageX-100,250,0,null);
		animateElement(colorBrowser,'y',colorBrowser.offsetTop,e.pageY,250,0,null);
	}
	setSliderValue(redSlider,colorBrowsers[id][1].value);
	setSliderValue(greenSlider,colorBrowsers[id][2].value);
	setSliderValue(blueSlider,colorBrowsers[id][3].value);
	setSliderValue(alphaSlider,colorBrowsers[id][4].value);
	}
}
function hideColorBrowser() {
	if (currentColorId!=-1) {
		animateElement(colorBrowser,'alpha',1,0,250,0,hideColorBrowserFinal);
		currentColorId=-1;
	}
}
function hideColorBrowserFinal() {
	colorBrowser.style.display="none";
}
function redChanged(value) {
	if (currentColorId!=-1) {
		colorBrowsers[currentColorId][1].value=value;
		colorChanged();
	}
}
function greenChanged(value) {
	if (currentColorId!=-1) {
		colorBrowsers[currentColorId][2].value=value;
		colorChanged();
	}
}
function blueChanged(value) {
	if (currentColorId!=-1) {
		colorBrowsers[currentColorId][3].value=value;
		colorChanged();
	}
}
function alphaChanged(value) {
	if (currentColorId!=-1) {
		colorBrowsers[currentColorId][4].value=value;
		colorChanged();
	}
}
function colorChanged() {
	var rgba="rgba("+Math.abs(colorBrowsers[currentColorId][1].value)+","+Math.abs(colorBrowsers[currentColorId][2].value)+","+Math.abs(colorBrowsers[currentColorId][3].value)+","+Math.abs(colorBrowsers[currentColorId][4].value/100)+")";
	colorBrowsers[currentColorId][5].style.backgroundColor=rgba;
	if (colorBrowsers[currentColorId][0]!=null) {
		colorBrowsers[currentColorId][0](rgba);
	}
}
function copyColor() {
	copy[1]=new Array();
	copy[1].push(colorBrowsers[currentColorId][1].value);
	copy[1].push(colorBrowsers[currentColorId][2].value);
	copy[1].push(colorBrowsers[currentColorId][3].value);
	copy[1].push(colorBrowsers[currentColorId][4].value);
}
function pasteColor() {
	if (copy[1].length!=0) {
		setColorBrowserWithId(currentColorId,copy[1][0],copy[1][1],copy[1][2],copy[1][3]);
	}
}
//Other
function setClassStyle(sheet_index,classname,class_style,style_value){
	var style_sheet=document.styleSheets[sheet_index];
	var sRules = style_sheet.cssRules || style_sheet.rules;
	for (var j=sRules.length-1;j>=0;j--) {
		var sS=sRules[j];
		var class_name=sS.selectorText.replace(/\./g,'');
		if(class_name==classname){
			sS.style[class_style]=style_value;
		}
	}
}
function getValue(property) {
	return document.getElementById(property).value;
}
function copyLabel(labelName) {
	copy[0]=new Array();
	copy[0].push(document.getElementById(labelName+'Font').value);
	copy[0].push(document.getElementById(labelName+'Size').value);
	copy[0].push(document.getElementById(labelName+'X').value);
	copy[0].push(document.getElementById(labelName+'Y').value);
	copy[0].push(document.getElementById(labelName+'ShadowX').value);
	copy[0].push(document.getElementById(labelName+'ShadowY').value);
	copy[0].push(document.getElementById(labelName+'ColorRed').value);
	copy[0].push(document.getElementById(labelName+'ColorGreen').value);
	copy[0].push(document.getElementById(labelName+'ColorBlue').value);
	copy[0].push(document.getElementById(labelName+'ColorAlpha').value);
	copy[0].push(document.getElementById(labelName+'ShadowColorRed').value);
	copy[0].push(document.getElementById(labelName+'ShadowColorGreen').value);
	copy[0].push(document.getElementById(labelName+'ShadowColorBlue').value);
	copy[0].push(document.getElementById(labelName+'ShadowColorAlpha').value);
}
function pasteLabel(labelName) {
	if (copy[0].length!=0) {
		setFontBrowser(labelName+'Font',copy[0][0]);
		setSliderValueFromProperty(labelName+'Size',copy[0][1]);
		setSliderValueFromProperty(labelName+'X',copy[0][2]);
		setSliderValueFromProperty(labelName+'Y',copy[0][3]);
		setSliderValueFromProperty(labelName+'ShadowX',copy[0][4]);
		setSliderValueFromProperty(labelName+'ShadowY',copy[0][5]);
		setColorBrowser(labelName+'Color',copy[0][6],copy[0][7],copy[0][8],copy[0][9]);
		setColorBrowser(labelName+'ShadowColor',copy[0][10],copy[0][11],copy[0][12],copy[0][13]);
	}
}