/*
 * Image preview script 
 * powered by jQuery (http://www.jquery.com)
 * 
 * written by Alen Grakalic (http://cssglobe.com)
 * 
 * for more info visit http://cssglobe.com/post/1695/easiest-tooltip-and-image-preview-using-jquery
 *
 */
 
this.imagePreview = function(){	
	/* CONFIG */
		
		xOffset = 10;
		yOffset = 10;
		prevHeight = 300;
		prevWidth = 340;
		placement = "downRight";//default placement
		
		// these 2 variable determine popup's distance from the cursor
		// you might want to adjust to get the right result
		
	/* END CONFIG */
	$("a.preview").hover(function(e){
		this.t = this.title;
		this.title = "";	
		var c = (this.t != "") ? this.t : "";
		var sourceSm = ($(this).children("img").attr("src"));// get the thumbnail src
		var sourceMd = sourceSm.replace("Sm.gif","Md.gif");//create preview src
		$("body").append("<div id='preview'><img src='"+ sourceMd +"' alt='Image preview' /><p>"+ c +"</p></div>");
		if ($("body").width() < (e.pageX + prevWidth) && $("body").height() < (e.pageY + prevHeight)){//too close to right and bottom
			$("#preview")// goes up and to the left
			.css("left",(e.pageX - xOffset - prevWidth) + "px")
			.css("top", (e.pageY - yOffset - prevHeight) + "px")
			.fadeIn("fast");
			placement = "upLeft";
		} else if ($("body").width() < (e.pageX + prevWidth)){//too close to right
			$("#preview")// goes down and to the left
			.css("left",(e.pageX - xOffset - prevWidth) + "px")
			.css("top", (e.pageY + yOffset) + "px")
			.fadeIn("fast");
			placement = "downLeft";
		} else if ($("body").height() < (e.pageY + prevHeight)){//too close to bottom
			$("#preview")// goes up and to the right
			.css("left",(e.pageX + xOffset) + "px")
			.css("top", (e.pageY - yOffset - prevHeight) + "px")
			.fadeIn("fast");
			placement = "upRight";
		} else { // default
		$("#preview") //  - goes down and to the right
			.css("left",(e.pageX + xOffset) + "px")
			.css("top",(e.pageY + yOffset) + "px")
			.fadeIn("fast");
			placement = "downRight";
		}
    },
	function(){
		this.title = this.t;	
		$("#preview").remove();
    });	
	$("a.preview").mousemove(function(e){
		switch(placement){
		case "upLeft":
  		$("#preview")// goes up and to the left
		.css("left",(e.pageX - xOffset - prevWidth) + "px")
		.css("top", (e.pageY - yOffset - prevHeight) + "px");
		break;
		case "downLeft":
		$("#preview")
		.css("left",(e.pageX - xOffset - prevWidth) + "px")
		.css("top", (e.pageY + yOffset) + "px");
		break;
		case "upRight":
		$("#preview")
		.css("left",(e.pageX + xOffset) + "px")
		.css("top", (e.pageY - yOffset - prevHeight) + "px");
		break;
		default:
		$("#preview")
		.css("left",(e.pageX + xOffset) + "px")
		.css("top",(e.pageY + yOffset) + "px");
		}
	});	
};


// starting the script on page load
$(document).ready(function(){
	imagePreview();
	colors();
	garments();
});

//starting the color changing function
this.colors = function() {
	$(".dsnAvailableIn li a").hover(function(){
		var color = $(this).attr("class");
		$("#dsnImg img").attr("class","");
		$("#dsnImg img").toggleClass(color);
		},function(){
	});
};

this.garments = function(){
	$(".icons a").click(function(){
		return false;
	});
	$(".icons a").hover(function(){
		var garmentPath = $(this).attr("href");
		$("#dsnImg img").attr("src", garmentPath);
		}, function(){
	});
};