var tw,d;

function start_application(){
	//inizializzo
	$('ul#novita li a').addClass('transparent');
	$('ul#best_sellers').addClass('highlighted');		
	$('div.relative','div.slider').append('<div class="overlay_menu"></div>');
	$('div.slider ul li a').append('<div class="overlay"></div>');	



	//Handler per la gestione del termine del preload
	$('#mContent').bind('endPreload',function(){
		var toolbar,spos,fp;
		
		var curimg = $('img','#foto_prodotto');
		
		//Sposto la thumb
		if(d=='left'){
			stpos = tw+'px';
			sfpos = '-'+fpw+'px';
		}else{
			stpos = '-'+tw+'px';
			sfpos = fpw+'px';
		}			

		fp = parseInt(curimg.css('left'))+'px';
		
		$('a.selected img').animate({left:stpos},1000);
		
		
		curimg.show().css('left',sfpos).animate({'opacity':1},500).animate({'left':fp},1000,function(){
			
			if($.support.opacity == false){
				this.style.removeAttribute("filter");
			}					
				
			//Quando ho finito mostro lo slider per scorrere le foto
			show_pics_toolbar(tp);					
		});

	});
	
	//Handler per la gestione dello zoomout
	$('#foto_prodotto').bind('zoomOut',function(){
		$('div.overlay_menu','div.slider').fadeOut();			
	})
	
	

	d='left'; //direzione di spostamento da sinistra a destra
			
	var tooltip = $('#tooltip');
	$('#toolbar').css(d,'5px').appendTo('#slider_content').fadeIn();

	//Mi prendo la grandezza del div per mostrare i prodotti e quella
	//delle thumbnails che mi servono dopo
	tw = parseInt($('div.slider ul li a').width());

	//Calcolo l'offset top dello slider content
	var sc_top = $('#slider_content').offset();
	sc_top = parseInt(sc_top.top);
	

	//Centro le thumbnails 
	var th = parseInt($('div.slider ul li a').height());
	var img;
	
	$('div.slider ul li a').each(function(){
		img = $('img',this);
		$('img',this)
		.css({'left':((tw-parseInt(img.width()))/2)+'px','top':((th-parseInt(img.height()))/2)+'px'});
	})

	//installo gli handler per gli eventi
	$('ul#best_sellers li:first a').select();
			
	$('div.slider ul li a')		
	//Mouse over
	.mouseenter(function(){

		if($(this).hasClass('selected')) return false;	
		
		$('div.overlay',this).show().css('opacity',0).fadeTo('fast',0.3);
		
		//Se sono nella colonna non selezionata lo rendo opaco
		if($(this).hasClass('transparent')){
			$('img',this).fadeTo('fast',1);
		}
				
		var o = $(this).offset();
		
		//Calcolo l'offset relativo al div slider_content e la centro rispetto all'li
		var top = parseInt(o.top)-sc_top-($(this).height()/2) + 'px';
		

		//Decido se spostare il tooltip o se visualizzarlo con effetto fade
		$('#tooltip').html($(this).attr('rel'));
		
		//Vedo in quale parte devo visualizzare  il tooltip se a destra o a sinistra		
		if($(this).parent().parent().hasClass('right')){
			$(tooltip).css('right','0px').css('left','auto');
		}else{
			$(tooltip).css('left','0px').css('right','auto');	
		}
					
		//Se il tooltip è già visibile lo sposto, altrimenti lo faccio apparire			
		if($('#tooltip:visible').length){
			tooltip.stop().animate({opacity:1,top: top })
		}else{
			if($.support.opacity == false){
				tooltip.css('top',top).show();
			}else{
				tooltip.css('top',top).fadeIn();
			}
		}
	})
	
	//Mouse leave
	.mouseleave(function(){

		//Se sono nella colonna non selezionata lo rendo traslucente
		if($(this).hasClass('transparent')){
			$('img',this).fadeTo('fast',0.4);
		}

		if($(this).hasClass('selected')) return false;
		$('div.overlay',this).fadeOut('fast');
	})
	
	//Click
	.click(function(e){
		e.preventDefault();
		
		if($('#foto_prodotto img:animated').length) return false;			
		if($(this).hasClass('selected')) return false;

		//Rimuovo la toolbar della vecchia immagine
		$('#toolbar').remove();
		
		$this = $(this);		
		
		if($.support.opacity == false){
			$('#tooltip').hide();
		}else{
			$('#tooltip').fadeOut();
		}

		//Faccio rientrare il prodotto in vetrina...
		//Sposto la thumb
		if(d=='left'){
			spos = '-'+fpw+'px';
		}else{
			spos = fpw+'px';
		}
		
		$('img','#foto_prodotto').animate({left:spos},1000);				
		$('#toolbar','#slider_content').fadeOut();				

		//Determino la posizione degli elementi se destra e sinistra 
		//e assegno la classe allo slider_content
		var selected = $this.parent().parent();			
		if(selected.hasClass('right')){
			d='right'; //destra
			
			//Cambio il titolo sopra il box
			$('div.slider div.titolo.tleft').removeClass('evidenziato');
			$('div.slider div.titolo.tright').addClass('evidenziato')
		}else{
			d='left'; //left
			
			//Cambio il titolo sopra il box
			$('div.slider div.titolo.tleft').addClass('evidenziato');
			$('div.slider div.titolo.tright').removeClass('evidenziato')
		}
		


		img = $('a.selected img');
		img.animate({opacity:1},100).animate({left:((tw-parseInt(img.width()))/2)+'px'},1000,function(){
		
			if($.support.opacity == false){
				this.style.removeAttribute("filter");
			}

							
			//Se la colonna non è quella selezionata la seleziono e
			//tolgo l'evidenziazione dall'altra
			if($this.hasClass('transparent')){
				
				
				
				
				//Scambio gli elementi all'interno del box prodotto
				$('#foto_prodotto,#scheda_prodotto').fadeOut('fast',function(){
					
					$('#slider_content').removeClass('pleft').removeClass('pright').addClass('p'+d);										
					
				}).fadeIn();



				$('div.slider ul li a.transparent img').fadeTo('fast',1,function(){
					$(this).parent().removeClass('transparent');
					if($.support.opacity==false) this.style.removeAttribute("filter");
				});
				
				
				$('div.slider ul.highlighted li a img').fadeTo('fast',0.4,function(){
					$(this).parent().addClass('transparent')
					$('div.slider ul.highlighted').removeClass('highlighted');	
					selected.addClass('highlighted');					
				});
				
			}


			//Quando finisco cancello il prodotto selezionato e seleziono quello cliccato				
			$('a.selected').removeClass('selected');
			$this.select();
		});
		
		return false;
	});
	
	$('div.slider ul').mouseleave(function(){		
		if($.support.opacity == false){
			$('#tooltip').hide();
		}else{
			$('#tooltip').fadeOut();
		}
	})
	
	
}

//Funzione che seleziona il prodotto attivo dopo il click
$.fn.select = function() {

	if($('div.overlay',this).length) $('div.overlay',this).remove();	
	$(this).addClass('selected');
	var idprodotto = $(this).attr('href');
	$.get('../shop/dettaglio_articolo.php',{id:idprodotto},mostraProdotto);
};

$(window).load(function() {
	start_application();		
});