$(document).ready(function(){
	$(".productHover").each(function(){	
		//grab product id
		var splitID = $(this).attr("href").split("id=");
		var prodID = splitID[1];
		var regExPiece = new RegExp("[c][a-e]");
		var theAttr = $(this).attr("href");
		/*prevent click-throughs for inactive styles
		$(this).click(function(){
			if (theAttr.match(regExPiece)) {
				return true;
			} else {
				return false;
			}
		});*/
		//when the link is hovered, the container appears
		$(this).mouseenter(function(){
			//cache
			if ($(this).hasClass("already-active")) {
				var theContainer = $("." + prodID);
				theContainer.fadeIn(300);
			} else /*if (theAttr.match(regExPiece))*/ {
				//create a container for info
				$(this).addClass("already-active");
				$(this).after("<div class='productInfoBox " + prodID + "'>\n\t<p>Please wait... loading product info.</p>\n</div>");
				//determine where the container will be positioned
				var theContainer = $("." + prodID);		
				//load product info into container
				theContainer
					.load("/store/products/display.do?id=" + prodID + " .productDescription, .productPrice, .was-price, .productSalePrice, .productNumber, .sorrySoldOut, .viewable", function(){theContainer.find("p").remove();});
				//determine the positioning of the container		
				var position = $(this).position();
				var width = parseFloat($(this).width());
				var x = parseFloat($(this).attr("data-x"));
				var xOffset = width + x;
				var negOffset = 300 + x;
				var y = parseFloat($(this).attr("data-y"));
				if ($(this).hasClass("hoverLeft")) {
					theContainer.css({
					left: "-" + negOffset + "px",
					top: y + "px"
					});
				} else {
					theContainer.css({
					left: xOffset + "px",
					top: y + "px"
					});
				}
				//hide the container
				theContainer.hide();
				theContainer.fadeIn(300);
			} /*else {
				//create a container for info
				$(this).addClass("already-active");
				$(this).after("<div class='productInfoBox " + prodID + "'>\n\t<span style='display: block; padding: 10px; text-align: center;'>This fall 2010 style is coming soon!</span>\n</div>");
				//determine where the container will be positioned
				var theContainer = $("." + prodID);		
				//determine the positioning of the container		
				var position = $(this).position();
				var width = parseFloat($(this).width());
				var x = parseFloat($(this).attr("data-x"));
				var xOffset = width + x;
				var negOffset = 300 + x;
				var y = parseFloat($(this).attr("data-y"));
				if ($(this).hasClass("hoverLeft")) {
					theContainer.css({
					left: "-" + negOffset + "px",
					top: y + "px"
					});
				} else {
					theContainer.css({
					left: xOffset + "px",
					top: y + "px"
					});
				}
				//hide the container
				theContainer.hide();
				theContainer.fadeIn(300);
			}*/
		})
		//and when it is un-hovered, it disappears
		.mouseleave(function(){
			var theContainer = $("." +prodID);
			theContainer.fadeOut(300);
		});		
	});
});