function createRequestObject() {
	var ro;
	var browser = navigator.appName;
	if (browser == "Microsoft Internet Explorer") {
		ro = new ActiveXObject("Microsoft.XMLHTTP");
	}
	else {
		ro = new XMLHttpRequest();
	}
	return ro;
}

function getSubCategories() {

	// some default values, these need global scope
	var cat = 0;
	var subcat = 0;
	var getURL = '';
	var updateID = '';
	var http;
	
	// specific to this site, grab the cat ID
	if (document.getElementById('cat_id')) {
		cat = document.getElementById('cat_id').value;
	}
	
	// specific to this site, grab the cat ID
	if (document.getElementById('selectedSubCatID')) {
		subcat = document.getElementById('selectedSubCatID').value;
	}
	
	// ooh, nested functions. Isn't javascript clever ;-)
	
	function handleResponse() {
		// updates element on page with HTML from server-side script (should be XML?...)
		if (http.readyState == 4) {
			var response = http.responseText;
			if (document.getElementById(updateID)) {
				document.getElementById(updateID).innerHTML = response;
			}
			http = null; // don't need this anymore, null so we can create another
		} else {
			//alert('status '+ http.status + '. readyState ' + http.readyState);
		}
	}
	
	function doAjaxRequest() {	
		// setup the ajax object, define the response handler and send the data
		http = createRequestObject();
		http.open('GET', getURL);
		//http.setRequestHeader('Content-Length', '52282');
		//alert('content-length ' + http.getResponseHeader('Content-Length'));
		http.onreadystatechange = handleResponse;
		http.send(null);
	}
	
	// the ID of the element to update
	updateID = 'subcategories';
	// the serverside script to handle processing
	getURL = '/inc/ajax-subcategories.php?cat=' + cat + '&subcat=' + subcat;
	// do the ajax thing
	doAjaxRequest();
	
}

function doAjax(module, action) {

	// some default values, these need global scope
	var cat = 0;
	var getURL = '';
	var updateID = '';
	var http;
	
	// specific to this site, grab the product type ID
	if (document.getElementById('catID')) {
		cat = document.getElementById('catID').value;
	}
	
	// ooh, nested functions. Isn't javascript clever ;-)
	
	function handleResponse() {
		// updates element on page with HTML from server-side script (should be XML?...)
		if (http.readyState == 4) {
			var response = http.responseText;
			if (document.getElementById(updateID)) {
				document.getElementById(updateID).innerHTML = response;
			}
			http = null; // don't need this anymore, null so we can create another
		}
	}
	
	function doAjaxRequest() {	
		// setup the ajax object, define the response handler and send the data
		http = createRequestObject();
		http.open('post', getURL);
		http.onreadystatechange = handleResponse;
		http.send(null);
	}
	
	// switch statement sets up params for each module
	switch (module) {
			
		// colors module
		case 'colours' :
			var newColour = '';
			// get the new colour
			if (document.getElementById('newColour')) {
				newColour = document.getElementById('newColour').value;
			}
			// the ID of the element to update
			updateID = 'colours';
			// the serverside script to handle processing
			getURL = 'ajax-colours.php?action=' + action + '&cat=' + cat + '&colour=' + newColour;
			// clear the input
			if (document.getElementById('newColour')) {
			document.getElementById('newColour').value = '';
			}
			// do the ajax thing
			doAjaxRequest();
			break;
			
		// sizes modules
		case 'sizes' :
			var newSize = '';
			// get the new size
			if (document.getElementById('newSize')) {
				newSize = document.getElementById('newSize').value;
			}
			// the ID of the element to update
			updateID = 'sizes';
			// the serverside script to handle processing
			getURL = 'ajax-sizes.php?action=' + action + '&cat=' + cat + '&size=' + newSize;
			// reset the field
			if (document.getElementById('newSize')) {
				document.getElementById('newSize').value = '';
			}
			// do the ajax thing
			doAjaxRequest();
			break;
	}
	
}