var xHRObject = false;
if (window.ActiveXObject) {
	xHRObject = new ActiveXObject("Microsoft.XMLHTTP");
}
else if (window.XMLHttpRequest){
	xHRObject = new XMLHttpRequest();
}
var response = false;
var products_id = 0;
var opt_id_used= 0;

function getData() {
	if (xHRObject.readyState == 4 && xHRObject.status == 200) {
        var serverResponse = xHRObject.responseXML;
		response = xHRObject.responseXML;
		if (serverResponse != null) {
			var itemsNode = serverResponse.getElementsByTagName('items');
			if (itemsNode.length > 0) {
				var attribute = itemsNode[0].attributes[0].value;
				if (attribute == 'loadImages') {
					var image_nav_container = document.getElementById('image_nav_container');
					image_nav_container.innerHTML = '';
					
					//set the first 3 images
					var item_node = serverResponse.getElementsByTagName('item');
					var images_array = new Array();
					for (i=0; i<item_node.length && i < 3; i++) {
						var image_array = get_image_array(item_node[i]);
						images_array[i] = image_array;
					}
					set_small_images(images_array);
					
					//set the displayed image
					set_medium_image(images_array[0]);
				}
			}
		}
	}
}


/* Function set_small_images(images_array)
images_array example:
Array
([0] => Array
        ( [image_id] => 20
          [image_path_small] => images/Hyperlite_Boards/BYERLY_52.jpg)
 [1] => Array
        ( [image_id] => 25
          [image_path_small] => images/Hyperlite_Boards/Cartel141S.jpg) 
)
*/
function set_small_images(images_array) {
	var image_nav_container = document.getElementById('image_nav_container');
	for (i=0; i<images_array.length; i++) {
		image_nav_container.innerHTML += '<a title="' + images_array[i]['image_title'] + '" id="image_small-' + i + '" href="javascript:showMedium(' + images_array[i]['image_id'] + ')" class="back image_small" style="width:75px;height:75px;">' + '<img id="' + images_array[i]['image_id'] + '" src="' + images_array[i]['image_path_small'] + '" title="' + images_array[i]['image_title'] + '" width="' + images_array[i]['image_width_small'] + '" height="' + images_array[i]['image_height_small'] + '"/>' + '</a>';		
	}
}

function set_medium_image(image_array) {
	var image_medium_container = document.getElementById('image_medium_container');
	image_medium_container.innerHTML = '<a title="' + image_array['image_title'] + '" href="javascript:popupWindowTemp(\'' + image_array['image_path_large'] + '\',' + (parseInt(image_array['image_width_large'])+10) +',' + (parseInt(image_array['image_height_large'])+10) + ')">' + '<img src="' + image_array['image_path_medium'] + '" title="' + image_array['image_title'] + '" width="' + image_array['image_width_medium'] + '" height="' + image_array['image_height_medium'] + '"/>' + '</a>';
}

function get_image_array(itemNode) {
	var image_ids_node = itemNode.getElementsByTagName('image_id');
	var image_paths_small_node = itemNode.getElementsByTagName('image_path_small');
	var image_width_small_node = itemNode.getElementsByTagName('image_width_small');
	var image_height_small_node = itemNode.getElementsByTagName('image_height_small');
	
	var image_paths_medium_node = itemNode.getElementsByTagName('image_path_medium');
	var image_width_medium_node = itemNode.getElementsByTagName('image_width_medium');
	var image_height_medium_node = itemNode.getElementsByTagName('image_height_medium');
	
	var image_paths_large_node = itemNode.getElementsByTagName('image_path_large');
	var image_width_large_node = itemNode.getElementsByTagName('image_width_large');
	var image_height_large_node = itemNode.getElementsByTagName('image_height_large');
	
	var image_titles_node = itemNode.getElementsByTagName('image_title');
	
	var image_array = new Array();
	var i = 0;
	if (window.ActiveXObject) {	
		image_array['image_id'] = image_ids_node[i].text;
		
		image_array['image_path_small'] = image_paths_small_node[i].text;
		image_array['image_width_small'] = image_width_small_node[i].text;
		image_array['image_height_small'] = image_height_small_node[i].text;
		
		image_array['image_path_medium'] = image_paths_medium_node[i].text;
		image_array['image_width_medium'] = image_width_medium_node[i].text;
		image_array['image_height_medium'] = image_height_medium_node[i].text;
		
		image_array['image_path_large'] = image_paths_large_node[i].text;
		image_array['image_width_large'] = image_width_large_node[i].text;
		image_array['image_height_large'] = image_height_large_node[i].text;
		
		image_array['image_title'] = image_titles_node[i].text;
	}
	else {
		image_array['image_id'] = image_ids_node[i].textContent;
		image_array['image_path_small'] = image_paths_small_node[i].textContent;
		image_array['image_width_small'] = image_width_small_node[i].textContent;
		image_array['image_height_small'] = image_height_small_node[i].textContent;
		
		image_array['image_path_medium'] = image_paths_medium_node[i].textContent;
		image_array['image_width_medium'] = image_width_medium_node[i].textContent;
		image_array['image_height_medium'] = image_height_medium_node[i].textContent;
		
		image_array['image_path_large'] = image_paths_large_node[i].textContent;
		image_array['image_width_large'] = image_width_large_node[i].textContent;
		image_array['image_height_large'] = image_height_large_node[i].textContent;
		
		image_array['image_title'] = image_titles_node[i].textContent;
	}
	
	return image_array;
}

function loadImages() {
	var image_medium_container = document.getElementById('image_medium_container');
	products_id = document.getElementById('products_id').value;
	opt_id_used = document.getElementById('opt_id_used').value;
	
	image_medium_container.innerHTML = '<img src="images/web_images/indicator.gif" style="margin-top:145px" />';	
//combo box
	if (document.getElementById('attrib-' + opt_id_used)) {
		var option_used = document.getElementById('attrib-' + opt_id_used);
		var options_values_id = option_used.value;
		//option_used.onchange = 'loadImages(' + products_id + ', ' + opt_id_used + ')';
		//option_used.setAttribute('onchange','loadImages(' + products_id + ', ' + opt_id_used + ')');
		if (option_used.attachEvent) {
			option_used.attachEvent('onchange',loadImages);
		}
		else {
			option_used.setAttribute('onchange','loadImages()');
		}
	}
//radio button
	else {
		var option_used = document.forms['cart_quantity'].elements['id[' + opt_id_used + ']'];
		var options_values_id = getCheckedValue(option_used);
		for (i=0;i<option_used.length;i++) {
			//option_used[i].onchange = 'loadImages(' + products_id + ', ' + opt_id_used + ')';
			//option_used[i].setAttribute('onchange','loadImages(' + products_id + ', ' + opt_id_used + ')');
			if (option_used.attachEvent) {
				option_used[i].attachEvent('onchange',loadImages);
			}
			else {
				option_used[i].setAttribute('onchange','loadImages()');
			}
		}
	}
	
	//The incompatibilities are crazed me out!!!
	if (window.ActiveXObject) {
		xHRObject.open("GET","AJAX_servers/AJAX_image_swapper_server.php?action=loadImages&products_id=" + products_id + "&options_id=" + opt_id_used + "&options_values_id=" + options_values_id + "&id=" + Number(new Date), true);	
		xHRObject.onreadystatechange = getData;
	}
	else if (window.XMLHttpRequest){
		xHRObject.onreadystatechange = getData;
		xHRObject.open("GET","AJAX_servers/AJAX_image_swapper_server.php?action=loadImages&products_id=" + products_id + "&options_id=" + opt_id_used + "&options_values_id=" + options_values_id + "&id=" + Number(new Date), true);	
	}
	xHRObject.send(null);
}

function showMedium(image_id) {
	var image_medium_container = document.getElementById('image_medium_container');
	image_medium_container.innerHTML = '<img src="images/web_images/indicator.gif" style="margin-top:145px" />';	
	
	var image_array = new Array();

	var node = getItemNode('image_id', image_id);

	var image_ids_node = node.getElementsByTagName('image_id');
	
	var image_paths_medium_node = node.getElementsByTagName('image_path_medium');
	var image_width_medium_node = node.getElementsByTagName('image_width_medium');
	var image_height_medium_node = node.getElementsByTagName('image_height_medium');
	
	var image_paths_large_node = node.getElementsByTagName('image_path_large');
	var image_width_large_node = node.getElementsByTagName('image_width_large');
	var image_height_large_node = node.getElementsByTagName('image_height_large');
	
	var image_titles_node = node.getElementsByTagName('image_title');
					
	if (window.ActiveXObject) {	
		image_array['image_id'] = image_ids_node[0].text;
		
		image_array['image_path_medium'] = image_paths_medium_node[0].text;
		image_array['image_width_medium'] = image_width_medium_node[0].text;
		image_array['image_height_medium'] = image_height_medium_node[0].text;
		
		image_array['image_path_large'] = image_paths_large_node[0].text;
		image_array['image_width_large'] = image_width_large_node[0].text;
		image_array['image_height_large'] = image_height_large_node[0].text;
		
		image_array['image_title'] = image_titles_node[0].text;
	}
	else {
		image_array['image_id'] = image_ids_node[0].textContent;
		
		image_array['image_path_medium'] = image_paths_medium_node[0].textContent;
		image_array['image_width_medium'] = image_width_medium_node[0].textContent;
		image_array['image_height_medium'] = image_height_medium_node[0].textContent;
		
		image_array['image_path_large'] = image_paths_large_node[0].textContent;
		image_array['image_width_large'] = image_width_large_node[0].textContent;
		image_array['image_height_large'] = image_height_large_node[0].textContent;
		
		image_array['image_title'] = image_titles_node[0].textContent;
	}
	set_medium_image(image_array);

}

function getItemNode(element, value) {
	if (xHRObject.readyState == 4 && xHRObject.status == 200) {
		var item_nodes = response.getElementsByTagName('item');
		var element_nodes = response.getElementsByTagName(element);
		for (i=0;i<element_nodes.length;i++) {
			var textValue = '';
			if (window.ActiveXObject) {	
				textValue = element_nodes[i].text;
			}
			else {
				textValue = element_nodes[i].textContent;
			}
			if (textValue == value) {
				return item_nodes[i];
			}
		}
	}
	else {
		return '';
	}
}

function popupWindowTemp(url, width, height) {
  window.open(url,'popupWindow','toolbar=no,location=no,directories=no,status=no,menubar=no,scrollbars=no,resizable=yes,copyhistory=no,width=' + width + ',height=' + height + ',screenX=150,screenY=150,top=150,left=150');
}

// return the value of the radio button that is checked
// return an empty string if none are checked, or
// there are no radio buttons
function getCheckedValue(radioObj) {
	if(!radioObj)
		return "";
	var radioLength = radioObj.length;
	if(radioLength == undefined)
		if(radioObj.checked)
			return radioObj.value;
		else
			return "";
	for(var i = 0; i < radioLength; i++) {
		if(radioObj[i].checked) {
			return radioObj[i].value;
		}
	}
	return "";
}

// set the radio button with the given value as being checked
// do nothing if there are no radio buttons
// if the given value does not exist, all the radio buttons
// are reset to unchecked
function setCheckedValue(radioObj, newValue) {
	if(!radioObj)
		return;
	var radioLength = radioObj.length;
	if(radioLength == undefined) {
		radioObj.checked = (radioObj.value == newValue.toString());
		return;
	}
	for(var i = 0; i < radioLength; i++) {
		radioObj[i].checked = false;
		if(radioObj[i].value == newValue.toString()) {
			radioObj[i].checked = true;
		}
	}
}