var vitesse_fad = 500;//150;
var seeurank_aff = false;
var submit_aff = false;
var topVisible = '#toptop';
var topInvisible = '#toptop2';


var rightVisible = '#topright';
var rightInVisible = '#topright2';

var leftVisible = '#topleft';
var leftInVisible = '#topleft2';

var rightVisible = '#topright';
var rightInVisible = '#topright2';

$(document).ready(function($){ 
	// image de base en haut
	$('#toptop').html($('#yooda_top').html());
	// Texte à gauche
	$('#topleft').html($('#see_texte').html());
	$('#topleft').children('.texte_s').html($('#debase_s').html());
	$('#topleft').css('opacity',1);
	$('#topleft').css('background-image','url("/images/yooda/defaut_g.png")');
	
	$('#topleft2').html($('#see_texte').html());
	$('#topleft2').children('.texte_s').html($('#debase_s').html());
	$('#topleft2').css('opacity',0);
	$('#topleft2').css('background-image','url("/images/yooda/defaut_g.png")');
	// Texte à droite
	$('#topright').html($('#sub_texte').html());
	$('#topright').children('.texte_u').html($('#debase_u').html());
	$('#topright').css('opacity',1);
	$('#topright').css('background-image','url("/images/yooda/defaut_d.png")');
	
	$('#topright2').html($('#sub_texte').html());
	$('#topright2').children('.texte_u').html($('#debase_u').html());
	$('#topright2').css('opacity',0);
	$('#topright2').css('background-image','url("/images/yooda/defaut_d.png")');
	// entrée / sortie à gauche
 	$('.top_g').mouseenter(function(){
			$('#topright').stop(true, true);
			$('#topleft').stop(true, true);
			$('#toptop').stop(true, true);
			afficher_seeurank();
		}).mouseleave(function(e){
			var g = e.pageX - $(this).offset().left;
			var h = e.pageY - $(this).offset().top;
			//alert('g:'+g+' - '+'h:'+h);
			if(h > 100 && h < 300 && g > 50 && g < 400){
				// on est sur le bouton
			}else{
				$('#topright').stop(true, true);
				$('#topleft').stop(true, true);
				$('#toptop').stop(true, true);
				// on ne passe par le logo de yooda que si on ne va pas sur l'autre rectangle
				if(g < 0 || h <= 0 || h >= 305){
					afficherYooda();
				}else{
					afficherYooda(1);
				}
			}
		});
	// entrée / sortie à droite
 	$('.top_d').mouseenter(function(){
			$('#topright').stop(true, true);
			$('#topleft').stop(true, true);
			$('#toptop').stop(true, true);
			afficher_submit();
		}).mouseleave(function(e){
			var g = e.pageX - $(this).offset().left;
			var h = e.pageY - $(this).offset().top;
			//alert('g:'+g+' - '+'h:'+h);
			if(h > 100 && h < 300 && g > 186 && g < 366){
				// on est sur le bouton
			}else{
				$('#topright').stop(true, true);
				$('#topleft').stop(true, true);
				$('#toptop').stop(true, true);
				// on ne passe par le logo de yooda que si on ne va pas sur l'autre rectangle
				if(g >= 470 || h <= 0 || h >= 305){
					afficherYooda();
				}else{
					afficherYooda(1);
				}
			}
		});
	// boites cliquables
	$('.top_g').css('cursor','pointer');
	$('.top_g').click(function(e){
		var g = e.pageX - $(this).offset().left;
		var h = e.pageY - $(this).offset().top;
		// on peut cliquer partout sauf sur le bouton ...
		if(!(h > 204 && h < 233 && g > 204 && g < 304)){
			window.location = "/seotools/seeurank";
		}
	});
	$('.top_d').css('cursor','pointer');
	$('.top_d').click(function(e){
		var g = e.pageX - $(this).offset().left;
		var h = e.pageY - $(this).offset().top;
		// on peut cliquer partout sauf sur le bouton ...
		if(!(h > 204 && h < 233 && g > 187 && g < 293)){
			window.location = "/seotools/submit";
		}
	});
});
// [ANIM] quoi : le logo qu'on veut voir apparaitre, debut : d'où il part, fin, où il va
//
// voir les fonctions :
// afficher_seeurank()
// afficher_submit()
// afficherYooda(nepaspasserparyooda)

function fader_top(quoi,debut,fin,interieur){
	$(topInvisible).html($(quoi).html());
	// [ANIM] le logo sur lequel on travaille (invisible à ce moment là) va sur sa position initiale
	$('#'+interieur).css('padding-top',debut+'px');	
	// on remet les div en place (sauf si c'est sur celui là qu'on travaille)
	// [ANIM] le logo yooda disparait en remontant : top : 10  
	if(interieur!='top1'){
		$('#top1').animate({'padding-top':10},vitesse_fad);
	}
	// [ANIM] le logo seeurank disparait en descendant : top : 50  
	if(interieur!='top2'){
		$('#top2').animate({'padding-top':50},vitesse_fad);
	}
	// [ANIM] le logo submit disparait en descendant : top : 50  
	if(interieur!='top3'){
		$('#top3').animate({'padding-top':50},vitesse_fad);
	}
	// animations : déplacement du top, fade des 2 composants ...
	// $(topVisible).stop(true, true).animate({'opacity':0},vitesse_fad);
	// $(topInvisible).stop(true, true).animate({'opacity':1},vitesse_fad);
	$(topVisible).stop(true, true).fadeOut(vitesse_fad);
	$(topInvisible).stop(true, true).fadeIn(vitesse_fad);
	// [ANIM] le logo sur lequel on travaille apparait en allant vers sa position finale	
	$('#'+interieur).animate({'padding-top':fin},vitesse_fad,function(){
		
	});
	// on inverse pour la suite
	if(topVisible == '#toptop'){
		topVisible = '#toptop2';
		topInvisible = '#toptop';
	}else{
		topVisible = '#toptop';
		topInvisible = '#toptop2';
	}
}

function afficher_seeurank(){
	if(!seeurank_aff){
		changer_left(2);
		changer_right(4);
		fader_top('#see_top','50',25,'top2');
		seeurank_aff = true;
		submit_aff = false;	
	}
}
function afficher_submit(){
	if(!submit_aff){
		changer_right(2);
		changer_left(4);
		fader_top('#sub_top','50',25,'top3');
		submit_aff = true;	
		seeurank_aff = false;
	}
}

function afficherYooda(nepaspasserparyooda){
	changer_left(1);
	changer_right(1);
	$('#sub_sur_texte').css('background-image','url(/images/yooda/defaut_d.png)');
	$('#see_sur_texte').css('background-image','url(/images/yooda/fond_g.png)');
	submit_aff = false;	
	seeurank_aff = false;
	if(nepaspasserparyooda!=1){
		fader_top('#yooda_top','10',25,'top1');
	}
}

	
function changer_left(num,immed){
	if(immed==1){
		vit = 0;
	}else{
		vit = vitesse_fad;
	}
	// on commence par éffacer le composant en place
	$(leftVisible).stop(true, true).animate({'opacity':0},vit);
	//$(leftInVisible).removeClass('invisible');
    if(num!=4){
		// fade du volet seeurank
		$(leftInVisible).html($('#see_texte').html());
		$(leftInVisible).removeClass('ecran_sub');
		$(leftInVisible).addClass('boite');
	}
	if(num==1){
			$(leftInVisible).css('background-image','url("/images/yooda/defaut_g.png")');
			$(leftInVisible).children('.texte_s').html($('#debase_s').html());
			$(leftInVisible).stop(true, true).animate({'opacity':1},vit);
			$('.bt_ess_s').mouseenter(function(){
				changer_left(3,1);
			});		
			$('.bt_ess_s').mouseleave(function(){
					changer_left(2,1);
			});
	}else{
		if(num==2){
			$(leftInVisible).css('background-image','url("/images/yooda/savoir_g.png")');
			$(leftInVisible).children('.texte_s').html($('#ensavoirplus_s').html());
			$(leftInVisible).stop(true, true).animate({'opacity':1},vit);
			$('.bt_ess_s').mouseenter(function(){
				changer_left(3,1);
			});
			$('.bt_ess_s').mouseleave(function(){
					changer_left(2,1);
			});
		}else{
			if(num==3){
				$(leftInVisible).css('background-image','url("/images/yooda/telech_g.png")');
				$(leftInVisible).children('.texte_s').html($('#telechargez_s').html());
				$(leftInVisible).stop(true, true).animate({'opacity':1},vit);
				$('.bt_down_s').mouseleave(function(){
					changer_left(2,1);
				});
			}else{ // image :
				$(leftInVisible).html($('#see_img').html());
				$(leftInVisible).removeClass('boite');
				$(leftInVisible).addClass('ecran_sub');
				$(leftInVisible).css('background-image','url("/images/yooda/vide_g.png")');
				// [ANIM] -30 : position d'arrivé de l'image (écran)
				$('#img_see').css('margin-left','-30px');
				// [ANIM] -18 : position d'arrivé de l'image (écran)
				$('#img_see').animate({'margin-left':-18},vit);
				$(leftInVisible).stop(true, true).animate({'opacity':1},vit);
			}
		}
	}
	// on inverse pour la suite
 	if(leftVisible == '#topleft'){
		leftVisible = '#topleft2';
		leftInVisible = '#topleft';
	}else{
		leftVisible = '#topleft';
		leftInVisible = '#topleft2';
	}
}

function changer_right(num,immed){
	if(immed==1){
		vit = 0;
	}else{
		vit = vitesse_fad;
	}
	// on commence par éffacer le composant en place
	$(rightVisible).stop(true, true).animate({'opacity':0},vit);
	if(num!=4){
		// fade du volet submit
		$(rightInVisible).html($('#sub_texte').html());
		$(rightInVisible).removeClass('ecran_see');
		$(rightInVisible).addClass('boite2');
	}
	if(num==1){
		$(rightInVisible).css('background-image','url("/images/yooda/defaut_d.png")');
			$(rightInVisible).children('.texte_u').html($('#debase_u').html());
			$(rightInVisible).stop(true, true).animate({'opacity':1},vit);
			$('.bt_ess_u').mouseenter(function(){
				changer_right(3,1);
			});	
			$('.bt_ess_u').mouseleave(function(){
					changer_right(2,1);
			});
	}else{
		if(num==2){
			$(rightInVisible).css('background-image','url("/images/yooda/savoir_d.png")');
			$(rightInVisible).children('.texte_u').html($('#ensavoirplus_u').html());
			$(rightInVisible).stop(true, true).animate({'opacity':1},vit);
			$('.bt_ess_u').mouseenter(function(){
				changer_right(3,1);
			});
			$('.bt_ess_u').mouseleave(function(){
					changer_right(2,1);
			});
		}else{
			if(num==3){
				$(rightInVisible).css('background-image','url("/images/yooda/telech_d.png")');
				$(rightInVisible).children('.texte_u').html($('#telechargez_u').html());
				$(rightInVisible).stop(true, true).animate({'opacity':1},vit);
				$('.bt_down_u').mouseleave(function(){
					changer_right(2,1);
				});
			}else{ // image :
				$(rightInVisible).html($('#sub_img').html());
				$(rightInVisible).removeClass('boite2');
				$(rightInVisible).addClass('ecran_see');
				$(rightInVisible).css('background-image','url("/images/yooda/vide_d.png")');
				// [ANIM] 20px : position de départ de l'image (écran)
				$('#img_sub').css('margin-left','20px');
				// [ANIM] -10 : position d'arrivé de l'image (écran)
				$('#img_sub').animate({'margin-left':-10},vit);
				$(rightInVisible).stop(true, true).animate({'opacity':1},vit);
			}
		}
	}
	// on inverse pour la suite
 	if(rightVisible == '#topright'){
		rightVisible = '#topright2';
		rightInVisible = '#topright';
	}else{
		rightVisible = '#topright';
		rightInVisible = '#topright2';
	}
}


