(function(a){function d(b){var c=b||window.event,d=[].slice.call(arguments,1),e=0,f=!0,g=0,h=0;return b=a.event.fix(c),b.type="mousewheel",c.wheeldelta&&(e=c.wheeldelta/120),c.detail&&(e=-c.detail/3),h=e,c.axis!==undefined&&c.axis===c.horizontal_axis&&(h=0,g=-1*e),c.wheeldeltay!==undefined&&(h=c.wheeldeltay/120),c.wheeldeltax!==undefined&&(g=-1*c.wheeldeltax/120),d.unshift(b,e,g,h),(a.event.dispatch||a.event.handle).apply(this,d)}var b=["dommousescroll","mousewheel"];if(a.event.fixhooks)for(var c=b.length;c;)a.event.fixhooks[b[--c]]=a.event.mousehooks;a.event.special.mousewheel={setup:function(){if(this.addeventlistener)for(var a=b.length;a;)this.addeventlistener(b[--a],d,!1);else this.onmousewheel=d},teardown:function(){if(this.removeeventlistener)for(var a=b.length;a;)this.removeeventlistener(b[--a],d,!1);else this.onmousewheel=null}},a.fn.extend({mousewheel:function(a){return a?this.bind("mousewheel",a):this.trigger("mousewheel")},unmousewheel:function(a){return this.unbind("mousewheel",a)}})})(jquery)
jquery.browser={};(function(){jquery.browser.msie=false; jquery.browser.version=0;if(navigator.useragent.match(/msie ([0-9]+)./)){ jquery.browser.msie=true;jquery.browser.version=regexp.$1;}})();
if($.browser.msie && $.browser.version == 6){
	try {
		document.execcommand('backgroundimagecache', false, true);
	} catch(e) {}
}


function setmaxsize(element,width,height,imgwidth,imgheight){
	element.removeattr("width").removeattr("height");
	if(imgwidth > imgheight*width/height){
		if(imgwidth > width){
			element.attr({
				"width":width,
				"data-width" : imgwidth,
				"data-height" : imgheight
			});
		} else {
			element.css({
				"left" : (width-imgwidth)/2 + "px",
				"top" : (height-imgheight)/2 + "px"
			});
			$("#circleouter").hide();
		}
	} else {
		if(imgheight > height){
			element.attr({
				"height":height,
				"data-width" : imgwidth,
				"data-height" : imgheight
			});
		} else {
			element.css({
				"left" : (width-imgwidth)/2 + "px",
				"top" : (height-imgheight)/2 + "px"
			});
			$("#circleouter").hide();
		}
	}
}

function setminsize(element, width, height){
	element.removeattr("width").removeattr("height");
	var imgwidth = $(element).outerwidth(),
		imgheight = $(element).outerheight();

	if(imgwidth/imgheight > width/height){
		if(imgwidth < width){
			element.attr("width",width);
		}
	} else {
		if(imgheight < height){
			element.attr("height", height);
		}
	}
}

function setcenter(element,outerwidth,outerheight){
	var width = $(element).outerwidth(),
		height = $(element).outerheight();

	$("#smallpic").css({
		"left" : (outerwidth - width)/2 + "px",
		"top" : (outerheight - height)/2 + "px"
	});
}

function imageevent(){
	$("#smallouter").hover(function(){
		$("#circleouter").stop().animate({
			"opacity" : "1"
		},299);
	}, function(){
		$("#circleouter").stop().animate({
			"opacity" : "0"
		},299);
	}).bind("mousemove", function(event){
		var x = event.pagex || event.clientx,
			y = event.pagey || event.clienty,
			circlewidth = $("#circleouter").outerwidth(),
			smallpicele = $("#smallpic"),
			smallpicleft = smallpicele.offset().left,
			smallpictop = smallpicele.offset().top,
			bigpicwidth = smallpicele.attr("data-width"),
			bigpicheight = smallpicele.attr("data-height"),
			smallpicwidth = smallpicele.outerwidth(),
			smallpicheight = smallpicele.outerheight(),
			bigoffsetleft = $("#smallouter").offset().left,
			bigoffsettop = $("#smallouter").offset().top;

		if($.browser.msie && $.browser.version <= 8){
			$("#circleouter").css({
				"margin-left" : x - bigoffsetleft - circlewidth/2 + "px",
				"margin-top" : y - bigoffsettop - circlewidth/2 + "px",
				"background-position-x" : (smallpicleft - x)*bigpicwidth/smallpicwidth + circlewidth/2 + "px",
				"background-position-y" : (smallpictop - y)*bigpicheight/smallpicheight + circlewidth/2 + "px"
			});
		} else {
			$("#circleouter").css({
				"left" : x - bigoffsetleft - circlewidth/2 + "px",
				"top" : y - bigoffsettop - circlewidth/2 + "px",
				"background-position" : (smallpicleft - x)*bigpicwidth/smallpicwidth + circlewidth/2 + "px " + ((smallpictop - y)*bigpicheight/smallpicheight + circlewidth/2) + "px"
			});
		}
	});

	$("#circleouter").bind("mousewheel", function(event, delta){
		var cirwidth = parsefloat($(this).css("width")),
			cirborderradiu = parsefloat($(this).css("border-top-left-radius"));

		if($.browser.msie && $.browser.version <= 8){
			var bpx = parsefloat($(this).css("background-position-x")),
				bpy = parsefloat($(this).css("background-position-y")),
				cirleft = parsefloat($(this).css("margin-left")),
				cirtop = parsefloat($(this).css("margin-top"));
		} else {
			var backgroundposition = $(this).css("background-position"),
				bpx = parsefloat(backgroundposition.split(" ")[0]),
				bpy = parsefloat(backgroundposition.split(" ")[1]),
				cirleft = parsefloat($(this).css("left")),
				cirtop = parsefloat($(this).css("top"));
		}

		if(delta > 0){
			if(cirwidth >= 300 && $("#bigimagemessage:hidden").length){
				$("#bigimagemessage").show();
			}

			if($.browser.msie && $.browser.version <= 8){
				$(this).css({
					"margin-left" : cirleft - 3 + "px",
					"margin-top" : cirtop - 3 + "px",
					"width" : cirwidth + 6 + "px",
					"height" : cirwidth + 6 + "px",
					"border-radius" : cirborderradiu + 3 + "px",
					"background-position" : (bpx + 3) + "px " + (bpy + 3) + "px"
				});
			} else {
				$(this).css({
					"left" : cirleft - 3 + "px",
					"top" : cirtop - 3 + "px",
					"width" : cirwidth + 6 + "px",
					"height" : cirwidth + 6 + "px",
					"border-radius" : cirborderradiu + 3 + "px",
					"background-position" : (bpx + 3) + "px " + (bpy + 3) + "px"
				});
			}
		} else {
			if(cirwidth >= 36){
				if($.browser.msie && $.browser.version <= 8){
					$(this).css({
						"margin-left" : cirleft + 3 + "px",
						"margin-top" : cirtop + 3 + "px",
						"width" : cirwidth - 6 + "px",
						"height" : cirwidth - 6 + "px",
						"border-radius" : cirborderradiu - 3 + "px",
						"background-position" : (bpx - 3) + "px " + (bpy - 3) + "px"
					});
				} else {
					$(this).css({
						"left" : cirleft + 3 + "px",
						"top" : cirtop + 3 + "px",
						"width" : cirwidth - 6 + "px",
						"height" : cirwidth - 6 + "px",
						"border-radius" : cirborderradiu - 3 + "px",
						"background-position" : (bpx - 3) + "px " + (bpy - 3) + "px"
					});
				}

			}
		}

		return false;
	});

	$("#circleouter").bind("contextmenu", function(){
		return false;
	}).bind("dragstart", function(){
		return false;
	});
}

$(function () {
	$(".picsmalllist li").bind("mouseenter", function () {
		$(this).addclass("hover");
	}).bind("mouseleave", function () {
		$(this).removeclass("hover");
	}).bind("click", function () {
		$(this).addclass("curr").siblings().removeclass("curr");
		var bigimg = $(this).find("img").attr("data-big"),
			imageobj = new image(),
			smallouterwidth = $("#smallouter").outerwidth(),
			smallouterheight = $("#smallouter").outerheight();

		$("#smallpic").removeattr("width").removeattr("height").attr("src", $(this).find("img").attr('src'));
		setminsize($("#smallpic"), smallouterwidth, smallouterheight);
		setcenter($("#smallpic"), smallouterwidth, smallouterheight);

		imageobj.onload = function(){
			var img = this.src,
				imgwidth = this.width,
				imgheight = this.height;
			$("#smallpic").attr("src", img);
			$("#circleouter").attr("style", 'background-image: url("'+ img +'");');
			setmaxsize($("#smallpic"), smallouterwidth, smallouterheight, imgwidth, imgheight);
			setcenter($("#smallpic"), smallouterwidth, smallouterheight);
		}

		imageobj.src = bigimg;
	})

	if($(".picsmalllist li").length <= 1){
		$("#smallouter").css("height", "700");
	}

	$(".picsmalllist li:first").trigger("click");
	imageevent();
})