// JavaScript Document
function products_resetAdvisorSearch() {
	var selects = $('ProductAdvisorForm').getElementsByTagName("select");	
	for(var i = 1; i < selects.length; i++) {
		selects[i].value = "";	
	}
}

function products_runAdvisorSearch (ProductLine)
{
	new Ajax.Request('/products/prodadvisor_search/' + ProductLine + '.htm',
		{
			method: 'post',
			parameters: $('ProductAdvisorForm').serialize(true),
			onSuccess: products_runAdvisorSearchCB,
			onFailiure: function () {
				alert('Some clean failiure message here');
			}
		}
	);
}

function products_runAdvisorSearchCB(transport) {
	try {
		var xml 	= transport.responseXML;
		var skus 	= xml.getElementsByTagName('sku');
		
		// Hide all existing add to cart areas
		$('nomatch').style.display = 'none';
		$('multimatch').style.display = "none";
		var advSelectors = $$('div.prodAdvisorHeroPrice');
		if (advSelectors.length > 0)
		{
			for (var i = 0; i < advSelectors.length; i++)
			{
				advSelectors[i].style.display = 'none';
			}
		}
		
		//Hide all  skus & skus Tab
		$('Menu_Tab_ProdRange').style.display = "none";
		//show_tab('Tab_Desc');
		var skuDivs = $$('div.skuContainer');
		for(var i = 0; i < skuDivs.length; i++) {
			skuDivs[i].style.display = "none";	
		}
		
		if (skus.length < 1)
		{
			// No Skus were found
			$('nomatch').style.display = '';
		} else if(skus.length == 1){					
			var sku = skus[0];
			$('prodadv_' + sku.getAttribute('id')).style.display = '';
		} else {
			$('multimatch').style.display = "";
			//Show relevant Skus in Sky view
			$('Menu_Tab_ProdRange').style.display = "";
			//show_tab('Tab_ProdRange');
			for(var i = 0; i < skus.length; i++) {
				$('sku_'+skus[i].getAttribute("id")).style.display = "";
			}
		}
		
		//repopulate select fields
		var fields = xml.getElementsByTagName("field");
		for(var i = 0; i < fields.length; i++) {
			var fieldSelect = $('field_'+fields[i].getAttribute("id"));
			var currentValue = fieldSelect.value;
			var child = fieldSelect.firstChild;
			while(child != null) {
				child.parentNode.removeChild(child);
				child = fieldSelect.firstChild;
			}
			
			
			var values = fields[i].getElementsByTagName("value");
			for(var j = 0; j < values.length; j++) {
				var option = new Element("option", {value:values[j].getAttribute("value") != null ? values[j].getAttribute("value") : ''});
				option.update(values[j].firstChild != null ? values[j].firstChild.data : '');
				if(option.value == currentValue) option.selected = "selected";
				fieldSelect.appendChild(option);
			}
			
			//IE fix
			fieldSelect.style.width = "5px";
			fieldSelect.style.width = "auto";
		}
	}
	catch(e) {
		alert(e);
	}
}

function showpic (image, width, height)
{
	/*

	try {
		var popup = window.open('/images/products/' + image, 'ViewPicture', 'status=1,toolbar=0,scrollbars=0,location=0,width=' + width + ',height=' + height);
	} catch(e) { alert(e.lineNumber + '\n' + e); }
	
		This will now pop up a page
	*/
	var popup = window.open('/products/showimage/' + image + '.htm', 'ViewPicture', 'status=1,toolbar=0,scrollbars=0,location=0,width=' + width + ',height=' + height);
}

var ratingsXml;

function initRatings (ProductID)
{	
	new Ajax.Request('/products/get_ratings_xml/' + ProductID + '.htm', {
		method:"get",
		onSuccess:function(transport) {
			//alert(transport.responseText);
			try {
				var ratingsXml = transport.responseXML;

				// App type div
				var appType = document.getElementById('app_type');
				if (ratingsXml.getElementsByTagName('rating_count')[0] == null)
				{
					var rating_count = 0;
				} else {
					var rating_count = ratingsXml.getElementsByTagName('rating_count')[0].firstChild.data;
				}
				
				var ratings = ratingsXml.getElementsByTagName('rating');
				if (rating_count == 0)
				{
					//appType.innerHTML = 'Not Rated';
					$('appRatingsContainer').style.display = "none";
				} else {
					if (ratings.length > 0)
					{
						// <select />
						var selectTag 	= document.createElement('select');
						selectTag.setAttribute('id', 'rating_menu');
						selectTag.style.cssText = 'font-size:11px;';
						selectTag.onchange = function () {
							getRating(ratingsXml);
						}
						
						// <option />
						var ratings = ratingsXml.getElementsByTagName("rating");
						for (i=0; i<ratings.length; i++)
						{
							var rating = ratings[i];
		
							var option = document.createElement('option');
							option.value = rating.getAttribute('id');
							option.innerHTML = rating.getAttribute('name');
							selectTag.appendChild(option);
						}
						
						// Render
						appType.appendChild(selectTag);
					}
					
					
					getRating(ratingsXml);
				}
			} catch(e) { alert(e.lineNumber + '\n' + e); }
		},
		onFailure:function(transport) {
			alert("FAIL!\n"+transport.responseText);	
		}
	});
}

function getRating (ratingsXml)
{
	var menu 	= document.getElementById('rating_menu');
	var appid 	= menu.options[menu.options.selectedIndex].value;
	var display	= document.getElementById('app_rating');
	
	// higher_products_display
	var higher_display = document.getElementById('higher_products_display');
	
	var ratings = ratingsXml.getElementsByTagName("rating");
	for (i=0; i<ratings.length; i++)
	{
		var rating = ratings[i];
		if (rating.getAttribute('id') == appid)
		{	
			// Reset display
			display.innerHTML = '';
			
			// <img src="/images/autosport/holding/stars.png" width="96" height="16" />
			for (j=0; j<rating.getAttribute('score'); j++)
			{
				var star = createPNGImage('/images/icons/star.png', 16, 16);
				star.className = 'ratingStar';
				star.setAttribute('alt', 'Rating'); 
				display.appendChild(star);
			}
			
			var grey_count = 5 - rating.getAttribute('score');
			for (k=0; k<grey_count; k++)
			{
				var star = createPNGImage('/images/icons/star_off.png', 16, 16);
				star.className = 'ratingStar';
				star.setAttribute('alt', 'Rating'); 
				display.appendChild(star);
			}
			
			// We have show the star rating, now lets update the higher rated tab?
			// Reset display
			higher_display.innerHTML = '';
			
			// Get the higher rated items
			var higher_products = rating.getElementsByTagName('higher');
			//alert(higher_products.length);
			//var higher_rated_text 			= document.getElementById('higher_rated_text');
			//higher_rated_text.style.display	= 'none';
			
			if (higher_products.length > 0)
			{
				
				// Put in a header
				var header = document.createElement('div');
				header.style.cssText 	= "margin-bottom:15px;";
				header.innerHTML 		= higher_products.length + " related products were found with a higher rating for " + rating.getAttribute('name') + '.';
				higher_display.appendChild(header);
				
				for (t=0; t<higher_products.length; t++)
				{
					var product = higher_products[t];
					
					// <div class="accessory_container booples">
					var container = document.createElement('div');
					container.className = 'accessory_container booples';
						
						// Right Container
						// <div style="width:170px; float:right;">
						var right_container = document.createElement('div');
						right_container.style.cssText = 'width:127px; float:right;';

							// Rating
							//right_container.appendChild(document.createTextNode(rating.getAttribute('name') + ': '));
							
							for (j=0; j<product.getAttribute('Rating'); j++)
							{
								var star = createPNGImage('/images/icons/star.png', 16, 16);
								star.className = 'ratingStar';
								star.setAttribute('alt', 'Rating'); 
								right_container.appendChild(star);
							}
							
							var grey_count = 5 - product.getAttribute('Rating');;
							for (k=0; k<grey_count; k++)
							{
								var star = createPNGImage('/images/icons/star_off.png', 16, 16);
								star.className = 'ratingStar';
								star.setAttribute('alt', 'Rating'); 
								right_container.appendChild(star);
							}
											
							
						container.appendChild(right_container);	
					
					
						// Left Container
						// <div class="booples" style="width:390px;">
						var left_container = document.createElement('div');
						left_container.className 		= 'booples';
						left_container.style.cssText 	= 'width:390px;';
							
							// Image
							// <div class="list_image" title="<?php echo $accessory->Name; ?>" ...
							var image = document.createElement('div');
							image.className = 'accessoryImage';
							image.setAttribute('title', product.getAttribute('Name'));
							//console.log(product.getAttribute('ImageUrl'));
							if (!product.getAttribute('ImageUrl'))
							{
								// style="background-color:#FFFFFF;"
								image.style.cssText = "background-color:#FFFFFF;";
							} else {
								// style="background:url('<?php echo $accessory->Image->Fileurl; ?>') no-repeat center center #ffffff;"
								image.style.cssText = "background:url('" + product.getAttribute('ImageUrl') + "') center center #ffffff;";
							}
							left_container.appendChild(image);
							
							// Text Container
							// <div class="booples" style="float:left; padding:5px; width:250px; height:100px;">
							var text_container = document.createElement('div');
							text_container.className		= "booples";
							text_container.style.cssText 	= "float:left; padding:5px; width:250px;";
								
								// H2
								var h2 = document.createElement('h2');
									// A
									// <a href="/products/<?php if (empty($accessory->SeoUrl) == FALSE) { echo $accessory->SeoUrl; } else { echo $accessory->ID; } ?>.htm" title="<?php echo $accessory->Name; ?>"><?php echo $accessory->Name; ?></a>
									var ahref = document.createElement('A');
									ahref.innerHTML = product.getAttribute('Name');
									ahref.setAttribute('title', product.getAttribute('Name'));
									if (!product.getAttribute('SeoUrl'))
									{
										ahref.setAttribute('href', '/products/' + product.getAttribute('ID') + '.htm');
									} else {
										ahref.setAttribute('href', '/products/' + product.getAttribute('SeoUrl') + '.htm');
									}
									h2.appendChild(ahref);
								text_container.appendChild(h2);
									
								// Span
								var span = document.createElement('span');
								span.className = "price";
								span.innerHTML = product.getAttribute('Price');
								text_container.appendChild(span);
																
								// BR
								var br = document.createElement('br');
								text_container.appendChild(br);
								
								//Shortdesc
								text_container.appendChild(document.createTextNode(product.getAttribute('ShortDesc')));
							
							left_container.appendChild(text_container);
						container.appendChild(left_container);
					higher_display.appendChild(container);
				}
				
				// Display notice
				//higher_rated_text.style.display = '';				
				
			} else {
				higher_display.appendChild(document.createTextNode('There are no higher rated items for the selected application.'));
			}
		}
	}
}

function getTabID (field)
{
	var parent = field.parentNode;
	if (parent.tagName.toUpperCase() == 'DIV')
	{
		return parent.id;
	} else {
		return getTabID(parent);
	}	
}

function show_tab (tab)
{
	try {
		var menuitems = document.getElementById('navlist').getElementsByTagName('li');
		for (i=0; i<menuitems.length; i++)
		{
			
			if (menuitems[i].id == 'Menu_' + tab)
			{
				menuitems[i].getElementsByTagName('a')[0].id 	= 'active';
				//menuitems[i].getElementsByTagName('span')[0].id = 'active1';
			} else {
				menuitems[i].getElementsByTagName('a')[0].id 	= '';
				//menuitems[i].getElementsByTagName('span')[0].id = '';
			}
			menuitems[i].getElementsByTagName('a')[0].blur();
		}
		
		var divitems = document.getElementsByTagName('div');
		for (i = 0; i < divitems.length; i++)
		{
			if (divitems[i].className == 'productDetailContainer')
			{
				if (divitems[i].id == tab)
				{
					divitems[i].style.display = '';
				} else {
					divitems[i].style.display = 'none';
				}
			}
		}
	} catch (e) {
		alert(e);
	}
}

function toggleSpecSheet(id)
{
	if(document.getElementById("matrix_"+id).style.display == '') {
		document.getElementById("matrix_"+id).style.display = 'none';
		document.getElementById("sku_"+id).style.borderBottom = "1px solid #000000;";
	}
	else {
		document.getElementById("matrix_"+id).style.display = '';
		document.getElementById("sku_"+id).style.borderBottom = "";
	}
}