function removeElement(element_id) {
	var parent = document.getElementById(element_id).parentNode;
	parent.removeChild(document.getElementById(element_id));
}

function createOptionSet(element_id) {
	var option_name = prompt("What is the name of this option?  Examples: 'Size', 'Color.'", "");
	var option_set = document.createElement("select");
	option_set.setAttribute("id", element_id);
	option_set.setAttribute("multiple", "multiple");
	option_set.setAttribute("name", element_id);
	option_set.setAttribute("size", "4");
	option_set.add(new Option(option_name, option_name + ":0"), null);
	insertAfter(option_set, document.getElementById("create_" + element_id));

	var button_delete = document.createElement("input");
	button_delete.setAttribute("type", "button");
	button_delete.setAttribute("value", "Delete selected option");
	button_delete.setAttribute("onclick", "deleteOption('" + element_id + "')");
	insertAfter(button_delete, document.getElementById(element_id));

	var button_edit = document.createElement("input");
	button_edit.setAttribute("type", "button");
	button_edit.setAttribute("value", "Edit selected option");
	button_edit.setAttribute("onclick", "editOption('" + element_id + "')");
	insertAfter(button_edit, document.getElementById(element_id));

	var button_add = document.createElement("input");
	button_add.setAttribute("type", "button");
	button_add.setAttribute("value", "Add option");
	button_add.setAttribute("onclick", "addOption('" + element_id + "')");
	insertAfter(button_add, document.getElementById(element_id));

	removeElement("create_" + element_id);

	do
	{
		addOption(element_id);
		var user_response = prompt("Add another option?  Y/N", "Y");
	} while (user_response == "Y");
}


function addOption(element_id) {
	var new_option = prompt("What is the option?", "");
	var new_price_adjustment = prompt("How does this option change the base price?  For example, '5' means the option raises the price by $5 and '-5' lowers the price by $5.  '0' means no change.", "0");

	var newOption = new_option + ":" + new_price_adjustment;


	if (new_price_adjustment == 0) {
		var newText = new_option;
	}
	else {
		var patt1 = new RegExp("-");
		if (patt1.test(new_price_adjustment)) {
			new_price_adjustment = new_price_adjustment.substr(1);
			var newText = new_option + " - Subtract $" + new_price_adjustment;
		}
		else {
			var newText = new_option + " - Add $" + new_price_adjustment;
		}
	}

	var x = document.getElementById(element_id);
	x.options[x.length] = new Option(newText, newOption);
}

function editOption(element_id) {
	var x = document.getElementById(element_id);
	current_value = x.options[x.selectedIndex].value;

	// split value by colon into array
	current_value = current_value.split(":");

	// get second array element (price adjustment)
	current_option = current_value[0];
	current_price_adjustment = current_value[1];

	var new_option = prompt("What is the option?", current_option);
	var new_price_adjustment = prompt("How does this option change the base price?  For example, '5' means the option raises the price by $5 and '-5' lowers the price by $5.  '0' means no change.", current_price_adjustment);
	var newOption = new_option + ":" + new_price_adjustment;


	if (new_price_adjustment == 0) {
		var newText = new_option;
	}
	else {
		var patt1 = new RegExp("-");
		if (patt1.test(new_price_adjustment)) {
			new_price_adjustment = new_price_adjustment.substr(1);
			var newText = new_option + " - Subtract $" + new_price_adjustment;
		}
		else {
			var newText = new_option + " - Add $" + new_price_adjustment;
		}
	}

	var x = document.getElementById(element_id);
	x.options[x.selectedIndex].value = newOption;
	x.options[x.selectedIndex].text = newText;
}

function deleteOption(element_id) {
	var x = document.getElementById(element_id);
	x.options[x.selectedIndex] = null;
}

function prepareSubmission() {
	if (document.getElementById('option1'))
	{
		var option1_text_string;
		length = document.getElementById('option1').length;
		for (i = 0; i < length; i++)
		{
			if (i == 0)
			{
				option1_text_string = document.getElementById('option1').options[i].value;
			}
			else {
				option1_text_string = option1_text_string + "|"  + document.getElementById('option1').options[i].value;
			}			
		}
	}
	alert(option1_text_string);
}


var side;

function flip(element, frontImage, backImage)
{
	if (side == undefined)
	{
		side = "front";
	}

	element = document.getElementById(element);

	if (side == "front")
	{
		var object = "document." + element + ".src = '" + backImage + "';";
		eval(object);
		side = "back";
	}
	else
	{
		var object = "document." + element + ".src = '" + frontImage + "';";
		eval(object);
		side = "front";
	}
}


function getHint(input, script) {
	xmlHttp = GetXmlHttpObject();

	if (xmlHttp == null) {
		alert("Your browser does not support AJAX.");
		return;
	}

	if (parent == "") {
		return;
	}

	// build url
	var url = script;
	url = url + "?input=" + input;
	url = url + "&sid=" + Math.random();

	xmlHttp.onreadystatechange = stateChanged1;
	xmlHttp.open("GET", url, true);
	xmlHttp.send(null);
}

function stateChanged1() {
	if (xmlHttp.readyState == 4) {
		title = document.getElementById("title");
		input = title.value;
		position = xmlHttp.responseText.toLowerCase().indexOf(input, 0);

			if (position == 0 && title.length > input.length)
			{
				title = xmlHttp.responseText;

				if (title.createTextRange)
				{
					selected_range = title.createTextRange();
					selected_range.findText(xmlHttp.responseText.substr(input.length));
					selected_range.select();
				}

				else
				{
					title.setSelectionRange(input.length, title.length);
				}

				return;
			}
	}
}


function getSubcategories(parent) {
	xmlHttp = GetXmlHttpObject();

	if (xmlHttp == null) {
		alert("Your browser does not support AJAX!");
		return;
	}

	if (parent == "") {
		return;
	}

	var url = "getsubcategories.php";
	url = url + "?parent=" + parent;
	url = url + "&sid=" + Math.random();
	xmlHttp.onreadystatechange = stateChanged;
	xmlHttp.open("GET", url, true);
	xmlHttp.send(null);
}

function insertAfter(new_element, target_element) {
	var parent = target_element.parentNode;
	if (parent.lastChild == target_element) {
		parent.appendChild(new_element);
	}

	else {
		parent.insertBefore(new_element, target_element.nextSibling);
	}
}

function stateChanged() {
	if (xmlHttp.readyState == 4) {
		var results = xmlHttp.responseText;

		if (results != "") {
			results = results.split("|");
			no_results = results.length;

			if (document.getElementById("subcategory")) {
				var new_select = document.getElementById("subcategory");
				new_select.options.length = 0;

				for (var i = 0; i < no_results; i++) {
					results2 = results[i].split(":");
					new_select.add(new Option(results2[1], results2[0]), null);
				}
			}

			else {
				var new_select = document.createElement("select");
				new_select.setAttribute("id", "subcategory");
				new_select.setAttribute("multiple", "multiple");
				new_select.setAttribute("name", "subcategory");
				new_select.setAttribute("size", "4");
				
				for (var i = 0; i < no_results; i++) {
					results2 = results[i].split(":");
					new_select.add(new Option(results2[1], results2[0]), null);
				}

				insertAfter(new_select, document.getElementById("cid"));
			}
		}

		else {
			if (document.getElementById("subcategory"))
			{
				var category = document.getElementById("subcategory").parentNode;
				category.removeChild(document.getElementById("subcategory"));
			}
		
		}

	}
}

function GetXmlHttpObject() {
	var xmlHttp = null;

	try {
		// Firefox, Opera 8.0+, Safari
		xmlHttp = new XMLHttpRequest();
	}

	catch (e) {
		// Internet Explorer
		try {
			xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
		}

		catch (e) {
			xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
		}
	}

	return xmlHttp;
}

// show or hide division near mouse position
function popupDiv(image, label, width, height) {
	if (document.getElementById("popup")) {
		document.getElementsByTagName("body")[0].removeChild(document.getElementById("popup"));
	}
	else {
		height = height + 25;
		var margin_top = height / 2;
		var margin_left = width / 2;

		// get popup
		var popup = document.createElement("div");
		popup.setAttribute("id", "popup");
		popup.setAttribute("style", "background-color: #ccc; border: solid 1px #000; position: absolute; top: 50%; margin-top: -" + margin_top + "px; left: 50%; margin-left: -" + margin_left + "px; width: " + width + "px; height: " + height + "px");
		var image_tag = document.createElement("img");
		image_tag.setAttribute("src", "photos/" + image);
		popup.appendChild(image_tag);
		var paragraph = document.createElement("a");
		paragraph.setAttribute("onclick", "popupDiv()");
		label_text = document.createTextNode("Close");
		paragraph.appendChild(label_text);
		insertAfter(paragraph, image_tag);
		document.getElementsByTagName("body")[0].appendChild(popup);
	}
}

// show or hide division near mouse position
function popupDiv2(div, event) {
	// get popup
	var popup = document.getElementById(div);

	// get screen width and height
	if (window.innerWidth) {
		window_width = window.innerWidth;
		window_height = window.innerHeight;
	}
	else if (document.documentElement.clientWidth) {
		window_width = document.documentElement.clientWidth;
		window_height = document.documentElement.clientHeight;
	}
	else {
		window_width =  document.body.clientWidth;
		window_height =  document.body.clientHeight;
	}

	// get popup width and height
	if (popup.currentStyle) {
		popup_width = parseInt(popup.currentStyle.width);
		popup_height = parseInt(popup.currentStyle.height);
	}
	else {
		popup_style = window.getComputedStyle(popup, "");
		popup_width = parseInt(popup_style.getPropertyValue("width"));
		popup_height = parseInt(popup_style.getPropertyValue("height"));
	}

	// hide popup
	if (document.getElementById(div).style.display == "block") {
		document.getElementById(div).style.display = "none";
	}

	// position popup as close to mouse click as possible
	else {
		// position popup horizontally
		if (window_width > event.clientX + popup_width + 20) {
			popup.style.left = event.clientX + "px";
		}
		else {
			popup.style.left = window_width - (popup_width + 20) + "px";
		}

		// position popup vertically
		if (window_height > event.clientY + popup_height + 20) {
			popup.style.top = event.clientY + "px";
		}
		else {
			popup.style.top = window_height - (popup_height + 20) + "px";
		}

		// show popup
		popup.style.display = "block";
	}
}


// add onload function
function addLoadEvent(func) {
	// get current onload functions
	var oldonload = window.onload;

	// add first onload function
	if (typeof window.onload != 'function') {
		window.onload = func;
	}

	// add additional onload functions
	else {
		window.onload = function() {
			oldonload();
			func();
		}
	}
}

// prepare drop-down menu
function prepareDropDownMenu() {
	if (!document.getElementById("menu")) {
		return;
	}

	// background color variables
	color_highlight = "#ccf";
	color_normal = "#99c";

	// get menu buttons
	buttons = document.getElementById("menu").childNodes;

	// prepare menu buttons
	for (i = 0; i < buttons.length; i++) {
		// skip newline nodes
		if (buttons[i].nodeValue != "\n") {
			// skip drop-down menus for now
			if (buttons[i].getElementsByTagName("ul").length > 0) {
				// display drop-down menus
				buttons[i].onmouseover = function() {
					this.getElementsByTagName("ul")[0].style.display = "block";
					this.style.backgroundColor = color_highlight;
				}

				// hide drop-down menus
				buttons[i].onmouseout = function() {
					this.getElementsByTagName("ul")[0].style.display = "none";
					this.style.backgroundColor = color_normal;
				}

				// highlight current selection in drop-down menus
				for (n = 0; n < buttons[i].getElementsByTagName("li").length; n++) {
					buttons[i].getElementsByTagName("li")[n].onmouseover = function() {
						this.style.backgroundColor = color_highlight;
					}

					buttons[i].getElementsByTagName("li")[n].onmouseout = function() {
						this.style.backgroundColor = color_normal;
					}
				}
			}

			// highlight current menu selection
			else {
				buttons[i].onmouseover = function() {
					this.style.backgroundColor = color_highlight;
				}

				// hide drop-down menus
				buttons[i].onmouseout = function() {
					this.style.backgroundColor = color_normal;
				}
			}
		}
	}
}

addLoadEvent(prepareDropDownMenu);