var activeProduct, newProduct;

function prodPop(defaultParam, thisProduct) {

	if(thisProduct){
	} else {
		thisProduct = $(this);
	}
		
	// id is in the form "productboxpop_[product]"
	newProduct = thisProduct.children(".container").attr("id").substring(5);

	// Only kick off displaypanel slidey if selecting a non-active product;
	if(newProduct == activeProduct)
		return true;
	
	var productboxpop, productcontent;
	
	// Reset active productboxpop display and functionality
	if(activeProduct) {
		productboxpop = $("#prod_" + activeProduct).parent("div");
		productboxpop.removeClass("hltdbox").addClass('productbox');;
		productboxpop.css('background', 'url(homeImages/' + activeProduct + '-reg.jpg) no-repeat');
	}
	
	productboxpop = thisProduct;	
	prodActivate(productboxpop, newProduct);
	
}

function prodUnPop() {
};

function prodActivate(productboxpopId, newProduct) {

	productboxpop = $(productboxpopId);
	activeProduct = newProduct;

  productboxpop.removeClass("productbox").addClass('hltdbox');;
  productboxpop.css('background', 'url(homeImages/' + activeProduct + '-over.jpg) no-repeat');

	if (productboxpop.hasClass("initial")) {
		productboxpop.removeClass("initial");
		
		// find position of the product within the displaypanel and adjust 
		// (no slide on initial load)
		var container = $(".displaypanel");
		$.each( container.find(".section"), function(i, n){
			$(n).attr("rel",i);
		});
		var width = container.width();
		var z = $("#bb_" + newProduct).attr("rel");
		var cnt = - (width*z);
		if (isNaN(cnt)) cnt = 0;
		if(cnt != 0) $(".displaypanel .content").css("left",cnt);
	} else {
		$(".displaypanel").slideTo("#bb_" + newProduct);
	}
	
	return true;
}

jQuery.fn.slideTo = function(target_id, settings) {
	settings = jQuery.extend({
     easeTime: 400
  }, settings);
	var container = jQuery(this);
	$.each( container.find(".section"), function(i, n){
		$(n).attr("rel",i);
	});
	var width = container.width();
	var z = $(target_id).attr("rel");
	var cnt = - (width*z);
	if (isNaN(cnt)) cnt = 0;

	container.find(".itab_content").animate({left:cnt}, {
		duration: 600,
		easing: "easeInOutQuint",
		complete: function() {
			var left = $(this).css("left");
			var distance = left.split("px");
			if (distance[0] > -500) $(this).css("left",0);
		}
	});		
}