jQuery(function( $ ){
	

	trocaItem($('#menuVariedades ul li:first a'))
	
	$("#menuVariedades ul a").click(function(event){
		event.preventDefault();
		trocaItem($(this))
		
	});
	
	var flaSpinner = '<div class="flaLoader"><object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=10,0,0,0" width="50" height="50" id="spinner" align="middle"><param name="allowScriptAccess" value="sameDomain" /><param name="allowFullScreen" value="false" /><param name="wmode" value="transparent" />	<param name="movie" value="swf/spinner.swf" /><param name="quality" value="high" /><param name="bgcolor" value="#ffffff" />	<embed src="swf/spinner.swf" quality="high" wmode="transparent" bgcolor="#ffffff" width="50" height="50" name="spinner" align="middle" allowScriptAccess="sameDomain" allowFullScreen="false" type="application/x-shockwave-flash" pluginspage="http://www.adobe.com/go/getflashplayer" />	</object></div>'
	
	function trocaItem(item){

		var linkimagem = $(item).attr('href');
		var nomeVariedade = $(item).attr('title')
		var nPote = $("img", item).attr('alt')
	
		carregaImagem(linkimagem)

		$("#menuVariedades ul").find('.ativo').removeClass('ativo');
		$(item).addClass('ativo')

		$("#fotoProduto").empty().append(flaSpinner);

		$('.nomeVariedade').hide();

		$(".pote").empty().append(nPote)

		$('.nomeVariedade h2').empty().append(nomeVariedade);
		
	}
	
	function carregaImagem(url){

		var img = new Image()
		$(img).hide();					
        $(img).load(function () {
	    	
	       	$("#fotoProduto").append(this);

            $(this).fadeIn('slow', function(){
            	$('.nomeVariedade').slideDown(800, 'easeOutExpo');
            });
            $("#fotoProduto").removeClass('loading');
            $('.flaLoader').remove();
        
        }).error(function () {
        	alert("erro ao carregar a imagem");
        }).attr('src', url);			
		
	}


});