var title_table = new Array();
var automatic_move = 1;  
var actual_where = 0;
var slide_every = 8000;
var timer = setInterval('appearNewPictureAutomaticVersion();',slide_every);
var mainW = 508;
var mainH = 176;
var actualHighestPictureId = 0;
var numberTotalPicture = 0 ; 
var menuHeight = 27;
var menuTopPosition = mainH - menuHeight;





function timer_stop()
{
	clearInterval(timer);
	automatic_move = 0;  
	//$('intro_menu_list_a_plus').setStyle( { background:'transparent url(http://static.virtualvillage.com/www/homepage_promo/b_intro_menu_play.gif) no-repeat', color:'#722D74' } );
}

function timer_buttom()
{
	if(automatic_move == 1 )
	{
		timer_stop();
	}else {
		timer = setInterval('plus_one = actual_where+1 ; slide_to(plus_one);',slide_every); 
		automatic_move = 1;
		//$('intro_menu_list_a_plus').setStyle( { background:'transparent url(http://static.virtualvillage.com/www/homepage_promo/b_intro_menu_pause.png) no-repeat', color:'#722D74' } );
	}	
}

function build_intro_animation() // the header emplacement of this
{
	//var intro_header = Builder.node( 'div', {  	id: 'intro_header'});// the head 
	//$('intro_animation_2').appendChild(intro_header);

	$('intro_animation_2').writeAttribute("style", "width:"+mainW+"px; height:"+mainH+"px;");
	
	var intro_content = Builder.node(// the body
		'div',
		{id:'intro_content'},
		[
			Builder.node(
				'div',
				{
					id: 'long_animation',
					style:"width:"+mainW+"px; height:"+mainH+"px;"
				}
			)
		]
	);   
	$('intro_animation_2').appendChild(intro_content);
	
	// position of the big slide
	var actual_position = 0 ;

	new Ajax.Request(
		"/control/getWebSiteBannerItemsInXml", 
		{
			method:'get',
			onFailure:function(the_reponse,e)
			{
				alert("onFailure end");
			},onSuccess: function(the_reponse, f){
				var receipt_content = the_reponse.responseXML.documentElement;
				var list = receipt_content.getElementsByTagName('slide');
				var intro_menu = Builder.node(
					'ul',
					{
						id: 'intro_menu',
						style:"top:"+mainH+"px; height:"+menuHeight+"px; width:"+mainW+"px;"
					}
				);
				$('intro_animation_2').appendChild(intro_menu);
				for (i=0; i < receipt_content.getElementsByTagName('slide').length; i++)
				{
					var xml_tag_slide = receipt_content.getElementsByTagName('slide');
					//title_table[i] = xml_tag_slide[i].getElementsByTagName('slidetitle')[0].firstChild.nodeValue;

					//intro_header.innerHTML = xml_tag_slide[0].getElementsByTagName('slidetitle')[0].firstChild.nodeValue;

					var boutonnumero = i+1; // start menu LI
					var intro_menu_list = Builder.node(
						'li',
						{
							id:'intro_menu_list_'+i,
							style:"float:left"
						},
						[
							Builder.node(
								'a',
								{
									href:'#',
									id:'intro_menu_list_a_'+i,
									onclick:'appearNewPicture('+ i +');'
								},
								boutonnumero
							)
						]
					);
					$('intro_menu').appendChild(intro_menu_list); // end menu LI

					var slide = Builder.node( // building a new big button with the picture as a background
						'a',
						{
							id:'slide_id' + i + '_type1',
							style:"background-image:url("+xml_tag_slide[i].getElementsByTagName('picture_link')[0].firstChild.nodeValue+"); z-index:2; display:none; width:"+mainW+"px; height:"+mainH+"px;"
							
						}
					);
					$('long_animation').appendChild(slide);
					if( xml_tag_slide[i].getElementsByTagName('url_link')[0].firstChild.nodeValue != '#')
					{
						$('slide_id' + i + '_type1').writeAttribute("href", xml_tag_slide[i].getElementsByTagName('url_link')[0].firstChild.nodeValue );
						$('slide_id' + i + '_type1').writeAttribute("onclick", "javascript: pageTracker._trackPageview('/home-banner/"+xml_tag_slide[i].getElementsByTagName('picture_link')[0].firstChild.nodeValue.substring(52)+"');" );
					}
					
						numberTotalPicture++;
				}
				$('slide_id'+actualHighestPictureId+'_type1').setStyle({display:'block' });
				$('intro_menu_list_a_' + actualHighestPictureId ).setStyle({'backgroundImage' : 'url(http://static.virtualvillage.com/www/home/16px2.png)'});
			}
		}
	);
}



	
	
function showList() 
{ 
	if($('intro_menu').getStyle('top') == mainH+'px')
	{
		new Effect.Move(
			'intro_menu', 
			{
				x:0,
				y:menuTopPosition,
				mode: 'absolute',
				duration: 0.3,
				transition: Effect.Transitions.sinoidal 
			}
		);
	}
}
function hideList() 
{ 		
	if($('intro_menu').getStyle('top') == menuTopPosition+'px' ){
		var dsdf = "3";
		new Effect.Move(
			'intro_menu', 
			{
				x:0,
				y:mainH,
				mode: 'absolute',
				duration: 0.3,
				transition: Effect.Transitions.sinoidal 
			}
		); 
	}
	
}


function appearNewPicture(where) // change slide version 2 
{
	if(actualHighestPictureId != where)
	{
		$('intro_menu_list_a_' + where ).setStyle({'backgroundImage' : 'url(http://static.virtualvillage.com/www/home/16px2.png)'});
		$('intro_menu_list_a_' + actualHighestPictureId ).setStyle({'backgroundImage' : 'url(http://static.virtualvillage.com/www/home/16px1.png)'});
		new Effect.Appear('slide_id'+where+'_type1', { duration: 0.9 } );
		new Effect.Fade('slide_id'+actualHighestPictureId+'_type1', { duration: 0.9 } );
		actualHighestPictureId = where;
	}
	
}
function appearNewPictureAutomaticVersion() // change slide and calculating the next frame to show
{
	temp = numberTotalPicture - 1;
	if(actualHighestPictureId < temp  )
	{
		temp = actualHighestPictureId+1;
		appearNewPicture(temp);
	}else{
		appearNewPicture(0);
	}
}

Event.observe(
	document, 
	'mousemove', 
	function(event){
		try {
			ofset = $('intro_animation_2').cumulativeOffset() ; 
			rightposition = ofset[0] + mainW;
			bottomposition = ofset[1] + mainH;
			
			x = Event.pointerX(event);
			y = Event.pointerY(event);
			
			//coords = ofset[0] + "-" + x + "-"+rightposition + " : "+ofset[1] +"-"+ y + "-"+bottomposition + " - " + $('intro_menu').getStyle('top') ;
			//$('SEARCH_STRING').writeAttribute('value', coords );
			if(x > ofset[0] && x < rightposition && y > ofset[1] && y <  bottomposition) {	
				showList();
			}else{
				hideList();
			}
		}catch(err){
		}
		
	}
);

Event.observe( 
	window, 
	'load', 
	function() 
	{
		build_intro_animation();
	}
);
