/**
* Image Wing Widget
* 
**/
(function($){
	var _container;
	var _gridpos = [{left:"20px", top:"0px"},{left:"20px", top:"83px"}, {left:"20px", top:"194px"}, {left:"301px", top:"0px"}, {left:"301px", top:"83px"}, {left:"301px", top:"194px"}, {left:"103px", top:"0px"}];
	var _logopos = [{left:"24px", top:"0px"}, {left:"110px", top:"0px"}];
	var _authorpos = [{left:"32px", top:"254px"},{left:"118px", top:"254px"}];
	var _bigThumbPos = {left:"103px", top:"0px"};
	var _thumbCss = {width:"80px", height:"80px", position:"absolute"};
	var _sketchCss = {width:"80px", height:"108px", position:"absolute"};
	var _bigthumbCss = {width:"278px", height:"278px", position:"absolute"};
	var _bigImagThumbCss = {width:"366px", height:"366px"};
	var _images;
	
	$.imagewing=function(config) {
		_container = config.container;
		_images = config.images;
		$('<img class="index_recommend_img thumb" src="' + config.images[0].src + '" alt="' + config.images[0].title + '" pos="0" index="0"/>').css(_thumbCss).mouseover(function(){$.imagewing.amplifyThumb($(this));}).css(_gridpos[0]).appendTo(_container).wrap('<a href="/tuya/' + config.images[0].id + '/"></a>');
		$('<img class="index_recommendname sketch" src="/res/img/index/index_rname.gif" alt="推荐涂鸦" pos="1"/>').css(_sketchCss).css(_gridpos[1]).appendTo(_container);
		$('<img class="index_recommend_img thumb" src="' + config.images[1].src + '" alt="' + config.images[1].title + '" pos="2" index="1"/>').css(_thumbCss).css(_gridpos[2]).mouseover(function(){$.imagewing.amplifyThumb($(this));}).appendTo(_container).wrap('<a href="/tuya/' + config.images[1].id + '"></a>');
		$('<img class="index_recommend_img  bigthumb" src="' + config.images[2].src + '" alt="' + config.images[2].title + '" index="2"/>').css(_bigthumbCss).css(_bigThumbPos).appendTo(_container).wrap('<a href="/tuya/' + config.images[2].id + '"></a>');
		$('<img class="index_small_logo" src="/res/img/index/smalllogo.png" />').css(_logopos[1]).appendTo(_container);
		$('<div class="index_recommend_author"><span id="authorSpan"><a href="/space_' + config.images[2].authorid + '/">' + config.images[2].author +'</a> 涂鸦</span></div>').appendTo(_container).css(_authorpos[1]);
		$('.index_small_logo').ifixpng();
		$('<div class="clear"></div>').appendTo(_container);
	}
	
	$.imagewing.amplifyThumb=function(obj) {
		var pos = parseInt(obj.attr("pos"), 10);
		var iIndex = parseInt(obj.attr("index"), 10);
		var toPos = 0;
		var adjustment = 3;
		var authorLogoPosIndex = 0;
		var authorSpanHtml = "";
		
		obj.removeClass("thumb").addClass("hover").unbind("mouseover");
		
		if(pos > 2) { //if image is on the right
			adjustment = -3;
			toPos = 6;//The big thumb's right position
			authorLogoPosIndex = 1;
		} else {
			authorLogoPosIndex = 0;
		}
		$.imagewing.authorLogoShowStatus("none");
		authorSpanHtml = '<a href="/space_'+ _images[iIndex].authorid + '/">' + _images[iIndex].author + '</a>涂鸦';
		$("#authorSpan").html(authorSpanHtml);
		obj.attr("pos", toPos);
		
		$(".sketch").each(function(i){
			$.imagewing.movethumb($(this), adjustment);
		});
		$(".thumb").each(function(i){
			$(this).unbind("mouseover");
			$.imagewing.movethumb($(this), adjustment);
		});
		
		var bigToPos = pos + adjustment;
		$.imagewing.modifyBigThumb($(".bigthumb"), bigToPos);
		
		//amplify samll image
		obj.attr("pos", toPos).animate({width:278, height:278, top:parseInt(_gridpos[toPos].top), left:parseInt(_gridpos[toPos].left)},500, function(){$(this).removeClass("hover").addClass("bigthumb");$(".index_small_logo").css(_logopos[authorLogoPosIndex]);$(".index_recommend_author").css(_authorpos[authorLogoPosIndex]);$.imagewing.authorLogoShowStatus("block");});
		
	}
	$.imagewing.movethumb=function(obj, adjustment) {
		var pos = parseInt(obj.attr("pos"), 10);
		var toPos = pos + adjustment;
		obj.attr("pos", toPos);
		if(obj.attr("class") == "index_recommend_img thumb")
			obj.animate(_gridpos[toPos], 500, function(){$(this).mouseover(function(){$.imagewing.amplifyThumb($(this));});});
		else
			obj.animate(_gridpos[toPos], 500);
	}
	
	$.imagewing.modifyBigThumb=function(bigThumbImage, bigToPos) {	
		bigThumbImage.attr("pos", bigToPos).animate({width:80, height:80, top:parseInt(_gridpos[bigToPos].top, 10), left:parseInt(_gridpos[bigToPos].left, 10)}, 500, function(){$(this).removeClass("bigthumb").addClass("thumb").mouseover(function(){$.imagewing.amplifyThumb($(this));});});
	}
	$.imagewing.authorLogoShowStatus=function(status) {
		$(".index_small_logo").css({display:status});
		$(".index_recommend_author").css({display:status});
	}
})(jQuery);