var total=3,width=900,speed=20,timeout=3000;
var containerId="banner";
var interval,timeOut;
var iconAry=new Array();
function showPic(ary)
{
	var picnews=document.getElementById("banner");
	var html1='<div id="bannerBox">'
	var html2='<div id="bannerNav">';
	for(i=0;i<ary.length;i++)
	{
	  html1+='<div class="navBox">'+ary[i]+'</div>';
      html2+='<span id="num'+i+'" class="bannerNum">'+(i+1)+'</span>';
      iconAry[i]="num"+i;
	}
	html1+="</div>";
    html2+="</div>";
	picnews.innerHTML=html1+html2;
	timeOut=setTimeout(function(){move(containerId,0,false)},timeout);
	for(i=0;i<iconAry.length;i++)
		{
			var icon=document.getElementById(iconAry[i]);
			icon.onmouseover=function(){
				go(this)
				};
			icon.onmouseout=function(){
				reSlide(this);
			}	
		}
	setNav();
}


//更新样式
function updateStyle(obj,opacity,borderColor)
		{
			if(isIE())
			{
				obj.filters.alpha.opacity=opacity;
			}
			else
			{
				obj.style.opacity=opacity/100;
			}
			obj.style.borderColor=borderColor;
		}
	
		//check browse type
		function isIE()
		{
			if(document.attachEvent)
			{
				return true;
			}
			else
			{
				return false;
			}
		}
		
		//slide
		function slide(id,counter,go)
		{
			var end=counter*width;
			var obj=document.getElementById(id);
			var step=(end-obj.scrollLeft)/speed;
			step=(step<1&&step>0)?1:step;	
			obj.scrollLeft+=step;
			//window.status=counter+"|"+end+"|"+step+"|"+obj.scrollLeft;
			if(obj.scrollLeft==end)
			{
				clearInterval(interval);
				//window.status=icon.id;
				counter=counter<total?counter+1:0;
				//window.status=counter;
				if(!go)
				{
					clearTimeout(timeOut);
					timeOut=setTimeout(function(){move(id,counter)},timeout);
				}	
			}
			}
		
		//start slide
		function move(id,counter,go)
		{
			//alert(counter);
			for(i=0;i<iconAry.length;i++)
			{
				var icon=document.getElementById(iconAry[i]);
				if(i==counter)
				{
					updateStyle(icon,100,"#fff");
				}
				else
				{
					updateStyle(icon,50,"#fff");
				}
			}
			interval=setInterval(function(){
				slide(id,counter,go)
			},10);
		}
		
		
		//special move
		function go(icon)
		{
			var id=icon.id.substring(icon.id.length-1,icon.id.length);
			//window.status=id;
			clearInterval(interval);
			clearTimeout(timeOut);
			move(containerId,id,true);
		}
		
		// reslide
		function reSlide(icon)
		{
			var id=icon.id.substring(icon.id.length-1,icon.id.length);
			if(id>=total)
			{
				id=0;
			}
			else
			{
				id++;
			}
			clearInterval(interval);
			clearTimeout(timeOut);
			move(containerId,id,false);
		}

function getObjPosition(obj){
	var x=obj.offsetWidth;
	var y=obj.offsetHeight;
	while(obj.offsetParent)
	{
		x+=obj.offsetLeft;
		y+=obj.offsetTop;
		obj=obj.offsetParent;
	}
	return{x:x,y:y};
}

function setNav(){
	var obj=document.getElementById(containerId);
	var pos=getObjPosition(obj);
	var x=pos.x-obj.offsetWidth;
	var nav=document.getElementById("bannerNav");
	nav.style.left=(x+780)+"px";
	nav.style.top=(pos.y-20)+"px";
	
}

$.post("bp.php",{timeStamp:new Date().getTime()},function(data){
			eval("json="+data);
			if(json.success)
			{
				showPic(json.ary);
			}
			else
			{
				alert("error");	
			}
		});
