ccnt = 0;
mcnt = 0;
m2cnt = 0;
rcnt = 0;
mtcnt = 0;
gcnt = 0;
scnt = 0;
bcnt = 0;
eecnt = 0;
edcnt = 0;
edscnt = 0;
ebcnt = 0;
rscnt = 0;
slcnt = 0;
schcnt = 0;
iscnt = 0;
fmcnt = 0;
recnt = 0;
btcnt = 0;
iccnt = 0;
ctcnt = 0;
crcnt = 0;
rfcnt = 0;
rccnt = 0;
tcnt = 0;
tricnt = 0;
tri3cnt = 0;
pycnt = 0;
cbcnt = 0;
tltcnt = 0;
shcnt = 0;
imcnt = 0;
tlcnt = 0;
ufcnt = 0;
gccnt = 0;
mcbcnt = 0;
sbcnt = 0;
shdcnt = 0;
cskcnt = 0;
emcnt = 0;
cvcnt = 0;
cv3cnt = 0;
stkcnt = 0;
opcnt = 0;
apcnt = 0;
mrcnt = 0;
wvcnt = 0;
racnt = 0;
swcnt = 0;
tntcnt = 0;
rpcnt = 0;
lbcnt = 0;
pvcnt = 0;
sphcnt = 0;
hgcnt = 0;
iccnt = 0;

/*
 * direction =0 => zoom in, 1 =>zoom out
 * flag = 0 => 1 image , 1 => 2 images
*/
function zoom(direction, flag) {
	//zoom in or out by factor of 20%

	var zoom = 1.2;
	if (direction) {
		zoom = 0.8;
	}

	var html ="";
	
	if (flag) {
		image1 = new Image();
		image1.src = document.getElementById('i0').src;
		var new_width = Math.round(image1.width * zoom);
		var new_height = Math.round(image1.height * zoom);
		
		image2 = new Image();
		image2.src = document.getElementById('i1').src;
		var new_width2 = Math.round(image2.width * zoom);
		var new_height2 = Math.round(image2.height * zoom);
		
		if (document.getElementById('w0').value != 0 && document.getElementById('h0').value != 0) {
			new_width = Math.round(zoom *  document.getElementById('w0').value);
			new_height = Math.round(zoom *  document.getElementById('h0').value);

			new_width2 = Math.round(zoom *  document.getElementById('w1').value);
			new_height2 = Math.round(zoom *  document.getElementById('h1').value);
		}

		html = '<input type="hidden" id="w0" value="' + new_width + '" /><input type="hidden" id="h0" value="' + new_height  + '" /><input type="hidden" id="w1" value="' + new_width2 + '" /><input type="hidden" id="h1" value="' + new_height2  + '" /><table><tr><td align="center"><b>IMAGE 1</b></td><td></td><td align="center"><b>IMAGE 2</b></td></tr><tr><td><input type="image" src="' +image1.src +'" width="' +new_width +'" height="' + new_height + '" id="i0" value="submit" /></td><td width="10"><td><input type="image" src="' +image2.src +'" width="' +new_width2 +'" height="' + new_height2 + '" id="i1" value="submit" /></td></tr><tr><td align="center"><input type="radio" name="id1" id="img1" value="' + image1.src +'" /></td><td></td><td align="center"><input type="radio" name="id1" id="img2" value="' + image2.src  +'" /></td></tr></table><input type="hidden" name="img1" id="v1" value="' + image1.src +'" /><input type="hidden" name="img2" id="v2" value="' + image2.src +'" />';
	}
	else {
		image1 = new Image();
		image1.src = document.getElementById('i0').src;

		var new_width = Math.round(image1.width * zoom);
		var new_height = Math.round(image1.height * zoom);

		if (document.getElementById('w0').value != 0 && document.getElementById('h0').value != 0) {
			new_width = Math.round(zoom *  document.getElementById('w0').value);
			new_height = Math.round(zoom *  document.getElementById('h0').value);
		}
				
		html = '<input type="hidden" id="w0" value="' + new_width + '" /><input type="hidden" id="h0" value="' + new_height  + '" /><table><tr><td><input type="image" src="' +image1.src +'" width="' +new_width +'" height="' + new_height +'"  id="i0" value="submit"/></td></tr></table>';
	}

	document.getElementById('box').innerHTML = html;
}

var fonts = "<select name=\"textfonts\">" +
				"<option value=\"abbey\">abbey</option>" +
				"<option value=\"adler\">adler</option>" +
				"<option value=\"agent_orange\">agent orange</option>" +
				"<option value=\"aircut_light\">aircut light</option>" +
				"<option value=\"airmole_shaded\">airmole shaded</option>" +
				"<option value=\"airstream\">airstream</option>" +
				"<option value=\"ala_carte\">ala carte</option>" +
				"<option value=\"aladdin_regular\">aladdin</option>" +
				"<option value=\"alako_bold\">alako</option>" +
				"<option value=\"alienation\">alienation</option>" +
				"<option value=\"alpha_flight\">alpha flight</option>" +
				"<option value=\"crikey\">crikey</option>" +
				"<option value=\"d3_roadsterism\">d3 roadsterism</option>" +
				"<option value=\"dancestep\">dancestep</option>" +
				"<option value=\"explosive\">explosive</option>" +
				"<option value=\"factor\">factor</option>" +
				"<option value=\"gas_huffer\">gas huffer</option>" +
				"<option value=\"glory\">glory</option>" +
				"<option value=\"quilted_indian\">quilted indian</option>" +
				"<option value=\"raceway\">raceway</option>" +
				"<option value=\"vampiress\">vampiress</option>" +
				"<option value=\"violation\">violation</option>" +
				"<option value=\"weimar_regular\">weimar</option>" +
				"<option value=\"wide_eyed\">wide eyed</option>" +
				"<option value=\"wishful_waves\">wishful waves</option>" +
				"<option value=\"x-cryption\">x-cryption</option>" +
				"<option value=\"xtrusion\">xtrusion</option>" +
				"<option value=\"zag\">zag</option>" +
				"<option value=\"zreaks\">zreaks</option>" +
				"<option value=\"zurklez\">zurklez</option>" +
			"</select>";

var colors = "<select name=\"colors\">" +
					"<option value=\"FFFFFF\" style=\"background-color: White;color: #FFFFFF;\">White</option>" +
					"<option value=\"000000\" style=\"background-color: Black;color: #000000;\">Black</option>" +
					"<option value=\"808080\" style=\"background-color: Gray;color: #808080;\">Gray</option>" +
					"<option value=\"A9A9A9\" style=\"background-color: DarkGray;color: #A9A9A9;\">Dark Gray</option>" +
					"<option value=\"D3D3D3\" style=\"background-color: LightGrey;color: #D3D3D3;\">Light Gray</option>" +
					"<option value=\"7FFFD4\" style=\"background-color: Aquamarine;color: #7FFFD4;\">Aquamarine</option>" +
					"<option value=\"40E0D0\" style=\"background-color: Turquoise;color: #40E0D0;\">Turquoise</option>" +
					"<option value=\"87CEEB\" style=\"background-color: SkyBlue;color: #87CEEB;\">Sky Blue</option>" +
					"<option value=\"0000FF\" style=\"background-color: Blue;color: #0000FF;\">Blue</option>" +
					"<option value=\"000080\" style=\"background-color: Navy;color: #000080;\">Navy</option>" +
					"<option value=\"483D8B\" style=\"background-color: DarkSlateBlue;color: #483D8B;\">Dark Slate Blue</option>" +
					"<option value=\"800080\" style=\"background-color: Purple;color: #800080;\">Purple</option>" +
					"<option value=\"FF1493\" style=\"background-color: DeepPink;color: #FF1493;\">Deep Pink</option>" +
					"<option value=\"EE82EE\" style=\"background-color: Violet;color: #EE82EE;\">Violet</option>" +
					"<option value=\"FFC0CB\" style=\"background-color: Pink;color: #FFC0CB;\">Pink</option>" +
					"<option value=\"006400\" style=\"background-color: DarkGreen;color: #006400;\">Dark Green</option>" +
					"<option value=\"008000\" style=\"background-color: Green;color: #008000;\">Green</option>" +
					"<option value=\"9ACD32\" style=\"background-color: YellowGreen;color: #9ACD32;\">Yellow Green</option>" +
					"<option value=\"7CFC00\" style=\"background-color: LawnGreen;color: #7CFC00;\">Lawn Green</option>" +
					"<option value=\"6B8E23\" style=\"background-color: OliveDrab;color: #6B8E23;\">Olive Drab</option>" +
					"<option value=\"FFFF00\" style=\"background-color: Yellow;color: #FFFF00;\">Yellow</option>" +
					"<option value=\"FFA500\" style=\"background-color: Orange;color: #FFA500;\">Orange</option>" +
					"<option value=\"FF0000\" style=\"background-color: Red;color: #FF0000;\">Red</option>" +
					"<option value=\"B03060\" style=\"background-color: #B03060;color: #B03060;\">Maroon</option>" +
					"<option value=\"A52A2A\" style=\"background-color: Brown;color: #A52A2A;\">Brown</option>" +
					"<option value=\"DEB887\" style=\"background-color: BurlyWood;color: #DEB887;\">Burly Wood</option>" +
					"<option value=\"F5F5DC\" style=\"background-color: Beige;color: #F5F5DC;\">Beige</option>" +
					"<option value=\"FFDAB9\" style=\"background-color: PeachPuff;color: #FFDAB9;\">Peach Puff</option>" +
					"<option value=\"E6E6FA\" style=\"background-color: Lavender;color: #E6E6FA;\">Lavender</option>" +
					"<option value=\"8B4513\" style=\"background-color: #8B4513;color: #8B4513;\">Chocolate</option>" +
			"</select>";	
var colors2 = colors.replace(/colors/, "colors2");

function showParameters(fname) {
	
	var updiv = document.getElementById("more");
	var addhtml = "";	

	if (fname == "curve" && cvcnt == 0) {
		var directions = '<select name="curve_dir" >' +
						'<option value="0">right</option>' +
						'<option value="1">left</option>' +
						'<option value="2">up</option>' +
						'<option value="3">down</option>' +
					'</select>';
		var params = "<table><tr><td>displacement (px): <input type=\"text\" name=\"curve_disp\" size=\"3\" /></td><td>direction: " + directions +"</td><td>background: " + colors + "</td></tr></table><input type=\"hidden\" name=\"curve\" value=\"true\">";
		
		addhtml = updiv.innerHTML + params;
		
		cvcnt++;
	}
	else if (fname == "perspective" && pvcnt == 0) {
		var directions = '<select name="pv_ort" >' +
						'<option value="0">up</option>' +
						'<option value="1">down</option>' +
						'<option value="2">right</option>' +
						'<option value="3">left</option>' +
					'</select>';
		var params = "<table><tr><td>orientation: " + directions +"</td><td>background: " + colors + "</td></tr></table><input type=\"hidden\" name=\"perspective\" value=\"true\">";
		
		addhtml = updiv.innerHTML + params;
		
		pvcnt++;
	}
	else if (fname == "label" && lbcnt == 0) {
		var location = '<select name="label_loc" >' +
						'<option value="North">North</option>' +
						'<option value="NorthWest">North West</option>' +
						'<option value="NorthEast">North East</option>' +
						'<option value="South">South</option>' +
						'<option value="SouthWest">South West</option>' +
						'<option value="SouthEast">South East</option>' +
						'<option value="West">West</option>' +
						'<option value="East">East</option>' +
						'<option value="Center">Center</option>' +
					'</select>';
		var params = "<table><tr><td>font size : <input type=\"text\" name=\"label_size\" size=\"3\" maxlength=\"3\" /></td><td>location: " + location +"</td><td>font color: " + colors + "</td><td>font : " + fonts + "</td><td>label: <input type=\"text\" name=\"label_txt\" /></td></tr></table><input type=\"hidden\" name=\"label\" value=\"true\">";
		
		addhtml = updiv.innerHTML + params;
		
		lbcnt++;
	}
	else if (fname == "mirror" && mrcnt == 0) {
		var orientation = '<select name="mirror_ort" >' +
						'<option value="0">horizontal</option>' +
						'<option value="1">vertical</option>' +
					'</select>';
		var params = "<table><tr><td>orientation: " + orientation +"</td></tr></table><input type=\"hidden\" name=\"mirror\" value=\"true\">";
		
		addhtml = updiv.innerHTML + params;
		
		mrcnt++;
	}
	else if (fname == "stack" && stkcnt == 0) {
		var vertical = '<select name="stack_v" >' +
						'<option value="1">top-down</option>' +
						'<option value="0">bottom-up</option>' +
					'</select>';
		var horizontal = '<select name="stack_h" >' +
						'<option value="1">left-right</option>' +
						'<option value="0">right-left</option>' +
					'</select>';
		var params = "<table><tr><td>displacement (px): <input type=\"text\" name=\"stack_disp\" size=\"3\" /></td><td>stack size: <input type=\"text\" name=\"stack_size\" value=\"2\" size=\"3\" /></td><td>vertical: " + vertical +"</td><td>horizontal: " + horizontal +"</td><td>background: " + colors + "</td></tr></table><input type=\"hidden\" name=\"stack\" value=\"true\">";
		
		addhtml = updiv.innerHTML + params;
		
		stkcnt++;
	}
	else if (fname == "curve3D" && cv3cnt == 0) {
		var directions = '<select name="curve3d_dir" >' +
						'<option value="0">right</option>' +
						'<option value="1">left</option>' +
						'<option value="2">up</option>' +
						'<option value="3">down</option>' +
					'</select>';
		var params = "<table><tr><td>displacement (px): <input type=\"text\" name=\"curve3d_disp\" size=\"3\" /></td><td>direction: " + directions +"</td><td>color: " + colors + "</td><td>background: " + colors2 + "</td></tr></table><input type=\"hidden\" name=\"curve3D\" value=\"true\">";
		
		addhtml = updiv.innerHTML + params;
		
		cv3cnt++;
	}
	else if (fname == "crop" && ccnt == 0) {
		var params = "<table><td>left margin (%): <input type=\"text\" name=\"left\" size=\"3\"></td><td>right margin (%): <input type=\"text\" name=\"right\" size=\"3\">" +
"</td><td>top margin (%): <input type=\"text\" name=\"top\" size=\"3\"></td><td>bottom margin (%): <input type=\"text\" name=\"bottom\" size=\"3\"></td><td>Enter negative values to create frames.</td></table><input type=\"hidden\" name=\"crop\" value=\"true\">";
		
		addhtml = updiv.innerHTML + params;
		
		ccnt++;
	}
	else if (fname == "wave" && wvcnt == 0) {
		var params = "<table><tr><td>amplitude (px): <input type=\"text\" name=\"wave_amp\" size=\"3\"></td><td>wavelength (px): <input type=\"text\" name=\"wave_len\" size=\"3\">" +
"</td><td>background: " + colors + "</td></tr></table><input type=\"hidden\" name=\"wave\" value=\"true\">";
		
		addhtml = updiv.innerHTML + params;
		
		wvcnt++;
	}
	else if (fname == "tint" && tntcnt == 0) {
		var params = "<table><tr><td>intensity (%): <input type=\"text\" name=\"tint_pct\" size=\"3\"></td><td>color: " + colors + "</td></tr></table><input type=\"hidden\" name=\"tint\" value=\"true\">";
		
		addhtml = updiv.innerHTML + params;
		
		tntcnt++;
	}
	else if (fname == "repaint" && rpcnt == 0) {
		var params = "<table><tr><td align=\"center\"><i>If this operation results in a blank image, try a different color.</i></td><tr><tr><td align=\"center\">color: " + colors + "</td></tr></table><input type=\"hidden\" name=\"repaint\" value=\"true\">";
		
		addhtml = updiv.innerHTML + params;
		
		rpcnt++;
	}
	else if (fname == "email it" && emcnt == 0) {
		var params = "<table cellspacing=\"5\" cellpadding=\"5\"><tr><td align=\"center\"colspan=\"3\"><i>Seperate email addresses with a comma and a space when sending to multiple addresses.</i></td></tr><tr><td>to: <input type=\"text\" name=\"email_to\" size=\"40\" /></td><td>from: <input type=\"text\" name=\"email_from\" size=\"40\" />" +
"</td><td>subject: <input type=\"text\" name=\"email_sub\" size=\"40\" /></td></tr></table><input type=\"hidden\" name=\"email\" value=\"true\">";
		
		addhtml = updiv.innerHTML + params;
		
		emcnt++;
	}
	else if (fname == "rotate" && rcnt == 0) {
		var params = "<table><tr><td>angle (deg): <input type=\"text\" name=\"angle\" size=\"3\"></td><td>background: " + colors + "</td></tr></table><input type=\"hidden\" name=\"rotate\" value=\"true\">";
		
		addhtml = updiv.innerHTML + params;
		
		rcnt++;
	}
	else if (fname == "swirl" && swcnt == 0) {
		var params = "<table><tr><td>angle (deg): <input type=\"text\" name=\"swirl_angle\" size=\"3\"></td></tr></table><input type=\"hidden\" name=\"swirl\" value=\"true\">";
		
		addhtml = updiv.innerHTML + params;
		
		swcnt++;
	}
	else if (fname == "raise" && racnt == 0) {
		var params = "<table><tr><td>displacement (px): <input type=\"text\" name=\"raise_disp\" size=\"3\"></td></tr></table><input type=\"hidden\" name=\"raise\" value=\"true\">";
		
		addhtml = updiv.innerHTML + params;
		
		racnt++;
	}
	else if (fname == "scramble" && sbcnt == 0) {
		var params = "<table><tr><td>cell width (px): <input type=\"text\" name=\"sb_width\" size=\"3\"></td><td>cell height (px): <input type=\"text\" name=\"sb_height\" size=\"3\"></td></tr></table><input type=\"hidden\" name=\"scramble\" value=\"true\">";
		
		addhtml = updiv.innerHTML + params;
		
		sbcnt++;
	}
	else if (fname == "tilt" && tltcnt == 0) {
		var params = "<table><tr><td>horizontal: <input type=\"radio\" name=\"tlt_ort\" value=\"0\" /></td><td>vertical: <input type=\"radio\" name=\"tlt_ort\" value=\"1\" /></td><td>forward/upward: <input type=\"radio\" name=\"tlt_dir\" value=\"0\" /></td><td>backward/downward: <input type=\"radio\" name=\"tlt_dir\" value=\"1\" /></td></tr></table><input type=\"hidden\" name=\"tilt\" value=\"true\">";
		
		addhtml = updiv.innerHTML + params;
		
		tltcnt++;
	}
	else if (fname == "shear" && shcnt == 0) {
		var params = "<table><tr><td colspan=\"3\" align=\"center\"><i>Enter an angle value of 0 for vertical angle if you want to do a horizontal shear only and vice versa.</i></td></tr><tr><td>horizontal angle (deg): <input type=\"text\" name=\"shear_x\" size=\"3\" maxlength=\"4\" /></td><td>vertical angle (deg): <input type=\"text\" name=\"shear_y\" size=\"3\" maxlength=\"4\" /></td><td>background: " + colors + "</td></tr></table><input type=\"hidden\" name=\"shear\" value=\"true\">";
		
		addhtml = updiv.innerHTML + params;
		
		shcnt++;
	}
	else if (fname == "merge" && mcnt == 0) {
		var params = "<table><td>base image x (%): </td><td><input type=\"text\" name=\"dst_x\" size=\"3\"></td><td>base image y (%): </td><td><input type=\"text\" name=\"dst_y\" size=\"3\">" +
"</td><td>incoming image x (%): </td><td><input type=\"text\" name=\"src_x\" size=\"3\"></td><td>incoming image y (%): </td><td><input type=\"text\" name=\"src_y\" size=\"3\"></td><td>incoming image width (%): </td><td><input type=\"text\" name=\"src_w\" size=\"3\"></td><td>incoming image height (%): </td><td><input type=\"text\" name=\"src_h\" size=\"3\"></td><td>transparency (%): </td><td><input type=\"text\" name=\"pct\" size=\"3\"></td></table><input type=\"hidden\" name=\"merge\" value=\"true\">";
		
		addhtml = updiv.innerHTML + params;
		
		mcnt++;
	}
	else if (fname == "merge2" && m2cnt == 0) {
		var params = "<table><tr><td align=\"center\"><i>Enter the transparency value below, then click on the spot where the top left corner will appear.</i></td></tr><tr><td align=\"center\">transparency (%): <input type=\"text\" name=\"m2_pct\" size=\"3\"></td></tr></table><input type=\"hidden\" name=\"merge2\" value=\"true\">";
		
		addhtml = updiv.innerHTML + params;
		
		m2cnt++;
	}	
	else if (fname == "montage" && mtcnt == 0) {
		var params = "<table><td>upload cell images: <input type=\"radio\" name=\"cell_imgs\" value=\"user\" /></td><td>use our images: <input type=\"radio\" name=\"cell_imgs\" value=\"us\" /></td><td>cell width (px): <input type=\"text\" name=\"cell_w\" size=\"5\"></td><td>cell height (px): <input type=\"text\" name=\"cell_h\" size=\"5\"></td><td>montage width (px): <input type=\"text\" name=\"montage_w\" size=\"5\"></td><td>montage height (px): <input type=\"text\" name=\"montage_h\" size=\"5\"></td></table><input type=\"hidden\" name=\"montage\" value=\"true\">";
		
		addhtml = updiv.innerHTML + params;
		
		mtcnt++;
	}
	else if (fname == "grayscale" && gcnt == 0) {
		var params = "<input type=\"hidden\" name=\"grayscale\" value=\"true\">";
		
		addhtml = updiv.innerHTML + params;
		
		mtcnt++;
	}
	else if (fname == "sharpen" && scnt == 0) {
		var params = "<input type=\"hidden\" name=\"sharpen\" value=\"true\">";
		
		addhtml = updiv.innerHTML + params;
		
		scnt++;
	}
	else if (fname == "sphere" && sphcnt == 0) {
		var params = "<table><tr><td>background: " + colors + 
			"</td></tr></table><input type=\"hidden\" name=\"sphere\" value=\"true\">";
		
		addhtml = updiv.innerHTML + params;
		
		sphcnt++;
	}
	else if (fname == "hourglass" && hgcnt == 0) {
		var params = "<table><tr><td>background: " + colors +
				 "</td></tr></table><input type=\"hidden\" name=\"hourglass\" value=\"true\">";
		
		addhtml = updiv.innerHTML + params;
		
		hgcnt++;
	}
	else if (fname == "oil paint" && opcnt == 0) {
		var params = "<input type=\"hidden\" name=\"oil_paint\" value=\"true\">";
		
		addhtml = updiv.innerHTML + params;
		
		opcnt++;
	}
	else if (fname == "apple" && apcnt == 0) {
		var params = "<table><tr><td>color: " + colors + "</td><td>background: " + colors2 + "</td></tr></table><input type=\"hidden\" name=\"apple\" value=\"true\">";
		
		addhtml = updiv.innerHTML + params;
		
		apcnt++;
	}
	else if (fname == "icicle" && iccnt == 0) {
		var params = "<table><tr><td>color: " + colors + "</td><td>background: " + colors2 + "</td></tr></table><input type=\"hidden\" name=\"icicle\" value=\"true\">";
		
		addhtml = updiv.innerHTML + params;
		
		iccnt++;
	}
	else if (fname == "brighten" && btcnt == 0) {
		var params = "<input type=\"hidden\" name=\"brighten\" value=\"true\">";
		
		addhtml = updiv.innerHTML + params;
		
		btcnt++;
	}
	else if (fname == "reverse" && iccnt == 0) {
		var params = "<input type=\"hidden\" name=\"reverse\" value=\"true\">";
		
		addhtml = updiv.innerHTML + params;
		
		iccnt++;
	}
	else if (fname == "contrast" && ctcnt == 0) {
		var params = "<input type=\"hidden\" name=\"contrast\" value=\"true\">";
		
		addhtml = updiv.innerHTML + params;
		
		ctcnt++;
	}
	else if (fname == "colorize" && crcnt == 0) {
		var params = "<table><tr><td>color: " + colors + "</td></tr></table><input type=\"hidden\" name=\"colorize\" value=\"true\">";
	alert('Performing this action with the color "white" will result in a blank image');	
		addhtml = updiv.innerHTML + params;
		
		crcnt++;
	}
	else if (fname == "tile" && tlcnt == 0) {
		var params = "<table><tr><td>width (px): <input type=\"text\" name=\"tile_w\" size=\"3\"></td><td>height (px): <input type=\"text\" name=\"tile_h\" size=\"3\"></td><td>color: "+ colors + "</td></tr></table><input type=\"hidden\" name=\"tile\" value=\"true\">";
		
		addhtml = updiv.innerHTML + params;
		
		tlcnt++;
	}
	else if (fname == "blur" && bcnt == 0) {
		var params = "<input type=\"hidden\" name=\"blur\" value=\"true\">";
		
		addhtml = updiv.innerHTML + params;
		
		bcnt++;
	}
	else if (fname == "edge enhance" && eecnt == 0) {
		var params = "<input type=\"hidden\" name=\"edge_enhance\" value=\"true\">";
		
		addhtml = updiv.innerHTML + params;
		
		eecnt++;
	}
	else if (fname == "edge detect" && edcnt == 0) {
		var params = "<input type=\"hidden\" name=\"edge_detect\" value=\"true\">";
		
		addhtml = updiv.innerHTML + params;
		
		edcnt++;
	}
	else if (fname == "edge detectS" && edscnt == 0) {
		var params = "<input type=\"hidden\" name=\"edge_detectS\" value=\"true\">";
		
		addhtml = updiv.innerHTML + params;
		
		edscnt++;
	}
	else if (fname == "emboss" && ebcnt == 0) {
		var params = "<input type=\"hidden\" name=\"emboss\" value=\"true\">";
		
		addhtml = updiv.innerHTML + params;
		
		ebcnt++;
	}
	else if (fname == "resize" && rscnt == 0) {
		var params = "<table><td>new width (px): </td><td><input type=\"text\" name=\"new_w\" size=\"5\"></td><td>new height (px): </td><td><input type=\"text\" name=\"new_h\" size=\"5\"></td></table><input type=\"hidden\" name=\"resize\" value=\"true\">";
		
		addhtml = updiv.innerHTML + params;
		
		rscnt++;
	}
	else if (fname == "scale" && slcnt == 0) {
		var params = "<table><td>percent : </td><td><input type=\"text\" name=\"spct\" size=\"3\"></td></table><input type=\"hidden\" name=\"scale\" value=\"true\">";
		
		addhtml = updiv.innerHTML + params;
		
		slcnt++;
	}
	else if (fname == "stitch" && schcnt == 0) {
		var params = "<table><td>horizontal : </td><td><input type=\"radio\" name=\"ort\" value=\"0\"></td><td>vertical : </td><td><input type=\"radio\" name=\"ort\" value=\"1\"></td></table><input type=\"hidden\" name=\"stitch\" value=\"true\">";
		
		addhtml = updiv.innerHTML + params;
		
		schcnt++;
	}
	else if (fname == "insert text" && iscnt == 0) {			
		var params = "<table><tr><td align=\"center\" colspan=\"4\"><i>Fill out the parameters below, then click on the spot where you would like to place the text.</i></td></tr><tr><td>font size (px): <input type=\"text\" name=\"font_size\" size=\"3\"></td><td>angle (deg): <input type=\"text\" name=\"font_angle\" size=\"3\" value=\"0\">" +
"</td><td>color: " + colors + "</td><td>font : " + fonts +"</td></tr><tr><td colspan=\"4\">text: <input type=\"text\" name=\"font_text\" size=\"100\"></td></tr></table><input type=\"hidden\" name=\"insert_string\" value=\"true\">";
		
		addhtml = updiv.innerHTML + params;
		
		iscnt++;
	}
	else if (fname == "insert message" && imcnt == 0) {			
		var params = "<table><tr><td>font size(px): <input type=\"text\" name=\"im_font_size\" size=\"3\" />" +
"</td><td>color: " + colors +"</td><td>font : " + fonts +"</td></tr><tr><td valign=\"top\">message: </td><td colspan=\"2\"><textarea name=\"im_font_text\" rows=\"5\" cols=\"40\"></textarea></tr></table><input type=\"hidden\" name=\"insert_message\" value=\"true\">";
		
		addhtml = updiv.innerHTML + params;
		
		imcnt++;
	}
	else if (fname == "frame" && fmcnt == 0) {
		var params = "<table><tr><td>thickness (px): <input type=\"text\" name=\"frame_thickness\" size=\"3\"></td><td>color: " + colors + "</td></tr></table><input type=\"hidden\" name=\"frame\" value=\"true\">";
		
		addhtml = updiv.innerHTML + params;
		
		fmcnt++;
	}
	else if (fname == "round" && recnt == 0) {
		var params = "<table><tr><td>radius (px): <input type=\"text\" name=\"round_radius\" size=\"3\"></td><td>background color: " + colors + "</td></tr></table><input type=\"hidden\" name=\"round\" value=\"true\">";
		
		addhtml = updiv.innerHTML + params;
		
		recnt++;
	}
	else if (fname == "rounded frame" && rfcnt == 0) {
		var params = "<table><tr><td>thickness (px): <input type=\"text\" name=\"rframe_thickness\" size=\"3\">" +
"</td><td>radius (px): <input type=\"text\" name=\"rframe_radius\" size=\"3\"></td><td>frame color: " + colors + "</td><td>background color: " + colors2 + "</td></tr></table><input type=\"hidden\" name=\"rounded_frame\" value=\"true\">";
		
		addhtml = updiv.innerHTML + params;
		
		rfcnt++;
	}
	else if (fname == "replace color" && rccnt == 0) {
		var params = "<table><tr><td align=\"center\"><i>Fill out the parameters below, then click on the color within the image that you would like to replace.</i></td></tr><tr><td align=\"center\">replacement color: "+ colors + "</td></tr></table><input type=\"hidden\" name=\"replace_color\" value=\"true\">";
		
		addhtml = updiv.innerHTML + params;
		
		rccnt++;
	}
	else if (fname == "tombstone" && tcnt == 0) {
		var params = "<table><tr><td>thickness (px): <input type=\"text\" name=\"tomb_thickness\" size=\"3\">" +
"</td><td>right: <input type=\"radio\" name=\"tomb_ort\" value=\"0\"></td><td>left: <input type=\"radio\" name=\"tomb_ort\" value=\"1\"></td><td>color: " + colors + "</td><td>background color: "+ colors2 + "</td></tr></table><input type=\"hidden\" name=\"tombstone\" value=\"true\">";
		
		addhtml = updiv.innerHTML + params;
		
		tcnt++;
	}
	else if (fname == "triangulate" && tricnt == 0) {
		var params = "<table><tr><td>orientation: up: <input type=\"radio\" name=\"tri_ort\" value=\"0\"></td><td>down: <input type=\"radio\" name=\"tri_ort\" value=\"1\"></td><td>background color: " + colors + "</td></tr></table><input type=\"hidden\" name=\"triangulate\" value=\"true\">";
		
		addhtml = updiv.innerHTML + params;
		
		tricnt++;
	}
	else if (fname == "triangulate3D" && tri3cnt == 0) {
		var params = "<table><tr><td>thickness (px): <input type=\"text\" name=\"tri3_thickness\" size=\"3\"></td><td>up: <input type=\"radio\" name=\"tri3_ort\" value=\"0\"></td><td>down: <input type=\"radio\" name=\"tri3_ort\" value=\"1\"></td><td>right: <input type=\"radio\" name=\"tri3_ort2\" value=\"0\"></td><td>left: <input type=\"radio\" name=\"tri3_ort2\" value=\"1\"></td><td>color: " + colors + "</td><td>background color: " + colors2 + "</td></tr></table><input type=\"hidden\" name=\"triangulate3D\" value=\"true\">";
		
		addhtml = updiv.innerHTML + params;
		
		tri3cnt++;
	}
	else if (fname == "pyramid" && pycnt == 0) {
		var params = "<table><tr><td>thickness (px): <input type=\"text\" name=\"py_thickness\" size=\"3\"></td><td>up: <input type=\"radio\" name=\"py_ort\" value=\"0\"></td><td>down: <input type=\"radio\" name=\"py_ort\" value=\"1\"></td><td>right: <input type=\"radio\" name=\"py_ort2\" value=\"0\"></td><td>left: <input type=\"radio\" name=\"py_ort2\" value=\"1\"></td><td>color: " + colors + "</td><td>background color: "+ colors2 + "</td></tr></table><input type=\"hidden\" name=\"pyramid\" value=\"true\">";
		
		addhtml = updiv.innerHTML + params;
		
		pycnt++;
	}
	else if (fname == "cube" && cbcnt == 0) {
		var params = "<table><tr><td align=\"center\"><i>Large images require longer processing times. Please use smaller images (less than 500px by 300px).</i></td></tr><tr><td align=\"center\">background color: " + colors + "</td></tr></table><input type=\"hidden\" name=\"cube\" value=\"true\">";
		
		addhtml = updiv.innerHTML + params;
		
		cbcnt++;
	}
	else if (fname == "mystery cube" && mcbcnt == 0) {
		var params = "<table><tr><td align=\"center\"><i>Large images require longer processing times. Please use smaller images (less than 500px by 300px).</i></td></tr><tr><td align=\"center\">background color: " + colors + "</td></tr></table><input type=\"hidden\" name=\"mystery_cube\" value=\"true\">";
		
		addhtml = updiv.innerHTML + params;
		
		mcbcnt++;
	}
	else if (fname == "glass cube" && gccnt == 0) {
		var params = "<table><tr><td align=\"center\" colspan=\"2\"><i>Large images require longer processing times. Please use smaller images (less than 500px by 300px).</i></td></tr><tr><td>glass color: "+ colors + "<td>background color: "+ colors2  + "</td></tr></table><input type=\"hidden\" name=\"glass_cube\" value=\"true\">";
		
		addhtml = updiv.innerHTML + params;
		
		gccnt++;
	}
	else if (fname == "flickr upload" && ufcnt == 0) {
		var params = "<table><tr><td>title: <input type=\"text\" name=\"flickr_title\" size=\"20\" /></td><td>description: <input type=\"text\" name=\"flickr_desc\" size=\"30\" /></td><td>tags: <input type=\"text\" name=\"flickr_tags\" size=\"20\" /></td></tr></table><input type=\"hidden\" name=\"flickr_upload\" value=\"true\">";
		
		addhtml = updiv.innerHTML + params;
		
		ufcnt++;
	}
	else if (fname == "shade" && shdcnt == 0) {
		var ort = "<select name=\"shade_ort\">" +
				"<option value=\"0\">left to right</option>" +
				"<option value=\"1\">right to left</option>" +
				"<option value=\"2\">top to bottom</option>" +
				"<option value=\"3\">bottom to top</option>" +
				"<option value=\"4\">horizontal outward</option>" +
				"<option value=\"5\">vertical outward</option>" +
				"</select>";
		var params = "<table><tr><td>" + ort + "</td></tr></table><input type=\"hidden\" name=\"shade\" value=\"true\">";
		
		addhtml = updiv.innerHTML + params;
		
		shdcnt++;
	}
	else if (fname == "comic sketch" && cskcnt == 0) {
		var params = "<table><tr><td>normal: <input type=\"radio\" name=\"sk_type\" value=\"0\" /></td><td>dark: <input type=\"radio\" name=\"sk_type\" value=\"1\" /></td></tr></table><input type=\"hidden\" name=\"comic_sketch\" value=\"true\">";
		
		addhtml = updiv.innerHTML + params;
		
		cskcnt++;
	}
	
	updiv.innerHTML = addhtml;
}

function errorMessage(fname) {
	alert("You must fill in all the parameters of the " + fname + " function");
}

function validate(flag) {
	
	form = document.getElementById("more");
	
	//var agt = navigator.userAgent.toLowerCase();
	if (flag == 1 /*&& agt.indexOf("msie") == -1*/) {
		var img1 = document.getElementById("img1");
		var img2 = document.getElementById("img2");
	
		var myOption = -1;
		for (var i = form.id1.length-1; i > -1; i--) {
			if (form.id1[i].checked) {
				myOption = i; 
				i = -1;
			}
		}
		if (myOption == -1) {
			alert("You must select an image to edit by checking the box underneath the image");
			return false;
		}
	}
	if (stkcnt > 0) {
		if (form.stack_disp.value == "") {
		 	errorMessage("stack");
			return false;
		}
	}
	if (lbcnt > 0) {
		if (form.label_size.value == "" || form.label_txt.value == "") {
		 	errorMessage("label");
			return false;
		}
	}
	if (swcnt > 0) {
		if (form.swirl_angle.value == "") {
		 	errorMessage("swirl");
			return false;
		}
	}
	if (tntcnt > 0) {
		if (form.tint_pct.value == "") {
		 	errorMessage("tint");
			return false;
		}
	}
	if (cvcnt > 0) {
		if (form.curve_disp.value == "") {
		 	errorMessage("curve");
			return false;
		}
	}
	if (racnt > 0) {
		if (form.raise_disp.value == "") {
		 	errorMessage("raise");
			return false;
		}
	}
	if (wvcnt > 0) {
		if (form.wave_amp.value == "" || form.wave_len.value == "") {
		 	errorMessage("wave");
			return false;
		}
	}
	if (cv3cnt > 0) {
		if (form.curve3d_disp.value == "") {
		 	errorMessage("curve 3D");
			return false;
		}
	}
	if (ccnt > 0) {
		if (form.left.value == "" || form.right.value == "" || form.top.value == "" || form.bottom.value == "") {
		 	errorMessage("crop");
			return false;
		}
	}
	if (emcnt > 0) {
		if (form.email_to.value == "" || form.email_from.value == "") {
			errorMessage("email it");
			return false;
		}
	}
	if (shcnt > 0) {
		if (form.shear_x.value == "" || form.shear_y.value == "") {
			errorMessage("shear");
			return false;
		}
	}
	if (rcnt > 0) {
		if (form.angle.value == "") {
			errorMessage("rotate");
			return false;
		}
	}
	if (sbcnt > 0) {
		if (form.sb_width.value == "" || form.sb_height.value == "") {
			errorMessage("scramble");
			return false;
		}
	}
	if (mcnt > 0) {
		if (form.dst_x.value == "" || form.dst_y.value == "" || form.src_x.value == "" || form.src_y.value == "" || form.src_w.value == "" || form.src_h.value == ""
			|| form.pct.value == "") {
			errorMessage("merge");
			return false;
		}
	}
	if (m2cnt > 0) {
		if (form.m2_pct.value == "") {
			errorMessage("merge 2");
			return false;
		}
	}
	if (mtcnt > 0) {
		if (form.cell_w.value == "" || form.cell_h.value == "" || form.montage_w.value == "" || form.montage_h.value == "") {
			errorMessage("montage");
			return false;
		}
	}	
	if (rscnt > 0) {
		if (form.new_w.value == "" || form.new_h.value == "") {
			errorMessage("resize");
			return false;
		}
	}	
	if (slcnt > 0) {
		if (form.spct.value == "") {
			errorMessage("scale");
			return false;
		}
	}
	if (iscnt > 0) {
		if (form.font_size.value == "" || form.font_angle.value == "" ||  form.font_text.value == "" ) {
			errorMessage("insert text");
			return false;
		}
	}
	if (imcnt > 0) {
		if (form.im_font_size.value == "" || form.im_font_text.value == "" ) {
			errorMessage("insert message");
			return false;
		}
	}		
	if (fmcnt > 0) {
		if (form.frame_thickness.value == "" ) {
			errorMessage("frame");
			return false;
		}
	}	
	if (recnt > 0) {
		if (form.round_radius.value == "" ) {
			errorMessage("round edges");
			return false;
		}
	}	
	if (tlcnt > 0) {
		if (form.tile_w.value == "" || form.tile_h.value == "" ) {
			errorMessage("tile");
			return false;
		}
	}
	if (rfcnt > 0) {
		if (form.rframe_thickness.value == "" || form.rframe_radius.value == "" ) {
			errorMessage("round frame");
			return false;
		}
	}	
	if (tcnt > 0) {
		if (form.tomb_thickness.value == "" ) {
			errorMessage("tombstone");
			return false;
		}
	}
	if (tri3cnt > 0) {
		if (form.tri3_thickness.value == "" ) {
			errorMessage("triangulate 3D");
			return false;
		}
	}			
	if (tri3cnt > 0) {
		if (form.py_thickness.value == "" ) {
			errorMessage("pyramid");
			return false;
		}
	}
	
	document.getElementById("container").style.visibility = 'visible';
	
	return true;
}

function swap(id) {
	src1 = document.getElementById(id).src;
	src2 = document.getElementById('i1').src;
	document.getElementById(id).src = src2;
	document.getElementById('i1').src = src1;
	document.getElementById('img2').value = src1;
	
	//update hidden tag for img2
	document.getElementById('v2').value = src1;

	//update subs
	id2 = "p" + id;
	document.getElementById(id2).value = src2;
}

function toggle() {
	src1 = document.getElementById('i0').src;
	document.getElementById('i0').src = document.getElementById('i1').src;
	document.getElementById('i1').src = src1;

	document.getElementById('v1').value = document.getElementById('i0').src;
	document.getElementById('v2').value = document.getElementById('i1').src;

	document.getElementById('img1').value = document.getElementById('v1').value;
	document.getElementById('img2').value = document.getElementById('v2').value;
}

