jQuery(window).ready(function(){
	
	
	
	// this title can be changed, it is shown in the dialog box that pops up with search results
	var title = "Browse our Products From A-Z below for a comprehensive overview on all products such as GPS and Scanners. Questions? Call us at 1.800.461.3223. We're on Facebook and Youtube so if you have time to kill stop by and click around.";
	
	// this is the relative path for photos shown in the search results
	var path = "/Images/Data Base Photos/IMAGES_DATABASE/";
	
	
	
	var resultsObj = jQuery('<div />').attr({'id':'results'}).css({'position':'relative', 'padding':'0'});
	
	resultsObj.append(jQuery('<table />').attr({'summary':'product description'}).html(jQuery('<thead><tr><th colspan="2">&nbsp;</th><th scope="col">Item#</th><th scope="col">$<abbr title="Canadian Dollar">CAD</abbr></th></tr><thead><tbody></tbody>')));
	
	jQuery("body").append(resultsObj);
	
	resultsObj.dialog({autoOpen: false, width: 830, height: jQuery(window).height() * 0.60, "title": title});
	
	jQuery("#searchform").submit(function() {
		
		var url = '/search/search.asp';
		
		var searchData = {};
		
		searchData.search = jQuery("#searchform input#search").val();
		
		if(jQuery("#searchform #f option:selected").length > 0 && jQuery("#searchform #f option:selected").attr('value') != '')
		{
			searchData.f = jQuery("#searchform #f option:selected").attr('value');
		}
		
		
		jQuery.getJSON(url, searchData, function(data, textStatus){
		
			jQuery("tbody", resultsObj).empty();
			jQuery.each(data.products, function(i, product) {
				if(!jQuery.isEmptyObject(product)) {
					
					var current = jQuery("<tr />");
					
					current.append(
						jQuery("<td />").addClass("img").append(
							
							jQuery("<img />").attr({
								"src": path + product.proifntn,
								"alt": "image for " + product.prosku
							}).click(function(){
								jQuery('tbody img.big', resultsObj).not(this).stop().animate({'width': '96px'}).removeClass('big');
								if(jQuery(this).hasClass('big')){
									jQuery(this).stop().animate({'width': '96px'}).removeClass('big');
								}else{
									jQuery(this).stop().animate({'width': '100%'}).addClass('big');
								}
							})	
							
						)
					);
					current.append(
						jQuery('<td class="style29" />').html('<p style="font-weight:bold;">' + product.pron + "</p><p>" + product.pros + "</p>")
					);
					current.append(
						jQuery("<td />").addClass("sku").html(product.prosku)
					);
					current.append(
						jQuery("<td />").addClass("price").html(parseFloat(product.prosp).toFixed(2))
					);
								
					jQuery("tbody", resultsObj).append(current);
				}
			});
			resultsObj.dialog("open");
		});
		
		return false;
		
	}).show("slow");

});
