$(document).ready(function() {

	$("#fechar07").click(function(){
		$(".hide_hotspot07").fadeOut();
	});
	$(".ht_07").click(function(){
		$(".hide_hotspot07").fadeIn();
		// console.log("click");
	});

	
	$( "#btn_01" ).mouseover(function() {
	  $('#btn_01').addClass('active');
	  $('#hotspot_01').fadeIn();	
	  $('#hotspot_02').hide();	
	  $('#hotspot_03').hide();
	  $('#hotspot_04').hide();
	  $('#hotspot_05').hide();	
	  $('#hotspot_06').hide();	
	  $('#hotspot_07').hide();
	  $('#hotspot_08').hide();
	  $('#hotspot_09').hide();	
	  $('#hotspot_10').hide();	
	  $('#hotspot_11').hide();	
	  $('#hotspot_12').hide();	

	});
	$( "#btn_01" ).mouseout(function() {
	  $('#hotspot_01').fadeOut();
	  $('#btn_01').removeClass('active');

	});
	$( "#btn_02" ).mouseover(function() {
	  $('#hotspot_02').fadeIn();	
	  $('#hotspot_01').hide();	
	  $('#hotspot_03').hide();
	  $('#hotspot_04').hide();
	  $('#hotspot_05').hide();	
	  $('#hotspot_06').hide();	
	  $('#hotspot_07').hide();
	  $('#hotspot_08').hide();
	  $('#hotspot_09').hide();	
	  $('#hotspot_10').hide();	
	  $('#hotspot_11').hide();	
	  $('#hotspot_12').hide();	
	});
	$( "#btn_02" ).mouseout(function() {
	  $('#hotspot_02').fadeOut();
	  $('#btn_02').removeClass('active');

	});

	$( "#btn_03" ).mouseover(function() {
	  $('#hotspot_03').fadeIn();	
	  $('#hotspot_02').hide();	
	  $('#hotspot_01').hide();
	  $('#hotspot_04').hide();
	  $('#hotspot_05').hide();	
	  $('#hotspot_06').hide();	
	  $('#hotspot_07').hide();
	  $('#hotspot_08').hide();
	  $('#hotspot_09').hide();	
	  $('#hotspot_10').hide();	
	  $('#hotspot_11').hide();	
	  $('#hotspot_12').hide();	
	});
	$( "#btn_03" ).mouseout(function() {
	  $('#hotspot_03').fadeOut();
	  $('#btn_03').removeClass('active');
	});

	$( "#btn_04" ).mouseover(function() {
	  $('#hotspot_04').fadeIn();	
	  $('#hotspot_02').hide();	
	  $('#hotspot_01').hide();
	  $('#hotspot_03').hide();
	  $('#hotspot_05').hide();	
	  $('#hotspot_06').hide();	
	  $('#hotspot_07').hide();
	  $('#hotspot_08').hide();
	  $('#hotspot_09').hide();	
	  $('#hotspot_10').hide();	
	  $('#hotspot_11').hide();	
	  $('#hotspot_12').hide();	
	});
	$( "#btn_04" ).mouseout(function() {
	  $('#hotspot_04').fadeOut();
	  $('#btn_04').removeClass('active');
	});

	$( "#btn_05" ).mouseover(function() {
	  $('#hotspot_05').fadeIn();	
	  $('#hotspot_02').hide();	
	  $('#hotspot_01').hide();
	  $('#hotspot_03').hide();
	  $('#hotspot_04').hide();	
	  $('#hotspot_06').hide();	
	  $('#hotspot_07').hide();
	  $('#hotspot_08').hide();
	  $('#hotspot_09').hide();	
	  $('#hotspot_10').hide();	
	  $('#hotspot_11').hide();	
	  $('#hotspot_12').hide();	
	});

	$( "#btn_05" ).mouseout(function() {
	  $('#hotspot_05').fadeOut();
	  $('#btn_05').removeClass('active');
	});

	$( "#btn_06" ).mouseover(function() {
	  $('#hotspot_06').fadeIn();	
	  $('#hotspot_02').hide();	
	  $('#hotspot_01').hide();
	  $('#hotspot_03').hide();
	  $('#hotspot_04').hide();	
	  $('#hotspot_05').hide();	
	  $('#hotspot_07').hide();
	  $('#hotspot_08').hide();
	  $('#hotspot_09').hide();	
	  $('#hotspot_10').hide();	
	  $('#hotspot_11').hide();	
	  $('#hotspot_12').hide();	
	});
	$( "#btn_06" ).mouseout(function() {
	  $('#hotspot_06').fadeOut();
	  $('#btn_06').removeClass('active');
	});


	$( "#btn_07" ).mouseover(function() {
	  $('#hotspot_07').fadeIn();	
	  $('#hotspot_02').hide();	
	  $('#hotspot_01').hide();
	  $('#hotspot_03').hide();
	  $('#hotspot_04').hide();	
	  $('#hotspot_05').hide();	
	  $('#hotspot_06').hide();
	  $('#hotspot_08').hide();
	  $('#hotspot_09').hide();	
	  $('#hotspot_10').hide();	
	  $('#hotspot_11').hide();	
	  $('#hotspot_12').hide();	
	});
	$( "#btn_07" ).mouseout(function() {
	  $('#hotspot_07').fadeOut();
	  $('#btn_07').removeClass('active');
	});

	$( "#btn_08" ).mouseover(function() {
	  $('#hotspot_08').fadeIn();	
	  $('#hotspot_02').hide();	
	  $('#hotspot_01').hide();
	  $('#hotspot_03').hide();
	  $('#hotspot_04').hide();	
	  $('#hotspot_05').hide();	
	  $('#hotspot_06').hide();
	  $('#hotspot_07').hide();
	  $('#hotspot_09').hide();	
	  $('#hotspot_10').hide();	
	  $('#hotspot_11').hide();	
	  $('#hotspot_12').hide();	
	});
	$( "#btn_08" ).mouseout(function() {
	  $('#hotspot_08').fadeOut();
	  $('#btn_08').removeClass('active');
	});
	$( "#btn_09" ).mouseover(function() {
	  $('#hotspot_09').fadeIn();	
	  $('#hotspot_02').hide();	
	  $('#hotspot_01').hide();
	  $('#hotspot_03').hide();
	  $('#hotspot_04').hide();	
	  $('#hotspot_05').hide();	
	  $('#hotspot_06').hide();
	  $('#hotspot_07').hide();
	  $('#hotspot_08').hide();	
	  $('#hotspot_10').hide();	
	  $('#hotspot_11').hide();	
	  $('#hotspot_12').hide();	
	});
	$( "#btn_09" ).mouseout(function() {
	  $('#hotspot_09').fadeOut();
	  $('#btn_09').removeClass('active');
	});
	$( "#btn_10" ).mouseover(function() {
	  $('#hotspot_10').fadeIn();	
	  $('#hotspot_02').hide();	
	  $('#hotspot_01').hide();
	  $('#hotspot_03').hide();
	  $('#hotspot_04').hide();	
	  $('#hotspot_05').hide();	
	  $('#hotspot_06').hide();
	  $('#hotspot_07').hide();
	  $('#hotspot_08').hide();	
	  $('#hotspot_09').hide();	
	  $('#hotspot_11').hide();	
	  $('#hotspot_12').hide();	
	});
	$( "#btn_10" ).mouseout(function() {
	  $('#hotspot_10').fadeOut();
	  $('#btn_10').removeClass('active');
	});
	$( "#btn_11" ).mouseover(function() {
	  $('#hotspot_11').fadeIn();	
	  $('#hotspot_02').hide();	
	  $('#hotspot_01').hide();
	  $('#hotspot_03').hide();
	  $('#hotspot_04').hide();	
	  $('#hotspot_05').hide();	
	  $('#hotspot_06').hide();
	  $('#hotspot_07').hide();
	  $('#hotspot_08').hide();	
	  $('#hotspot_09').hide();	
	  $('#hotspot_10').hide();	
	  $('#hotspot_12').hide();	
	});
	$( "#btn_11" ).mouseout(function() {
	  $('#hotspot_11').fadeOut();
	  $('#btn_11').removeClass('active');
	});

$( "#btn_12" ).mouseover(function() {
	  $('#hotspot_12').fadeIn();	
	  $('#hotspot_02').hide();	
	  $('#hotspot_01').hide();
	  $('#hotspot_03').hide();
	  $('#hotspot_04').hide();	
	  $('#hotspot_05').hide();	
	  $('#hotspot_06').hide();
	  $('#hotspot_07').hide();
	  $('#hotspot_08').hide();	
	  $('#hotspot_09').hide();	
	  $('#hotspot_10').hide();	
	  $('#hotspot_11').hide();	
	});
	$( "#btn_12" ).mouseout(function() {
	  $('#hotspot_12').fadeOut();
	  $('#btn_12').removeClass('active');
	});


});



$(document).ready(function() {
	$('#video03').on('ended',function(){
	    videoElement.currentTime = 0;
	    videoElement.autoplay=false;
	    $('#video03')[0].load();
	});

	$("#hide_video").click(function(e){
		$(".bg_video").fadeIn();
	});
	$("#video03").click(function(e){
		$("#botao03").hide();
		var video = $("#video03").get(0);
		if(video.paused || video.currentTime == 0 || video.ended)
			$(this).get(0).play();	
		else
			$(this).get(0).pause();	
	});	


	$("#botao03").click(function(e){
		$("#botao03").hide();
		$("#video03").show();
		$('#video03').get(0).play();
	});	

	$("#fechar03").click(function(e){
		$("#botao03").show();
		$('.bg_video').fadeOut();
		$('#video03').get(0).pause();
		$('#video03').get(0).currentTime=0;
		$('#video03')[0].load();
	});

	
	//////////////////////////////////////////ICONES PANEL 07//////////////////////////////////////////
	var currentPanel = 0;
	var panel07Texts = [
	"<div class='temperatura borda'><p class=' txtBranco left'><strong>Temperatura</strong><br />Escolha a temperatura ideal para lavagem.</p></div>"
	,"<div class='velocidade borda'><p class=' txtBranco left'><strong>Velocidade de centrifugação</strong><br />Define a velocidade de centrifugação.</p></div>"
	,"<div class='adiar borda'><p class=' txtBranco left'><strong>Adiar Fim</strong><br />Com a função Adiar Fim é possível configurar a finalização da lavagem para horas mais tarde. Roupas frescas para o momento mais conveniente.</p></div>",
	"<div class='molho borda'><p class=' txtBranco left'><strong>Função Molho</strong><br />As roupas ficam de molho por um período maior, dissolvendo as manchas e removendo-as de maneira eficaz.<sup>3</sup></p></div>" 
  ];
		
	function nextPanel07(){
	 currentPanel++;
	 if(currentPanel > 4)
	  currentPanel = 0;
	
	 changePanel07();
	}
	
	function changePanel07(){
	 //muda o texto de textoRecursos01
	 $(".textoRecursos01").html(panel07Texts[currentPanel]);
	
	 //remove class active de todos os icones / luzes
	 for(i = 1; i <= 4; i++){
	  $("#botao_0" +i).removeClass("acti");
	  $("#botao_0"+ i).show();
	 }
	
	 //adiciona class active para o icone ativo
	 $("#botao_0" + (currentPanel + 1)).addClass("acti");
	}

	$("#botao_01").click(function(){
	 currentPanel = 0;
	 changePanel07();
	 clearInterval(interval07);
   	 interval07 = setInterval(function(){ nextPanel07(); }, 4500);	 
	});
	$("#botao_02").click(function(){
	 currentPanel = 1;
	 changePanel07();
	 clearInterval(interval07);
   	 interval07 = setInterval(function(){ nextPanel07(); }, 4500);	 
	});
	$("#botao_03").click(function(){
	 currentPanel = 2;
	 changePanel07();
	 clearInterval(interval07);
   	 interval07 = setInterval(function(){ nextPanel07(); }, 4500);	 
	});
	$("#botao_04").click(function(){
	 currentPanel = 3;
	 changePanel07();
	 clearInterval(interval07);
   	 interval07 = setInterval(function(){ nextPanel07(); }, 4500);	 
	});

	
	
	//ativa o primeiro icone quando pagina carregar
	changePanel07();
	
	//set time out para trocar automaticamente
	var interval07 = setInterval(function(){ nextPanel07(); }, 4500);
});