$(document).ready(function(){
	
	//滚动图片
	var photo_num = $("#album_list").children().length;
	/*
	$photo_num = $("#photo_num");
	$photo_num.text(photo_num);*/
	var wid = 127;
	cur = 0;
	var list_size = 5;
	var left = 0;
	//alert("photo_num: " + photo_num);
	

	//根据图片数量设置列表宽度
	$("#album_small_list").css("width", photo_num * wid);
	$("#album_list li:first").css("display", "inline");
	$("#album_small_list li:first").css("border-color", "#3b78c8");

	function computeLeft() {
		if (cur - 2 <= 0) { left = 0; }
		else if (cur + 2 >= photo_num ) { left = Math.max(photo_num - 5, 0); }
		else { left = cur - 2; }
		left = -left * wid;
		//alert(left);
	}

	function scrollLeft() {
		$("#album_small_list").animate({left : left}, 500);
	}

	function scrollRight() {
		$("#album_small_list").animate({left : left}, 500);
	}

	//左右按钮
	$("#lower_l").click(function() {
		hidePic();
		cur = (cur + photo_num - 1)%photo_num;
		showPic();
		computeLeft();
		scrollRight();
	});

	$("#lower_r").click(function() {
		hidePic();
		cur = (cur + 1)%photo_num;
		showPic();
		computeLeft();
		scrollLeft();
	});

	$("#upper_l").click(function() {
		hidePic();
		cur = (cur + photo_num - 1)%photo_num;
		showPic();
		computeLeft();
		scrollRight();
	});

	$("#upper_r").click(function() {
		hidePic();
		cur = (cur + 1)%photo_num;
		showPic();
		computeLeft();
		scrollLeft();
	});

	$("#album_small_list li").click(function() {
		hidePic();
		cur = $(this).index();
		showPic();
		computeLeft();
		scrollLeft();
	});
	
	//单击左右按钮时显示当前图片序号
	/*
	$('#lower_l,#lower_r,#upper_l,#upper_r,#album_small_list li').click(function(){
		document.getElementById('cur_index').innerHTML=cur+1;
	});*/

	function hidePic() {
		var index = cur+1;
		$("#album_list li:nth-child(" + index + ")").hide();
		// alert("hide pic " + index);
		$("#album_small_list li:nth-child(" + index + ")").css("border-color", "#ffffff");

	}

	function showPic() {
		var index = cur+1;
		var obj = $("#album_list li:nth-child(" + index + ")");
		// alert("show pic " + index);
		var child = obj.children();
		var l = (640 - child.width())/2;
		var t = (480 - child.height())/2;
		child.css({"left":l, "top":t});
		obj.fadeIn();
		$("#album_small_list li:nth-child(" + index + ")").css("border-color", "#3b78c8");

	}

});