$(
	function()
	{
		//loadImgList(1);
	}
);

var intCIndex = 0;
var aryImgs = [];
function loadImgList(i)
{
	if (i != "")
	{
		$.post("index.php?action=work&i="+i , {} , function(objData)
				{
					aryImgs = [];
					$(objData).find("item").each(
						function(i)
						{
							aryImgs[i] = ($(this).text());
						}
					);
					
					loadImg(0);
				}
		);
	}
}

function funInitPage(objPrevBtn , objNextBtn )
{
	objPrevBtn.mouseover( 
			function() 
			{ 
				if ( intCIndex - 1 >= 0 )
					$(this).css('opacity' , 1);
				else
					$(this).hide();
				
				$(this).css('cursor' , 'pointer') 
			} 
		);
	
	objNextBtn.mouseover( 
			function() 
			{ 
				if ( intCIndex + 1 < aryImgs.length )
					$(this).css('opacity' , 1);
				else
					$(this).hide();
				
				$(this).css('cursor' , 'pointer') 
			} 
		);
	
	objPrevBtn.click( function() { gotoPage(-1) } );
	objNextBtn.click( function() { gotoPage(1) } );
	objPrevBtn.css('opacity' , 0);
	objNextBtn.css('opacity' , 0);
	
	objPrevBtn.mouseout( 
			function() 
			{
				$(this).css('opacity' , 0);
			}
		);
	
	objNextBtn.mouseout( 
			function() 
			{
				$(this).css('opacity' , 0);
			
			}
		);
	
}

function gotoPage(i)
{
	if ( intCIndex + i >= 0 && aryImgs.length > intCIndex + i )
	{
		$("#lbtn").remove();
		$("#rbtn").remove();
		//intCIndex = intCIndex+i ;
		//loadImg(intCIndex+i);
		
		$("#overlayerimg").find("img").remove();
		
		$("#overlayerimg").animate(
				{
					'width' : 100 ,
					'left' : ($(window).width() - 100) / 2
				} , 'normal' , 
				
				function()
				{
					loadImg(intCIndex+i);
				}
		);
		
	}
}

function loadImg(intIndex)
{
	intCIndex = intIndex;
	
	if ($("#overlayer").length > 0 )
	{
		objMask = $("#overlayer");
	}
	else
	{
		objMask = $("<div id='overlayer'></div>"); 
										
		objMask.css('background' , '#000000');
		objMask.css('opacity' , '0.7');
		objMask.css('width' , $(window).width());
		objMask.css('height' , $("html")[0].scrollHeight * 1 );
		objMask.css('position' , 'absolute');
		objMask.css('z-index' , 9998);
		objMask.css('top' , 0 );
		objMask.css('left' , 0);
								
								
		$("body").append(objMask);
	}
	//alert($(this).data('link'));
							
	objMask.fadeIn('slow');
							
	$(window).resize(
		function()
		{
			objMask = $("#overlayer");
										
			objMask.css('width' , $(window).width());
			objMask.css('height' , $("html")[0].scrollHeight * 1 );
									
			$("#overlayerimg").css('left' , ($(window).width() - $("#overlayerimg").width()) / 2 );
		}
	);
							
	if ($("#overlayerimg").length > 0 )
	{
		objImg = $("#overlayerimg");
		objImg.html("");
	}
	else
	{
		objImg = $("<div id='overlayerimg'></div>"); 
									
		objImg.css('background' , '#ffffff');
		objImg.css('padding' , '10px');
		objImg.css('width' , 100 );
		objImg.css('height' , 100  );
		objImg.css('overflow' , 'hidden' );
		objImg.css('position' , 'absolute');
		objImg.css('z-index' , 9999);
		objImg.css('top' , 0 );
		objImg.css('left' , ($(window).width() - 100) / 2 );
		$("body").append(objImg);
	}
	objImg.html("<br/><center><img src='images/loading.gif'></center>");
	objImg.show();
							
	objImgA = new Image();
	//objImg.hide();
	$(objImgA).attr('id' , 'imgs' );
	$(objImgA).load(
		function()
		{
			$("#overlayerimg").html($(this));	
									
			var intW = ($(this).width());
			//$(this).css('margin-left' , -($(this).width()) / 2 );
									
			$("#overlayerimg").animate(
				{
					'left'	: ($(window).width() - (intW + 20) ) / 2 ,
					'width' : (($.browser.msie)? (intW + 20) : intW )	
				}
			);
			$(this).hide();
			$(this).animate(
				{
					'marginLeft' : 0 
				} , 'normal' ,
				function ()
				{
					funAdjustWidth();
				}
										
			);
									
		}
	).attr('src' , aryImgs[intIndex] );
}

function funAdjustWidth()
{
	objCloseBtn = $("<img src='images/closelabel.gif' />");
	objCloseBtn.css('float' , 'right' );
	objCloseBtn.css('margin-top' , '10px' );
	
	$("#overlayerimg").append(objCloseBtn);
	
	$("#imgs").show();
	
	var intH = $("#imgs").height() + 20 + objCloseBtn.height() + 10 ;
	
	$("#overlayerimg").animate(
		{
			'height' : intH
		} , 'normal' , function()
		{
			objPrevBtn = $("<img src='images/prevlabel.gif' />");
			objPrevBtn.attr('id' , 'lbtn');
			objPrevBtn.css('position' , 'absolute' );
			objPrevBtn.css('top' , '50px' );
			objPrevBtn.css('left' , $("#imgs").offset().left);
			objPrevBtn.css('z-index' , '10000' );
			$("body").append(objPrevBtn);
			
			objNextBtn = $("<img src='images/nextlabel.gif' />");
			$("body").append(objNextBtn);
			objNextBtn.attr('id' , 'rbtn');
			objNextBtn.css('position' , 'absolute' );
			objNextBtn.css('top' , '50px' );
			objNextBtn.css('left' , $("#imgs").offset().left + $("#imgs").width() - objNextBtn.width()  );
			objNextBtn.css('z-index' , '10001' );
			
			funInitPage(objPrevBtn , objNextBtn );
		}
	);
	
	objCloseBtn.mouseover(
		function()
		{
			$(this).css('cursor' , 'pointer');
		}
	);
	objCloseBtn.click(
		function()
		{
			$("#lbtn").remove();
			$("#rbtn").remove();
			$("#overlayer").fadeOut('normal');
			$("#overlayerimg").fadeOut('normal' , function()
			{
				$("#overlayerimg").html("");
			});
		}
	);
}