// JavaScript Document
$(function() {
	var totalPanels	= $("#awardImgBox").children().size(); //获取子元素数量
    var curPanel = 3; // 初始选中第三张图片
	
	var norWidth = $(".norpanel").css("width"); //普通图片框宽度
	var norHeight = $(".norpanel").css("height");
	var norImgWidth	= $(".norpanel img").css("width"); //普通图片宽
	var norImgHeight = $(".norpanel img").css("height");
	
	var midWidth = $(".midpanel").css("width"); //中等图片框宽度
	var midHeight = $(".midpanel").css("height");
	var midImgWidth	= $(".midpanel img").css("width"); //中等图片宽
	var midImgHeight = $(".midpanel img").css("height");
	
	var movingDistance = 88; //每次移动的宽度
	
	var bigWidth = 168;
	var bigHeight = 142;
	var bigImgWidth	= 164;
	var bigImgHeight = 119;
	
	$("#awardBox").data("currentlyMoving", false);
	
	var $container = $('#awardImgBox'); 
	$container.css('width',(totalPanels-3)*88+440)
			  .css('float','left')
			  .css('left',-((totalPanels-3)*88+440));
	
	var data = $container.html();
	$("#awardImgBox2").html(data);
	
	$('#awardImgBox2').css('width',(totalPanels-3)*88+440)
			  .css('float','left')
			  .css('left',-((totalPanels-3)*88+440));
	
	function normalToMiddle(element) {
		$(element)
			.animate({ width: midWidth })
			.find("img")
			.animate({ width: midImgWidth })
		    .end()
			.removeClass("norpanel")
			.addClass("midpanel")
	};
	
	function middleToBig(element) {
		$(element)
			.animate({ width: bigWidth })
			.find("img")
			.animate({ width: bigImgWidth })
		    .end()
			.removeClass("midpanel")
			.addClass("bigpanel")
	};
	
	function bigToMiddle(element) {
		$(element)
			.animate({ width: midWidth })
			.find("img")
			.animate({ width: midImgWidth })
		    .end()
			.removeClass("bigpanel")
			.addClass("midpanel")
	};
	
	function middleToNormal(element) {
		$(element)
			.animate({ width: norWidth })
			.find("img")
			.animate({ width: norImgWidth })
		    .end()
			.removeClass("midpanel")
			.addClass("norpanel")
	};
	
	function bigToNormal(element) {
		$(element)
			.animate({ width: norWidth })
			.find("img")
			.animate({ width: norImgWidth })
		    .end()
			.removeClass("bigpanel")
			.addClass("norpanel")
	};
	
	function normalToBig(element) {
		$(element)
			.animate({ width: bigWidth })
			.find("img")
			.animate({ width: bigImgWidth })
		    .end()
			.removeClass("norpanel")
			.addClass("bigpanel")
	};
	
	//向左按钮
	$('#awardTextBox .leftAwardBtn')
		.click(function(){
			if(!(curPanel <= totalPanels) || (curPanel < 1)) {
				return false;
			}
			
			//如果第一版已经完全隐藏，则跳到第一版
			var innLeft = parseInt($("#awardImgBox").css("left"));
			var width = $("#awardImgBox").css("width");
			if (innLeft == 0) {
				$("#awardImgBox").css("left","-"+width);
				$("#awardImgBox2").css("left","-"+width);
			}
			
			//倒数第二张的时候把第一张变成中等大小图片
			if(curPanel == 2) {
				var leftValue = $("#awardImgBox").css("left");
				
				var movement = parseFloat(leftValue, 10) + movingDistance + 40;
				var movement2 = parseFloat(leftValue, 10) + movingDistance;
				
				$("#awardImgBox")
					.stop()
					.animate({
						"left": movement
					}, function() {
						$("#awardBox").data("currentlyMoving", false);
					});
					
				$("#awardImgBox2")
					.stop()
					.animate({
						"left": movement
					}, function() {
						$("#awardBox").data("currentlyMoving", false);
					});
				
				var pprev = totalPanels; //它的前一张既为前一版的最后一张
				var prev = curPanel - 1; 
				var cur = curPanel; 
				var next = curPanel + 1;
				
				middleToNormal(".awardImg"+next);
				bigToMiddle(".awardImg"+cur);
				$("#awardText"+cur).hide();
				
				middleToBig(".awardImg"+prev);
				$("#awardText"+prev).show();
				normalToMiddle(".awardImg"+pprev);
				
				
				curPanel = prev;
			} 
			else if(curPanel == 1) {
				var leftValue = $("#awardImgBox").css("left");
				
				var movement = parseFloat(leftValue, 10) + movingDistance + 96;
				
				$("#awardImgBox")
					.stop()
					.animate({
						"left": movement
					}, function() {
						$("#awardBox").data("currentlyMoving", false);
					});
					
				$("#awardImgBox2")
					.stop()
					.animate({
						"left": movement
					}, function() {
						$("#awardBox").data("currentlyMoving", false);
					});
				
				var pprev = totalPanels - 1; 
				var prev = totalPanels; //它的前一张既为前一版的最后一张
				var cur = curPanel; 
				var next = curPanel + 1;
				
				middleToNormal(".awardImg"+next);
				bigToMiddle(".awardImg"+cur);
				$("#awardText"+cur).hide();
				
				middleToBig(".awardImg"+prev);
				$("#awardText"+prev).show();
				normalToMiddle(".awardImg"+pprev);
				
				
				curPanel = prev;
				
			} 
			else if(curPanel == totalPanels) {
				var leftValue = $("#awardImgBox").css("left");
				
				var movement = parseFloat(leftValue, 10) + movingDistance + 40;
				
				$("#awardImgBox")
					.stop()
					.animate({
						"left": movement
					}, function() {
						$("#awardBox").data("currentlyMoving", false);
					});
					
				$("#awardImgBox2")
					.stop()
					.animate({
						"left": movement
					}, function() {
						$("#awardBox").data("currentlyMoving", false);
					});
				
				var pprev = totalPanels - 2; 
				var prev = totalPanels - 1;
				var cur = curPanel; 
				var next = 1;
				
				middleToNormal(".awardImg"+next);
				bigToMiddle(".awardImg"+cur);
				$("#awardText"+cur).hide();
				
				middleToBig(".awardImg"+prev);
				$("#awardText"+prev).show();
				normalToMiddle(".awardImg"+pprev);
				
				
				curPanel = prev;
				
			} else {
			
				var prev = 	curPanel - 1;	
				var pprev = curPanel - 2;
				var next = 	curPanel + 1;	
				var nnext = curPanel + 2;
				
				var leftValue = $("#awardImgBox").css("left");
				if (curPanel == 2) {
					movingDistance = 128;
				} else {
					movingDistance = 88;
				}
	
				var movement = parseFloat(leftValue, 10) + movingDistance;
				
				$("#awardImgBox")
					.stop()
					.animate({
						left: movement
					}, function() {
						$("#awardBox").data("currentlyMoving", false);
					});
				
				$("#awardImgBox2")
					.stop()
					.animate({
						left: movement
					}, function() {
						$("#awardBox").data("currentlyMoving", false);
					});
				
				middleToNormal(".awardImg"+next);
				bigToMiddle(".awardImg"+curPanel);
				$("#awardText"+curPanel).hide();
					
				middleToBig(".awardImg"+prev);
				$("#awardText"+prev).show();
	
				if (pprev > 0) {
					normalToMiddle(".awardImg"+pprev);
				}
				
				curPanel = prev;
			}
		})
		
		//向右按钮
	$('#awardTextBox .rightAwardBtn')
		.click(function(){
			if((curPanel < 0) || (curPanel > totalPanels)) { 
				return false; 
			}
			
			// 判断是否存在 ImgBox1, 也就是判断是否第一次点击
			if($("#awardImgBox1").length>0) {   
				$("#awardImgBox1").hide(); //删除
			}
			if($("#awardImgBox2").length<=0) {   
				$("#awardImgBox1").show(); 
				$("#awardImgBox").css("left","0px");
				$("#awardImgBox2").css("left","0px");
			}
			
			//如果第一版已经完全隐藏，则跳到第一版
			var innLeft = parseInt($("#awardImgBox").css("left"));
			var width = parseInt($("#awardImgBox").css("width"));
			if (innLeft == (-width)) {
				$("#awardImgBox").css("left","0px");
				$("#awardImgBox2").css("left","0px");
			}
			
			//倒数第二张的时候把第一张变成中等大小图片
			if(curPanel == (totalPanels - 1)) {
				var leftValue = $("#awardImgBox").css("left");
				
				var movement = parseFloat(leftValue, 10) - movingDistance - 40;
				var movement2 = parseFloat(leftValue, 10) - movingDistance;
				
				$("#awardImgBox")
					.stop()
					.animate({
						"left": movement
					}, function() {
						$("#awardBox").data("currentlyMoving", false);
					});
					
				$("#awardImgBox2")
					.stop()
					.animate({
						"left": movement
					}, function() {
						$("#awardBox").data("currentlyMoving", false);
					});
					
				var cur = totalPanels;
				var prev = curPanel;
				var pprev = curPanel - 1;
				
				middleToNormal(".awardImg"+pprev);
				bigToMiddle(".awardImg"+prev);
				$("#awardText"+prev).hide();
			
				normalToMiddle(".awardImg1");
				middleToBig(".awardImg"+totalPanels);
				$("#awardText"+totalPanels).show();
				
				curPanel = totalPanels;
			}
			
			// 最后一张最大的时候
			else if(curPanel == totalPanels) { 
				var leftValue = $("#awardImgBox").css("left");
				
				var movement = parseFloat(leftValue, 10) - 184;
				
				$("#awardImgBox")
					.stop()
					.animate({
						"left": movement
					}, function() {
						$("#awardBox").data("currentlyMoving", false);
					});
					
				$("#awardImgBox2")
					.stop()
					.animate({
						"left": movement
					}, function() {
						$("#awardBox").data("currentlyMoving", false);
					});
			
				var cur = 1;
				var next = 2;
				
				middleToNormal(".awardImg"+(totalPanels-1));
				bigToMiddle(".awardImg"+totalPanels);
				$("#awardText"+totalPanels).hide();
			
				normalToMiddle(".awardImg"+next);
				middleToBig(".awardImg"+cur);
				$("#awardText"+cur).show();
				
				curPanel = 1;
			}
			
			//当第二组的第一张为最大的时候，处理前后图片的大小
			else if(curPanel == 1) {
				var leftValue = $("#awardImgBox").css("left");
				
				var movement = parseFloat(leftValue, 10) - movingDistance -40;
				
				$("#awardImgBox")
					.stop()
					.animate({
						"left": movement
					}, function() {
						$("#awardBox").data("currentlyMoving", false);
					});
					
				$("#awardImgBox2")
					.stop()
					.animate({
						"left": movement
					}, function() {
						$("#awardBox").data("currentlyMoving", false);
					});
					
				/*var pprev = totalPanels - 1;*/
				var prev = totalPanels;

				var cur = curPanel;
				
				var next = curPanel + 1;
				var nnext = curPanel + 2;
				
				middleToNormal(".awardImg"+prev);
				bigToMiddle(".awardImg"+cur);
				$("#awardText"+cur).hide();
			
				middleToBig(".awardImg"+next);
				$("#awardText"+next).show();
				normalToMiddle(".awardImg"+nnext);
				
				
				curPanel = next;
			} else {
				if(curPanel == 1) {
					movingDistance = 128;
				} else {
					movingDistance = 88;
				}
				
				var prev = 	curPanel - 1;	
				var pprev = curPanel - 2;
				var next = 	curPanel + 1;	
				var nnext = curPanel + 2;
				
				var leftValue = $("#awardImgBox").css("left");
				
				var movement = parseFloat(leftValue, 10) - movingDistance;
				
				$("#awardImgBox")
					.stop()
					.animate({
						"left": movement
					}, function() {
						$("#awardBox").data("currentlyMoving", false);
					});
					
				$("#awardImgBox2")
					.stop()
					.animate({
						left: movement
					}, function() {
						$("#awardBox").data("currentlyMoving", false);
					});
				
				middleToNormal(".awardImg"+prev);
				bigToMiddle(".awardImg"+curPanel);
				$("#awardText"+curPanel).hide();
				
				middleToBig(".awardImg"+next);
				$("#awardText"+next).show();
				if (nnext <= totalPanels) {
					normalToMiddle(".awardImg"+nnext);
				}
				
				curPanel = next;
			}
			
		})
		
})