var timeout2;

$(function(){
	$("body").find(".prodListImg").each(function(i){
		var timeout;
		$(this).hover(function(){
			var myImg = $(this);
			timeout = setTimeout(function(){makeImg(myImg)},500);
		},function(){
			clearTimeout(timeout);
		});
	});
});

function makeImg(img) {
	var parent = img.parent().parent().parent().find(".popupWrap");
	var newHref = img.parent().parent().parent().find(".popupLink").attr("href");
	var newWrap = $(document.createElement("div"));
	var newLink = $(document.createElement("a"));
	var newPara = $(document.createElement("p"));
	var newLink2 = $(document.createElement("a"));
	var newImg = $(document.createElement("img"));
	var newTitle = $(document.createElement("h2"));
	var newPrice = $(document.createElement("h2"));
	
	newLink.attr("href",newHref);
	newLink2.text("MORE INFO");
	newLink2.attr("href",newHref).addClass("popupBtnLink");
	newTitle.html(parent.parent().find(".prodListTitle").html());
	newPrice.html(parent.parent().find(".prodListPrice").html());
	
	newWrap.addClass("popupImg");
	
	var newImg = $(document.createElement("img"));
	var srcArr = img.attr("src").split("_1.");
	var newSrc = srcArr[0] + "_1_big." + srcArr[1];
	newImg.attr("src",newSrc).css({"width":"400px","height":"400px"});
	
	newLink.append(newImg);
	newPara.append(newLink2).css({"textAlign":"center","marginBottom":"10px"});
	newWrap.append(newLink).append(newTitle).append(newPrice).append(newPara);
	
	parent.append(newWrap);
	
	newWrap.mouseleave(function(){
		timeout2 = setTimeout(function(){clearImg()},500);
	});
	newWrap.mouseenter(function(){
		clearTimeout(timeout2);
	});

}

function clearImg(img) {
	clearTimeout(timeout2);
	$(".popupImg").remove();
}